What are HTML tags & Attributes mandatory for a good Web page in SEO ?
Search engine optimization (SEO) is the process of improving the ranking (visibility) of a website in search engines. The higher (or more frequently) a website is displayed in a search engine list (like Google), the more visitors it is expected to receive.
SEO considers how search engines work, what people search for, and which search terms (words) are typed. Optimizing a website may involve editing the content to increase its relevance to specific keywords. Promoting a site to increase the number of links, is another SEO tactic.
The list of HTML tags and elements that are mandatory for SEO is given below:
HTML title Tag: The <title> tag in HTML is used to define the title of HTML document. It sets the title in the browser toolbar. It provides the default title for the web page when it is added to bookmarks. It displays the title for the page in search engine results. This HTML title tag is one of the most important tags to consider during SEO. The title tag is also displayed in the bold and larger font size when we search for something in the search engine. The content creator and the developer must have to make sure that the title tag is used correctly in order to get a good search engine rank.
<title> Title name </title>
Example: The below image illustrates how the <title> tag will look in the browser as a title of the webpage.
HTML meta Tag: The metadata means information about data. The <meta> tag in HTML provides information about HTML Document or in simple words, it provides important information about a document. The meta tag contains a name attribute. We can set the value of it as ‘description’ and then add the description of the webpage inside the ‘content’ attribute.
<meta name="description" content="Some text about the contents of the webpage">
Best practices in SEO:
- Always keep it short and precise as the search engine will generally keep the first 150-160 words of your meta description and cut the rest.
- If your webpage intends to be displayed in search of a wider range of search keywords then it is better to skip the meta description. In that case, the search engine algorithm will create the description from the text of the webpage with the most searched keywords.
Example: The below image illustrates how the <meta> tag will look in the browser as meta description.
HTML Heading Tags (h1-h6): It is used to define the headings of a page. There are six levels of headings defined by HTML. These 6 heading elements are H1, H2, H3, H4, H5, and H6; with H1 being the highest level and H6 the least.
<h1>Some Text</h1> <h3>Some Text</h3> ... <h6>Some Text</h6>
Best practices in SEO:
- Don’t use more than one <h1> tag inside the entire webpage. Use only one <h1> tag as the heading or visible title of the entire webpage.
- Use h2 for the sections of the webpage and h3 for the subsections. It is better to not go below h3 as this will be confusing for both the user and the search engine algorithm.
- Make the headings related to possible search queries. That will help to rank the website in a better position when the expected query is searched.
Example: The below image illustrates how the heading tags will look on the webpage.
HTML Image ‘alt’ Attribute: The <img> alt attribute is used to specify the alternate text for an image. It is useful when the image is not displayed. It is used to give alternative information for an image.
<img src="image_URL" alt="Image Description">
Best practices in SEO:
- Good descriptive text of one or two lines inside the alt attribute will help the user to figure out what is shown inside the image even if the image is not loaded.
- The keyword searching will not consider the text inside the image alt attribute with higher priority so don’t try to write the search keywords here.
Example: The below image illustrates how the alt attribute of the image tag will look when the image is not displaying.
<img src= "https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png" alt="GeeksforGeeks logo">
HTML5 Semantic Tag: Semantic elements have meaningful names which tell about the type of content. For example header, footer, table, … etc. HTML5 introduces many semantic elements as mentioned below which make the code easier to write and understand for the developer as well as instructs the browser on how to treat them.
Using semantic tags like the article, aside, details help in SEO:
The convention on the right side is much helpful and understandable by the search engine. So it is more useful during SEO.