HTML doctype declaration and meta tag elements

doctype declaration and meta elements help in SEO


DOCTYPE :

The very first thing declare in any HTML document is a DTD "Document  Type Definition" or "doctype", known as Public Text Identifier. This make sure the parsed of the document and which version of the HTML mode the web browser should render. Doctype also determines which rules should apply to validate HTML document.  

<!DOCTYPE html>

html: 

`<html> is a root element and should declare after the "doctype". All other metadata and elements should be inside this opening and closing tag.

<!DOCTYPE html>
<html>...</html>

head:

<head> element contain metadata such as title, link, description, style sheets, scripts and more. <head> is a first child element of an <html> element.

meta:

the <meta> element is a metadata (machine-readable information) that describes information about the HTML document. It also help in SEO (Search Engine Optimization).

There are many different <meta> elements, here we are describing some <meta> elements.

1. charset: 

This element helps the web page to handle displaying any language. There is a list of character - encoding but you should always use UTF-8, it supports all the characters and symbols in the world.

<meta charset="utf-8">

2. language:

You can set the language by language attribute to the opening HTML tag. It is a global attribute help the screen reader for correct pronunciation and tells the search engines in which language the HTML document written.

<html lang="en">...</html>

3. description and author:

We use name and content to define author and provide description. Both meta is useful its own way. 

Author meta is for the content author, who wrote the post or article. Web description meta provide short information about web page, search engine use it on their result page.

<meta name="author" content="Web Diary">
<meta name="description" content="this post is about doctype declaration and meta element that help to improve in seo ranking in some way.>

4. robots: 

With that meta tag you can tell how search engines or web crawlers should behave.

noindex:

It prevent specific pages to be indexed such as shopping carts, specific content and internal searches.

<meta name="robots" content="noindex">  

index:

It tells the search engines to index the web pages and show in search results.

<meta name="robots" content="index">  

nofollow:

It prevent the crawlers to follow the hyperlinks of your website for specific reasons such as thankyou, congratulation pages and specific article.

<meta name="robots" content="nofollow">   

follow:

It allow the crawlers to follow the links on a page.

<meta name="robots" content="follow">   

noodp:

It tells the crawlers to not use directory's title or description in search results for your pages.

<meta name="robots" content="noodp">  

5. Viewport:

It is a responsive meta tag that help to fix the layout on devices. With this meta tag you can set the size of viewport that is a visible area of the devices and initial-scale that controls the zoom level, when the page is first loaded.

Mostly site has this -

<meta name="viewport" content="width=device-width, initial-scale=1">

0 Comments:

Post a Comment