« Previous Next »

What is Tags in HTML

Learn about HTML tags and their role in web development

What are Tags in HTML?

Tags in HTML are the basic building blocks of any webpage. They are used to define the structure and content of a webpage. Each tag serves a specific purpose, such as displaying text, creating links, embedding images, or formatting content. Tags are enclosed in angle brackets and are often paired with opening and closing tags to specify the start and end of an element.

For example:

  • <h1>: Defines the main heading of a page or section.
  • <p>: Defines a paragraph of text.
  • <ul>: Defines an unordered list.
  • <a>: Defines a hyperlink.

Why Use Tags in HTML?

HTML tags are essential for creating web pages. They provide structure and help organize content. Tags make web pages accessible to both users and search engines, ensuring that the content is correctly displayed and understood.

Here are some key reasons why tags are used in HTML:

  • Content Structuring: Tags help organize content in a meaningful way. For example, headings like <h1> and <h2> define the hierarchy of information on the page.
  • SEO Optimization: Proper use of tags helps search engines understand and index the content correctly, improving search visibility.
  • Accessibility: Tags help assistive technologies, like screen readers, understand the content and provide a better experience for people with disabilities.
  • Styling: Tags can be targeted with CSS to apply different styles to specific elements on the page, improving the visual appeal and usability.

Image Tag Example:


Basic Code Examples

        
        <!DOCTYPE html>
        <html lang="en">
          <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Welcome To My Tags Page</title>
          </head>
          <body>
              <img src="sea.jpg" alt="Example Image">    
            </body>
        </html>


Output

             
          Example Image

Meta Tags for Character Encoding


Basic Code Examples

    
    <!DOCTYPE html>
      <html lang="en">
          <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Welcome To My Tags Page</title>
            
This has no output

          </head>
          <body>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
          </body>
      </html>

HTML Link to Stylesheet

Basic Code Examples

      
      <!DOCTYPE html>
      <html lang="en">
        <head>
          <meta charset="UTF-8">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
          <title>Welcome To My Tags Page</title>
        </head>
        <body>
          <link rel="stylesheet" href="styles.css">
        </body>
      </html>
« Previous Next »