Meta Title<\/b><\/h2>\n
The page title shown by Google and other search engines in the search results is the meta title. A HTML title provides the users with a quick insight into a result’s content and its relevance to the query. It is usually the basic form of information that determines which result to click on. Using high-quality titles on your web pages is very important for SEO. Here is an example of a meta title:<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-4.jpg\")
<\/p>\n
Best Practices<\/b><\/h3>\n\n- Use a special title tag for your pages<\/li>\n
- The titles should be brief and descriptive<\/li>\n
- Avoid using generic and vague titles<\/li>\n
- Use title or sentence case<\/li>\n
- Do not use click-bait but rather something click-worthy<\/li>\n
- Match search intent<\/li>\n
- Use 60 characters or less<\/li>\n
- Include target keywords where necessary<\/li>\n<\/ul>\n
Finding and Fixing Title Tag Mistakes<\/b><\/h3>\n
Make sure that your title tag is not too long nor too short. Avoid unnecessarily long or wordy titles while keeping them concise and descriptive. Ensure that every page has a title tag. Avoid multiple HTML title tags on the page as the search engines may show an irrelevant title tag if there are multiple web pages. Duplicate titles across multiple pages. It is very important that each of your site’s pages has a unique and descriptive title.
\n[post_cta_website_uiux]<\/p>\n
Meta Description<\/b><\/h2>\n
A meta description gives a short description of a web page. Search engines use it to display a web page in the search results. It informs and gains the interest of users using a brief and accurate summary of the contents of a particular page. A meta description reassures the user that they are on the right page and exactly what they are looking for. However, they are not used by Google as a direct ranking factor. The image below shows a meta description:<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-7.jpg\")
<\/p>\n
Best Practices<\/b><\/h3>\n\n- Write a unique and understandable description for each page<\/li>\n
- Provide an accurate summary<\/li>\n
- Do not use generic descriptions<\/li>\n
- Use the main keywords appropriately in a meaningful sentence<\/li>\n
- Use sentence case<\/li>\n
- Do not use click-bait but write something click-worthy<\/li>\n
- Match the purpose of the search<\/li>\n
- Use 160 characters or less<\/li>\n<\/ul>\n
Common Meta Description Mistakes<\/b><\/h3>\n
Most common mistakes in writing a meta description are almost similar to those of title tags.\u00a0 A meta description that is too long or too short. There is usually no limit on the length of a meta description. In order to fit the width of the device, the search results extracted are usually shortened. Another mistake is where a web page completely lacks a meta description.<\/p>\n
Ensure that you write it on your site. You can also have a page with more than one meta description however, this may confuse the search engines. Having similar meta descriptions on multiple pages is also a common mistake. Ensure that each page has its own unique description.<\/p>\n
Meta Robots<\/b><\/h2>\n
Meta robots allow the search engine to crawl web pages and also offer instructions on how to do so. The presence of your site in the search results can have a negative impact if you don’t use the correct attributes in the meta robots tag. Understanding this tag and effectively using it will greatly impact your SEO.<\/p>\n
The index values tell the bots to do the page indexing, while the noindex value instructs the bots not to do the page indexing. The bots are instructed by the following value to crawl links on the page to vouch for them, while the nofollow value instructs them not to crawl links on the page to avoid any endorsement.<\/p>\n
Best Practices<\/b><\/h3>\n
Only use the meta robot tags when restricting Google crawls on a page and avoid blocking pages with meta robot tags in robots.<\/p>\n
Common Meta Robots Mistakes<\/b><\/h3>\n
Some of the typical meta robots mistakes include robots blocking no index pages. This makes it difficult for Google to see the noindex robots tag and may continue indexing the URL. A rogue meta noindex reduces the page’s organic traffic by restricting Google from indexing it. Rogue meta nofollow will prevent Google from crawling the page’s links and reduce the chances of discovering and indexing crucial content. This can also prevent the flow of PageRank to important pages.<\/p>\n
Meta Viewport<\/b><\/h2>\n
A meta viewport sets the web page’s visible area and gives instructions on how the page will be displayed by the browser on different screen sizes. This is important since mobile-friendly web pages are ranked higher in Google’s mobile search results.<\/p>\n
Best Practices<\/b><\/h4>\n
It is crucial that you use meta viewport on all web pages and with the standard tag.<\/p>\n
Meta Charset<\/b><\/h2>\n
This tag determines the character encoding for your page or simply instructs the browser how to display the characters and text on the page. There are two common character sets including UTF-8 used for encoding Unicode and ISO-8859-1 used for encoding the Latin alphabet. Encoding with the wrong character will lead to the browser displaying incorrectly.<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-3.jpg\")
<\/p>\n
(Image Credit: Learn Web Tutorials<\/a>)<\/p>\nCharacter formatting issues result in a negative user experience and your pages can look broken. Other problems it can cause include fewer people linking to your page, low dwell time, low time on page, high bounce rate and the search engine may not understand your content.<\/p>\n
Best Practices<\/b><\/h3>\n\n- Always use meta charset tag on all your web pages<\/li>\n
- Use Unicode\/UTF-8 where possible<\/li>\n<\/ul>\n
It is important to check all your web pages to ensure that they are using UTF-8 encoding.<\/p>\n
Meta Refresh Redirect<\/b><\/h2>\n
This tag redirects the user to another URL after a certain amount of time. Google understands and respects meta refresh redirect tags, but it is best not to use them in SEO. This is because most browsers do not support them and may cause confusion to the user while raising security concerns. It also takes up time since pages require parsing before the destination URL is visible. This is what that tag will look like:<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-6.jpg\")
<\/p>\n
(Image Credit: HostPapa<\/a>)<\/p>\nBest Practices<\/b><\/h3>\n\n- Only use meta refresh redirect tags when necessary<\/li>\n<\/ul>\n
It is best that you avoid using meta refresh redirects where possible since they are a bad practice. If you have them on your web pages, you can use 301 or 302 redirects instead, where possible.<\/p>\n
Meta Keywords<\/b><\/h2>\n
Meta keywords are a good meta tag example that is used often these days. It is not advisable to add the meta keywords tag with a list of target keywords since Google stopped using keywords for rankings. This is because many people stuffed irrelevant keywords without users ever seeing those keywords. Google disregarded the keywords meta tag since it was often abused.<\/p>\n
Bing now uses the keywords meta tag to signal spam, so this could work against you. It is best that you remove the tag from your site.<\/p>\n
Metadata is data that provides information about other data. HTML meta data summarizes basic information about data making it easier to find and work with that particular data. It can be created manually for more accuracy or automatically to offer more basic information. Mata data is used for document files, images, videos, spreadsheets, and web pages.<\/p>\n
What is a Meta Tags Generator?<\/b><\/h2>\n
A meta tags generator allows you to develop the required and most useful HTML meta tags for SEO.<\/p>\n
Best Practices When Using HTML Metadata<\/b><\/h2>\nDeclare a Doctype Always<\/b><\/h3>\n
A doctype declaration should be the first thing in your HTML meta tags for SEO. It notifies the browser about XHTML standards being used. It is advisable to use the XHTML 1.0 strict doctype, although it is considered a tough choice by some developers. It makes sure that your code conforms strictly to the latest standards.<\/p>\n
Use Meaningful Title Tags<\/b><\/h3>\n
Title tags enable the web page to be more meaningful and search-friendly.<\/p>\n
Use Descriptive List of Meta Tags<\/b><\/h3>\n
A list of meta tags adds more meaning to your web page for user agents like search engine spiders. It is important that the description does not have repeated words and phrases since the search engines will detect that. Use simple and straightforward descriptions when explaining your web page’s purpose.<\/p>\n
Divide Your Layout into Major Sections Using Divs<\/b><\/h3>\n
When constructing a website design, consider dividing the web page into sections in the first step. This will promote a clean and well-intended code while helping you to prevent confusion and using divs excessively when writing a complex and long markup.<\/p>\n
Avoid Mixing Content From Presentation<\/b><\/h3>\n
Do not mix your HTML content with the content visual presentation provided by CSS. Creating a separate CSS file for your styles rather than using inline styles in your HTML is very essential. This will enable you and other developers working on the code to make quick changes and ensure that your content is more understandable for user agents.<\/p>\n
Minify and Unify CSS<\/b><\/h3>\n
Typical websites have one major CSS file and probably other things like browser-specific fixes and CSS reset. When each C file makes an HTTP request, it slows down the website load times. Taking out characters that are not needed like newlines, spaces, and tabs from all your code and unify files that can be integrated together. This can help solve that problem and improve the load times of your website.<\/p>\n
Minify, Unify and Move Down JavaScript<\/b><\/h3>\n
Avoid using inline JavaScript but instead, try minifying and unifying your JavaScript libraries to lower the number of HTTP requests needed to generate one of your pages. However, you can not have parallel downloads in most browsers meaning the browser will not download anything else while downloading JavaScript, making the page appear as if it’s loading slowly.<\/p>\n
To avoid this, you can load your JavaScript after loading your CSS by placing the JavaScript at the end of your HTML document where applicable, preferably before closing the body tag.<\/p>\n
Use Heading Elements Wisely<\/b><\/h3>\n
Using h1 to h6 elements to indicate your HTML’s content order makes your content more user-friendly for, user agent, search engines, and screen-reading software. When using blogs, it is best that you use the h1 element for the title of the blog post as opposed to the site’s name since it is ideal for search engines.<\/p>\n
Use the Right HTML tags at the Right Place<\/b><\/h3>\n
It is important that you know the available HTML tags and how to use them accurately to avoid confusion and create a relevant content structure.
\n[post_cta_second]<\/p>\n
Avoid Using Divs Excessively<\/b><\/h3>\n
Some developers wrap div tags on other div tags that have more div tags creating numerous divs. The div is considered a meaningless element that should only be used when there are no other available suitable elements according to the W3C HTML specifications. Avoid having numerous divs by using them responsibly and only when it’s necessary.<\/p>\n
Use an Unordered List for Navigation<\/b><\/h3>\n
The navigation element is a very essential factor in website design when combined with CSS. It helps your navigation menus be semantic and beautiful. Here are two ways to do this:<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-2.jpg\")
<\/p>\n
(Image Credit: Studytonight<\/a>)<\/p>\nClose Your Tags<\/b><\/h3>\n
W3C specifications require that you close all your tags. Other browsers may correctly display your pages even though failure to close your tags is invalid under normal standards.<\/p>\n
Use Lower Case Markup<\/b><\/h3>\n
Keeping your markup lower-cased is a standard practice in the industry. Capitalizing your markup affects your code readability but does not change the display of your web pages.<\/p>\n
Use Modular IE Fixes<\/b><\/h3>\n
If you are having problems with your pages, you can use conditional comments to focus on the internet explorer. Ensure that you make the fixes modular to ensure that your work is future-proof so that the older version of IE will not require any support.<\/p>\n
Validate Your Code<\/b><\/h3>\n
You should not view validation as the end-all evaluation of good work against bad work. A work that validates is not necessarily good code and alternatively, a work that does not fully validate is not necessarily bad code.<\/p>\n
You can use auto-validation services as useful debuggers to identify rendering errors. Validate your work frequently when writing HTML to avoid issues that may be difficult to identify once you have completed your work.<\/p>\n
Write Consistently Formatted Code<\/b><\/h3>\n
Writing a clean and well-intended code base brings out your professionalism and makes it easier for developers who may work on your code. You will also increase the readability of your work when you write a properly indented markup from the start. For example:<\/p>\n
![\"HTML](\"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-1.jpg\")
<\/p>\n
(Image Credit: html.com<\/a>)<\/p>\nAvoid Excessive Comments<\/b><\/h3>\n
The purpose of documenting your code is to make it understandable and commenting your code is reasonable and logical for programming languages like Java, PHP, and C#. However, markup is very self-explanatory and you do not need to comment on every line in XHTML\/ HTML. Reviewing your work for semantics will help you if you are commenting a lot in your HTML to explain the process.<\/p>\n
Diib\u00ae: Get Your HTML Metadata Stats Here!<\/b><\/h2>\n
Using these elements and following the guidelines will help you in your SEO efforts.<\/p>\n
Elements like a good meta description will increase your click-through rates from searches even though it doesn’t improve your ranking. Meta tags are now being used in social media platforms like Twitter and Facebook. You can use tags to check how your data is shared on Facebook. Partnering with Diib Digital will give you the vital metrics regarding your metadata so you can make effective decisions about your website health.<\/p>\n
Here are some of the features of our User Dashboard we’re sure you’ll love:<\/p>\n
\n- Customized Objectives designed to enhance website performance<\/li>\n
- Alerts that tell you about your Domain Authority other technical SEO issues<\/li>\n
- Broken pages where you have backlinks (404 checker)<\/li>\n
- Keyword, backlink, and indexing monitoring and tracking tools<\/li>\n
- User experience and mobile speed optimization<\/li>\n
- Image title optimization<\/li>\n<\/ul>\n
Click here<\/a> for your free scan or simply call 800-303-3510 to speak to one of our growth experts.<\/p>\n","protected":false},"excerpt":{"rendered":"Elements and Best Practices in HTML Metadata Meta tags are brief extracts of a code that inform search engines about crucial information about your webpage. They also control how web browsers display to visitors. Meta tags are present on every web page and you can only see them in the HTML code. Here is a […]<\/p>\n","protected":false},"author":2,"featured_media":4399,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-4392","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo"],"acf":{"faq":"
FAQ's<\/b><\/h2>\r\n\r\n\r\n\r\n\r\n\r\nWhat is metadata in HTML?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThis is the piece of data used by browsers and search engines to define how the page is supposed to be displayed and read and\/or reloaded.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nHow do you add meta tags in HTML?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nIf the file already exists on your website, you can download it using an FTP client and then edit it using your preferred text editor.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nIs HTML a metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nHTML is the official way of adding your metadata to a document. Metadata is data that describes data.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nHow do you use metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThis is a really important way to describe information about documents, videos, images, web pages ect. Information such as the name of the file, the date it was created, how large the file is, resolution, video length, and more.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nWhat is the difference between data and metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThe main difference is that data is just content that can provide a description or even a report on anything. On the other hand, metadata describes the relevant information on said data, giving them more context for data users.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/section>","time_read":"11","menu-side":"Elements and Best Practices in HTML Metadata<\/a>\r\nMeta Title<\/a>\r\nMeta Description<\/a>\r\nMeta Robots<\/a>\r\nCommon Meta Robots Mistakes<\/a>\r\nMeta Viewport<\/a>\r\nMeta Charset<\/a>\r\nMeta Refresh Redirect<\/a>\r\nMeta Keywords<\/a>\r\nWhat is a Meta Tags Generator?<\/a>\r\nDeclare a Doctype Always<\/a>\r\nUse Meaningful Title Tags<\/a>\r\nUse Descriptive List of Meta Tags<\/a>\r\nDivide Your Layout into Major Sections Using Divs<\/a>\r\nAvoid Mixing Content From Presentation<\/a>\r\nMinify and Unify CSS<\/a>\r\nMinify, Unify and Move Down JavaScript<\/a>\r\nUse Heading Elements Wisely<\/a>\r\nUse the Right HTML tags at the Right Place<\/a>\r\nAvoid Using Divs Excessively<\/a>\r\nUse an Unordered List for Navigation<\/a>\r\nClose Your Tags<\/a>\r\nUse Lower Case Markup<\/a>\r\nUse Modular IE Fixes<\/a>\r\nValidate Your Code<\/a>\r\nWrite Consistently Formatted Code<\/a>\r\nAvoid Excessive Comments<\/a>\r\nFAQ's<\/a>","cta_title":"How can diib\u00ae help me improve my website today?","cta_text":"diib\u00ae connects to your Google Analytics account in about 60 seconds (optional to start) and shows you exactly what to fix to grow your website. More than 800,000 businesses use diib, starting with a free website scan. PRO memberships start at just $29.99 a month.<\/p>\r\n
Because we serve so many members, we can also offer wholesale pricing<\/strong> on high-quality services, including:<\/p>\r\n\r\n- Backlink development on DA10\u2013DA80 websites<\/li>\r\n
- Professional Google Analytics setup<\/li>\r\n
- Website speed analysis and optimization<\/li>\r\n
- Keyword research<\/li>\r\n
- Article writing and publishing (500\u20135,000+ words)<\/li>\r\n<\/ul>\r\n
Enter your website below to create your free account and see everything we offer our members.<\/strong><\/p>","new_slogan":"Our AI will Check Your Website for Free in 60 Seconds!","hero_button_text":"Check My Website Free","answer_first":"","meta_description":"","learn_faq_1_question":"","learn_faq_1_answer":"","learn_faq_2_question":"","learn_faq_2_answer":"","learn_faq_3_question":"","learn_faq_3_answer":"","learn_faq_4_question":"","learn_faq_4_answer":"","learn_faq_5_question":"","learn_faq_5_answer":"","learn_faq_6_question":"","learn_faq_6_answer":""},"yoast_head":"\nHTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn<\/title>\n<meta name=\"description\" content=\"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn\" \/>\n<meta property=\"og:description\" content=\"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/\" \/>\n<meta property=\"og:site_name\" content=\"diib\u00ae - Learn\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-13T07:34:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-23T15:44:05+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/marketing-optimization.diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1400\" \/>\n\t<meta property=\"og:image:height\" content=\"934\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Daniel Urmann\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","og_locale":"en_US","og_type":"article","og_title":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","og_description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","og_url":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","og_site_name":"diib\u00ae - Learn","article_author":"https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/","article_published_time":"2024-11-13T07:34:48+00:00","article_modified_time":"2026-09-23T15:44:05+00:00","og_image":[{"width":1400,"height":934,"url":"https:\/\/marketing-optimization.diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Daniel Urmann","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#website","url":"https:\/\/marketing-optimization.diib.com\/learn\/","name":"diib\u00ae - Learn","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/marketing-optimization.diib.com\/learn\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#primaryimage","inLanguage":"en-US","url":"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","contentUrl":"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","width":1400,"height":934,"caption":"HTML Metadata: Included Elements and Best Practices"},{"@type":"WebPage","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#webpage","url":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","name":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","isPartOf":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/#website"},"primaryImageOfPage":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#primaryimage"},"datePublished":"2024-11-13T07:34:48+00:00","dateModified":"2026-09-23T15:44:05+00:00","author":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/#\/schema\/person\/a595ca0fb3b2cc89407e678575ea2c57"},"description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","breadcrumb":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/diib.com\/learn\/"},{"@type":"ListItem","position":2,"name":"HTML Metadata: Included Elements and Best Practices"}]},{"@type":"Person","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#\/schema\/person\/a595ca0fb3b2cc89407e678575ea2c57","name":"Daniel Urmann","image":{"@type":"ImageObject","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/7fda32967ede67ed7bd612042ad452f060bd6475b37fbc7c8fc17d425191d047?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7fda32967ede67ed7bd612042ad452f060bd6475b37fbc7c8fc17d425191d047?s=96&d=mm&r=g","caption":"Daniel Urmann"},"description":"Daniel Urmann is the co-founder of Diib.com. Over the past 17 years Daniel has helped thousands of business grow online through SEO, social media, and paid advertising. Today, Diib helps over 150,000 business globally grow online with their SaaS offerings. Daniel\u2019s interest include SMB analytics, big data, predictive analytics, enterprise and SMB search engine optimization (SEO), CRO optimization, social media advertising, A\/B testing, programatic and geo-targeting, PPC, and e-commerce. He holds a Master of Business Administration (MBA) focused in Finance and E-commerce from Cornell University \u2013 S.C. Johnson Graduate School of Management.","sameAs":["https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/","https:\/\/www.facebook.com\/daniel.urmann.5"],"url":"https:\/\/diib.com\/learn\/author\/dan\/"}]}},"_links":{"self":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/comments?post=4392"}],"version-history":[{"count":4,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392\/revisions"}],"predecessor-version":[{"id":10862,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392\/revisions\/10862"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/media\/4399"}],"wp:attachment":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/media?parent=4392"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/categories?post=4392"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/tags?post=4392"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Finding and Fixing Title Tag Mistakes<\/b><\/h3>\n
Make sure that your title tag is not too long nor too short. Avoid unnecessarily long or wordy titles while keeping them concise and descriptive. Ensure that every page has a title tag. Avoid multiple HTML title tags on the page as the search engines may show an irrelevant title tag if there are multiple web pages. Duplicate titles across multiple pages. It is very important that each of your site’s pages has a unique and descriptive title.
\n[post_cta_website_uiux]<\/p>\n
Meta Description<\/b><\/h2>\n
A meta description gives a short description of a web page. Search engines use it to display a web page in the search results. It informs and gains the interest of users using a brief and accurate summary of the contents of a particular page. A meta description reassures the user that they are on the right page and exactly what they are looking for. However, they are not used by Google as a direct ranking factor. The image below shows a meta description:<\/p>\n
<\/p>\n
Best Practices<\/b><\/h3>\n\n- Write a unique and understandable description for each page<\/li>\n
- Provide an accurate summary<\/li>\n
- Do not use generic descriptions<\/li>\n
- Use the main keywords appropriately in a meaningful sentence<\/li>\n
- Use sentence case<\/li>\n
- Do not use click-bait but write something click-worthy<\/li>\n
- Match the purpose of the search<\/li>\n
- Use 160 characters or less<\/li>\n<\/ul>\n
Common Meta Description Mistakes<\/b><\/h3>\n
Most common mistakes in writing a meta description are almost similar to those of title tags.\u00a0 A meta description that is too long or too short. There is usually no limit on the length of a meta description. In order to fit the width of the device, the search results extracted are usually shortened. Another mistake is where a web page completely lacks a meta description.<\/p>\n
Ensure that you write it on your site. You can also have a page with more than one meta description however, this may confuse the search engines. Having similar meta descriptions on multiple pages is also a common mistake. Ensure that each page has its own unique description.<\/p>\n
Meta Robots<\/b><\/h2>\n
Meta robots allow the search engine to crawl web pages and also offer instructions on how to do so. The presence of your site in the search results can have a negative impact if you don’t use the correct attributes in the meta robots tag. Understanding this tag and effectively using it will greatly impact your SEO.<\/p>\n
The index values tell the bots to do the page indexing, while the noindex value instructs the bots not to do the page indexing. The bots are instructed by the following value to crawl links on the page to vouch for them, while the nofollow value instructs them not to crawl links on the page to avoid any endorsement.<\/p>\n
Best Practices<\/b><\/h3>\n
Only use the meta robot tags when restricting Google crawls on a page and avoid blocking pages with meta robot tags in robots.<\/p>\n
Common Meta Robots Mistakes<\/b><\/h3>\n
Some of the typical meta robots mistakes include robots blocking no index pages. This makes it difficult for Google to see the noindex robots tag and may continue indexing the URL. A rogue meta noindex reduces the page’s organic traffic by restricting Google from indexing it. Rogue meta nofollow will prevent Google from crawling the page’s links and reduce the chances of discovering and indexing crucial content. This can also prevent the flow of PageRank to important pages.<\/p>\n
Meta Viewport<\/b><\/h2>\n
A meta viewport sets the web page’s visible area and gives instructions on how the page will be displayed by the browser on different screen sizes. This is important since mobile-friendly web pages are ranked higher in Google’s mobile search results.<\/p>\n
Best Practices<\/b><\/h4>\n
It is crucial that you use meta viewport on all web pages and with the standard tag.<\/p>\n
Meta Charset<\/b><\/h2>\n
This tag determines the character encoding for your page or simply instructs the browser how to display the characters and text on the page. There are two common character sets including UTF-8 used for encoding Unicode and ISO-8859-1 used for encoding the Latin alphabet. Encoding with the wrong character will lead to the browser displaying incorrectly.<\/p>\n
<\/p>\n
(Image Credit: Learn Web Tutorials<\/a>)<\/p>\nCharacter formatting issues result in a negative user experience and your pages can look broken. Other problems it can cause include fewer people linking to your page, low dwell time, low time on page, high bounce rate and the search engine may not understand your content.<\/p>\n
Best Practices<\/b><\/h3>\n\n- Always use meta charset tag on all your web pages<\/li>\n
- Use Unicode\/UTF-8 where possible<\/li>\n<\/ul>\n
It is important to check all your web pages to ensure that they are using UTF-8 encoding.<\/p>\n
Meta Refresh Redirect<\/b><\/h2>\n
This tag redirects the user to another URL after a certain amount of time. Google understands and respects meta refresh redirect tags, but it is best not to use them in SEO. This is because most browsers do not support them and may cause confusion to the user while raising security concerns. It also takes up time since pages require parsing before the destination URL is visible. This is what that tag will look like:<\/p>\n
<\/p>\n
(Image Credit: HostPapa<\/a>)<\/p>\nBest Practices<\/b><\/h3>\n\n- Only use meta refresh redirect tags when necessary<\/li>\n<\/ul>\n
It is best that you avoid using meta refresh redirects where possible since they are a bad practice. If you have them on your web pages, you can use 301 or 302 redirects instead, where possible.<\/p>\n
Meta Keywords<\/b><\/h2>\n
Meta keywords are a good meta tag example that is used often these days. It is not advisable to add the meta keywords tag with a list of target keywords since Google stopped using keywords for rankings. This is because many people stuffed irrelevant keywords without users ever seeing those keywords. Google disregarded the keywords meta tag since it was often abused.<\/p>\n
Bing now uses the keywords meta tag to signal spam, so this could work against you. It is best that you remove the tag from your site.<\/p>\n
Metadata is data that provides information about other data. HTML meta data summarizes basic information about data making it easier to find and work with that particular data. It can be created manually for more accuracy or automatically to offer more basic information. Mata data is used for document files, images, videos, spreadsheets, and web pages.<\/p>\n
What is a Meta Tags Generator?<\/b><\/h2>\n
A meta tags generator allows you to develop the required and most useful HTML meta tags for SEO.<\/p>\n
Best Practices When Using HTML Metadata<\/b><\/h2>\nDeclare a Doctype Always<\/b><\/h3>\n
A doctype declaration should be the first thing in your HTML meta tags for SEO. It notifies the browser about XHTML standards being used. It is advisable to use the XHTML 1.0 strict doctype, although it is considered a tough choice by some developers. It makes sure that your code conforms strictly to the latest standards.<\/p>\n
Use Meaningful Title Tags<\/b><\/h3>\n
Title tags enable the web page to be more meaningful and search-friendly.<\/p>\n
Use Descriptive List of Meta Tags<\/b><\/h3>\n
A list of meta tags adds more meaning to your web page for user agents like search engine spiders. It is important that the description does not have repeated words and phrases since the search engines will detect that. Use simple and straightforward descriptions when explaining your web page’s purpose.<\/p>\n
Divide Your Layout into Major Sections Using Divs<\/b><\/h3>\n
When constructing a website design, consider dividing the web page into sections in the first step. This will promote a clean and well-intended code while helping you to prevent confusion and using divs excessively when writing a complex and long markup.<\/p>\n
Avoid Mixing Content From Presentation<\/b><\/h3>\n
Do not mix your HTML content with the content visual presentation provided by CSS. Creating a separate CSS file for your styles rather than using inline styles in your HTML is very essential. This will enable you and other developers working on the code to make quick changes and ensure that your content is more understandable for user agents.<\/p>\n
Minify and Unify CSS<\/b><\/h3>\n
Typical websites have one major CSS file and probably other things like browser-specific fixes and CSS reset. When each C file makes an HTTP request, it slows down the website load times. Taking out characters that are not needed like newlines, spaces, and tabs from all your code and unify files that can be integrated together. This can help solve that problem and improve the load times of your website.<\/p>\n
Minify, Unify and Move Down JavaScript<\/b><\/h3>\n
Avoid using inline JavaScript but instead, try minifying and unifying your JavaScript libraries to lower the number of HTTP requests needed to generate one of your pages. However, you can not have parallel downloads in most browsers meaning the browser will not download anything else while downloading JavaScript, making the page appear as if it’s loading slowly.<\/p>\n
To avoid this, you can load your JavaScript after loading your CSS by placing the JavaScript at the end of your HTML document where applicable, preferably before closing the body tag.<\/p>\n
Use Heading Elements Wisely<\/b><\/h3>\n
Using h1 to h6 elements to indicate your HTML’s content order makes your content more user-friendly for, user agent, search engines, and screen-reading software. When using blogs, it is best that you use the h1 element for the title of the blog post as opposed to the site’s name since it is ideal for search engines.<\/p>\n
Use the Right HTML tags at the Right Place<\/b><\/h3>\n
It is important that you know the available HTML tags and how to use them accurately to avoid confusion and create a relevant content structure.
\n[post_cta_second]<\/p>\n
Avoid Using Divs Excessively<\/b><\/h3>\n
Some developers wrap div tags on other div tags that have more div tags creating numerous divs. The div is considered a meaningless element that should only be used when there are no other available suitable elements according to the W3C HTML specifications. Avoid having numerous divs by using them responsibly and only when it’s necessary.<\/p>\n
Use an Unordered List for Navigation<\/b><\/h3>\n
The navigation element is a very essential factor in website design when combined with CSS. It helps your navigation menus be semantic and beautiful. Here are two ways to do this:<\/p>\n
<\/p>\n
(Image Credit: Studytonight<\/a>)<\/p>\nClose Your Tags<\/b><\/h3>\n
W3C specifications require that you close all your tags. Other browsers may correctly display your pages even though failure to close your tags is invalid under normal standards.<\/p>\n
Use Lower Case Markup<\/b><\/h3>\n
Keeping your markup lower-cased is a standard practice in the industry. Capitalizing your markup affects your code readability but does not change the display of your web pages.<\/p>\n
Use Modular IE Fixes<\/b><\/h3>\n
If you are having problems with your pages, you can use conditional comments to focus on the internet explorer. Ensure that you make the fixes modular to ensure that your work is future-proof so that the older version of IE will not require any support.<\/p>\n
Validate Your Code<\/b><\/h3>\n
You should not view validation as the end-all evaluation of good work against bad work. A work that validates is not necessarily good code and alternatively, a work that does not fully validate is not necessarily bad code.<\/p>\n
You can use auto-validation services as useful debuggers to identify rendering errors. Validate your work frequently when writing HTML to avoid issues that may be difficult to identify once you have completed your work.<\/p>\n
Write Consistently Formatted Code<\/b><\/h3>\n
Writing a clean and well-intended code base brings out your professionalism and makes it easier for developers who may work on your code. You will also increase the readability of your work when you write a properly indented markup from the start. For example:<\/p>\n
<\/p>\n
(Image Credit: html.com<\/a>)<\/p>\nAvoid Excessive Comments<\/b><\/h3>\n
The purpose of documenting your code is to make it understandable and commenting your code is reasonable and logical for programming languages like Java, PHP, and C#. However, markup is very self-explanatory and you do not need to comment on every line in XHTML\/ HTML. Reviewing your work for semantics will help you if you are commenting a lot in your HTML to explain the process.<\/p>\n
Diib\u00ae: Get Your HTML Metadata Stats Here!<\/b><\/h2>\n
Using these elements and following the guidelines will help you in your SEO efforts.<\/p>\n
Elements like a good meta description will increase your click-through rates from searches even though it doesn’t improve your ranking. Meta tags are now being used in social media platforms like Twitter and Facebook. You can use tags to check how your data is shared on Facebook. Partnering with Diib Digital will give you the vital metrics regarding your metadata so you can make effective decisions about your website health.<\/p>\n
Here are some of the features of our User Dashboard we’re sure you’ll love:<\/p>\n
\n- Customized Objectives designed to enhance website performance<\/li>\n
- Alerts that tell you about your Domain Authority other technical SEO issues<\/li>\n
- Broken pages where you have backlinks (404 checker)<\/li>\n
- Keyword, backlink, and indexing monitoring and tracking tools<\/li>\n
- User experience and mobile speed optimization<\/li>\n
- Image title optimization<\/li>\n<\/ul>\n
Click here<\/a> for your free scan or simply call 800-303-3510 to speak to one of our growth experts.<\/p>\n","protected":false},"excerpt":{"rendered":"Elements and Best Practices in HTML Metadata Meta tags are brief extracts of a code that inform search engines about crucial information about your webpage. They also control how web browsers display to visitors. Meta tags are present on every web page and you can only see them in the HTML code. Here is a […]<\/p>\n","protected":false},"author":2,"featured_media":4399,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-4392","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo"],"acf":{"faq":"
FAQ's<\/b><\/h2>\r\n\r\n\r\n\r\n\r\n\r\nWhat is metadata in HTML?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThis is the piece of data used by browsers and search engines to define how the page is supposed to be displayed and read and\/or reloaded.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nHow do you add meta tags in HTML?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nIf the file already exists on your website, you can download it using an FTP client and then edit it using your preferred text editor.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nIs HTML a metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nHTML is the official way of adding your metadata to a document. Metadata is data that describes data.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nHow do you use metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThis is a really important way to describe information about documents, videos, images, web pages ect. Information such as the name of the file, the date it was created, how large the file is, resolution, video length, and more.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\nWhat is the difference between data and metadata?<\/a><\/h2>\r\n<\/div>\r\n\r\n\r\n\r\nThe main difference is that data is just content that can provide a description or even a report on anything. On the other hand, metadata describes the relevant information on said data, giving them more context for data users.\r\n\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/section>","time_read":"11","menu-side":"Elements and Best Practices in HTML Metadata<\/a>\r\nMeta Title<\/a>\r\nMeta Description<\/a>\r\nMeta Robots<\/a>\r\nCommon Meta Robots Mistakes<\/a>\r\nMeta Viewport<\/a>\r\nMeta Charset<\/a>\r\nMeta Refresh Redirect<\/a>\r\nMeta Keywords<\/a>\r\nWhat is a Meta Tags Generator?<\/a>\r\nDeclare a Doctype Always<\/a>\r\nUse Meaningful Title Tags<\/a>\r\nUse Descriptive List of Meta Tags<\/a>\r\nDivide Your Layout into Major Sections Using Divs<\/a>\r\nAvoid Mixing Content From Presentation<\/a>\r\nMinify and Unify CSS<\/a>\r\nMinify, Unify and Move Down JavaScript<\/a>\r\nUse Heading Elements Wisely<\/a>\r\nUse the Right HTML tags at the Right Place<\/a>\r\nAvoid Using Divs Excessively<\/a>\r\nUse an Unordered List for Navigation<\/a>\r\nClose Your Tags<\/a>\r\nUse Lower Case Markup<\/a>\r\nUse Modular IE Fixes<\/a>\r\nValidate Your Code<\/a>\r\nWrite Consistently Formatted Code<\/a>\r\nAvoid Excessive Comments<\/a>\r\nFAQ's<\/a>","cta_title":"How can diib\u00ae help me improve my website today?","cta_text":"diib\u00ae connects to your Google Analytics account in about 60 seconds (optional to start) and shows you exactly what to fix to grow your website. More than 800,000 businesses use diib, starting with a free website scan. PRO memberships start at just $29.99 a month.<\/p>\r\n
Because we serve so many members, we can also offer wholesale pricing<\/strong> on high-quality services, including:<\/p>\r\n\r\n- Backlink development on DA10\u2013DA80 websites<\/li>\r\n
- Professional Google Analytics setup<\/li>\r\n
- Website speed analysis and optimization<\/li>\r\n
- Keyword research<\/li>\r\n
- Article writing and publishing (500\u20135,000+ words)<\/li>\r\n<\/ul>\r\n
Enter your website below to create your free account and see everything we offer our members.<\/strong><\/p>","new_slogan":"Our AI will Check Your Website for Free in 60 Seconds!","hero_button_text":"Check My Website Free","answer_first":"","meta_description":"","learn_faq_1_question":"","learn_faq_1_answer":"","learn_faq_2_question":"","learn_faq_2_answer":"","learn_faq_3_question":"","learn_faq_3_answer":"","learn_faq_4_question":"","learn_faq_4_answer":"","learn_faq_5_question":"","learn_faq_5_answer":"","learn_faq_6_question":"","learn_faq_6_answer":""},"yoast_head":"\nHTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn<\/title>\n<meta name=\"description\" content=\"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn\" \/>\n<meta property=\"og:description\" content=\"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/\" \/>\n<meta property=\"og:site_name\" content=\"diib\u00ae - Learn\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-13T07:34:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-23T15:44:05+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/marketing-optimization.diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1400\" \/>\n\t<meta property=\"og:image:height\" content=\"934\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Daniel Urmann\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","og_locale":"en_US","og_type":"article","og_title":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","og_description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","og_url":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","og_site_name":"diib\u00ae - Learn","article_author":"https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/","article_published_time":"2024-11-13T07:34:48+00:00","article_modified_time":"2026-09-23T15:44:05+00:00","og_image":[{"width":1400,"height":934,"url":"https:\/\/marketing-optimization.diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Daniel Urmann","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#website","url":"https:\/\/marketing-optimization.diib.com\/learn\/","name":"diib\u00ae - Learn","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/marketing-optimization.diib.com\/learn\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#primaryimage","inLanguage":"en-US","url":"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","contentUrl":"https:\/\/diib.com\/learn\/wp-content\/uploads\/2021\/01\/html-metadata-cover.jpg","width":1400,"height":934,"caption":"HTML Metadata: Included Elements and Best Practices"},{"@type":"WebPage","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#webpage","url":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/","name":"HTML Metadata: Included Elements and Best Practices - diib\u00ae - Learn","isPartOf":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/#website"},"primaryImageOfPage":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#primaryimage"},"datePublished":"2024-11-13T07:34:48+00:00","dateModified":"2026-09-23T15:44:05+00:00","author":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/#\/schema\/person\/a595ca0fb3b2cc89407e678575ea2c57"},"description":"Discover the best practices and elements for HTML metadata, including meta tags, titles, descriptions, and robots. Optimize your site's performance and SEO with Diib\u00ae.","breadcrumb":{"@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/marketing-optimization.diib.com\/learn\/html-metadata\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/diib.com\/learn\/"},{"@type":"ListItem","position":2,"name":"HTML Metadata: Included Elements and Best Practices"}]},{"@type":"Person","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#\/schema\/person\/a595ca0fb3b2cc89407e678575ea2c57","name":"Daniel Urmann","image":{"@type":"ImageObject","@id":"https:\/\/marketing-optimization.diib.com\/learn\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/7fda32967ede67ed7bd612042ad452f060bd6475b37fbc7c8fc17d425191d047?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7fda32967ede67ed7bd612042ad452f060bd6475b37fbc7c8fc17d425191d047?s=96&d=mm&r=g","caption":"Daniel Urmann"},"description":"Daniel Urmann is the co-founder of Diib.com. Over the past 17 years Daniel has helped thousands of business grow online through SEO, social media, and paid advertising. Today, Diib helps over 150,000 business globally grow online with their SaaS offerings. Daniel\u2019s interest include SMB analytics, big data, predictive analytics, enterprise and SMB search engine optimization (SEO), CRO optimization, social media advertising, A\/B testing, programatic and geo-targeting, PPC, and e-commerce. He holds a Master of Business Administration (MBA) focused in Finance and E-commerce from Cornell University \u2013 S.C. Johnson Graduate School of Management.","sameAs":["https:\/\/www.linkedin.com\/in\/daniel-urmann-1927147b\/","https:\/\/www.facebook.com\/daniel.urmann.5"],"url":"https:\/\/diib.com\/learn\/author\/dan\/"}]}},"_links":{"self":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/comments?post=4392"}],"version-history":[{"count":4,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392\/revisions"}],"predecessor-version":[{"id":10862,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/posts\/4392\/revisions\/10862"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/media\/4399"}],"wp:attachment":[{"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/media?parent=4392"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/categories?post=4392"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/diib.com\/learn\/wp-json\/wp\/v2\/tags?post=4392"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Common Meta Description Mistakes<\/b><\/h3>\n
Most common mistakes in writing a meta description are almost similar to those of title tags.\u00a0 A meta description that is too long or too short. There is usually no limit on the length of a meta description. In order to fit the width of the device, the search results extracted are usually shortened. Another mistake is where a web page completely lacks a meta description.<\/p>\n
Ensure that you write it on your site. You can also have a page with more than one meta description however, this may confuse the search engines. Having similar meta descriptions on multiple pages is also a common mistake. Ensure that each page has its own unique description.<\/p>\n
Meta Robots<\/b><\/h2>\n
Meta robots allow the search engine to crawl web pages and also offer instructions on how to do so. The presence of your site in the search results can have a negative impact if you don’t use the correct attributes in the meta robots tag. Understanding this tag and effectively using it will greatly impact your SEO.<\/p>\n
The index values tell the bots to do the page indexing, while the noindex value instructs the bots not to do the page indexing. The bots are instructed by the following value to crawl links on the page to vouch for them, while the nofollow value instructs them not to crawl links on the page to avoid any endorsement.<\/p>\n
Best Practices<\/b><\/h3>\n
Only use the meta robot tags when restricting Google crawls on a page and avoid blocking pages with meta robot tags in robots.<\/p>\n
Common Meta Robots Mistakes<\/b><\/h3>\n
Some of the typical meta robots mistakes include robots blocking no index pages. This makes it difficult for Google to see the noindex robots tag and may continue indexing the URL. A rogue meta noindex reduces the page’s organic traffic by restricting Google from indexing it. Rogue meta nofollow will prevent Google from crawling the page’s links and reduce the chances of discovering and indexing crucial content. This can also prevent the flow of PageRank to important pages.<\/p>\n
Meta Viewport<\/b><\/h2>\n
A meta viewport sets the web page’s visible area and gives instructions on how the page will be displayed by the browser on different screen sizes. This is important since mobile-friendly web pages are ranked higher in Google’s mobile search results.<\/p>\n
Best Practices<\/b><\/h4>\n
It is crucial that you use meta viewport on all web pages and with the standard tag.<\/p>\n
Meta Charset<\/b><\/h2>\n
This tag determines the character encoding for your page or simply instructs the browser how to display the characters and text on the page. There are two common character sets including UTF-8 used for encoding Unicode and ISO-8859-1 used for encoding the Latin alphabet. Encoding with the wrong character will lead to the browser displaying incorrectly.<\/p>\n
<\/p>\n
(Image Credit: Learn Web Tutorials<\/a>)<\/p>\n Character formatting issues result in a negative user experience and your pages can look broken. Other problems it can cause include fewer people linking to your page, low dwell time, low time on page, high bounce rate and the search engine may not understand your content.<\/p>\n It is important to check all your web pages to ensure that they are using UTF-8 encoding.<\/p>\n This tag redirects the user to another URL after a certain amount of time. Google understands and respects meta refresh redirect tags, but it is best not to use them in SEO. This is because most browsers do not support them and may cause confusion to the user while raising security concerns. It also takes up time since pages require parsing before the destination URL is visible. This is what that tag will look like:<\/p>\n (Image Credit: HostPapa<\/a>)<\/p>\n It is best that you avoid using meta refresh redirects where possible since they are a bad practice. If you have them on your web pages, you can use 301 or 302 redirects instead, where possible.<\/p>\n Meta keywords are a good meta tag example that is used often these days. It is not advisable to add the meta keywords tag with a list of target keywords since Google stopped using keywords for rankings. This is because many people stuffed irrelevant keywords without users ever seeing those keywords. Google disregarded the keywords meta tag since it was often abused.<\/p>\n Bing now uses the keywords meta tag to signal spam, so this could work against you. It is best that you remove the tag from your site.<\/p>\n Metadata is data that provides information about other data. HTML meta data summarizes basic information about data making it easier to find and work with that particular data. It can be created manually for more accuracy or automatically to offer more basic information. Mata data is used for document files, images, videos, spreadsheets, and web pages.<\/p>\n A meta tags generator allows you to develop the required and most useful HTML meta tags for SEO.<\/p>\n A doctype declaration should be the first thing in your HTML meta tags for SEO. It notifies the browser about XHTML standards being used. It is advisable to use the XHTML 1.0 strict doctype, although it is considered a tough choice by some developers. It makes sure that your code conforms strictly to the latest standards.<\/p>\n Title tags enable the web page to be more meaningful and search-friendly.<\/p>\n A list of meta tags adds more meaning to your web page for user agents like search engine spiders. It is important that the description does not have repeated words and phrases since the search engines will detect that. Use simple and straightforward descriptions when explaining your web page’s purpose.<\/p>\n When constructing a website design, consider dividing the web page into sections in the first step. This will promote a clean and well-intended code while helping you to prevent confusion and using divs excessively when writing a complex and long markup.<\/p>\n Do not mix your HTML content with the content visual presentation provided by CSS. Creating a separate CSS file for your styles rather than using inline styles in your HTML is very essential. This will enable you and other developers working on the code to make quick changes and ensure that your content is more understandable for user agents.<\/p>\n Typical websites have one major CSS file and probably other things like browser-specific fixes and CSS reset. When each C file makes an HTTP request, it slows down the website load times. Taking out characters that are not needed like newlines, spaces, and tabs from all your code and unify files that can be integrated together. This can help solve that problem and improve the load times of your website.<\/p>\n Avoid using inline JavaScript but instead, try minifying and unifying your JavaScript libraries to lower the number of HTTP requests needed to generate one of your pages. However, you can not have parallel downloads in most browsers meaning the browser will not download anything else while downloading JavaScript, making the page appear as if it’s loading slowly.<\/p>\n To avoid this, you can load your JavaScript after loading your CSS by placing the JavaScript at the end of your HTML document where applicable, preferably before closing the body tag.<\/p>\n Using h1 to h6 elements to indicate your HTML’s content order makes your content more user-friendly for, user agent, search engines, and screen-reading software. When using blogs, it is best that you use the h1 element for the title of the blog post as opposed to the site’s name since it is ideal for search engines.<\/p>\n It is important that you know the available HTML tags and how to use them accurately to avoid confusion and create a relevant content structure. Some developers wrap div tags on other div tags that have more div tags creating numerous divs. The div is considered a meaningless element that should only be used when there are no other available suitable elements according to the W3C HTML specifications. Avoid having numerous divs by using them responsibly and only when it’s necessary.<\/p>\n The navigation element is a very essential factor in website design when combined with CSS. It helps your navigation menus be semantic and beautiful. Here are two ways to do this:<\/p>\n (Image Credit: Studytonight<\/a>)<\/p>\n W3C specifications require that you close all your tags. Other browsers may correctly display your pages even though failure to close your tags is invalid under normal standards.<\/p>\n Keeping your markup lower-cased is a standard practice in the industry. Capitalizing your markup affects your code readability but does not change the display of your web pages.<\/p>\n If you are having problems with your pages, you can use conditional comments to focus on the internet explorer. Ensure that you make the fixes modular to ensure that your work is future-proof so that the older version of IE will not require any support.<\/p>\n You should not view validation as the end-all evaluation of good work against bad work. A work that validates is not necessarily good code and alternatively, a work that does not fully validate is not necessarily bad code.<\/p>\n You can use auto-validation services as useful debuggers to identify rendering errors. Validate your work frequently when writing HTML to avoid issues that may be difficult to identify once you have completed your work.<\/p>\n Writing a clean and well-intended code base brings out your professionalism and makes it easier for developers who may work on your code. You will also increase the readability of your work when you write a properly indented markup from the start. For example:<\/p>\n (Image Credit: html.com<\/a>)<\/p>\n The purpose of documenting your code is to make it understandable and commenting your code is reasonable and logical for programming languages like Java, PHP, and C#. However, markup is very self-explanatory and you do not need to comment on every line in XHTML\/ HTML. Reviewing your work for semantics will help you if you are commenting a lot in your HTML to explain the process.<\/p>\n Using these elements and following the guidelines will help you in your SEO efforts.<\/p>\n Elements like a good meta description will increase your click-through rates from searches even though it doesn’t improve your ranking. Meta tags are now being used in social media platforms like Twitter and Facebook. You can use tags to check how your data is shared on Facebook. Partnering with Diib Digital will give you the vital metrics regarding your metadata so you can make effective decisions about your website health.<\/p>\n Here are some of the features of our User Dashboard we’re sure you’ll love:<\/p>\n Click here<\/a> for your free scan or simply call 800-303-3510 to speak to one of our growth experts.<\/p>\n","protected":false},"excerpt":{"rendered":" Elements and Best Practices in HTML Metadata Meta tags are brief extracts of a code that inform search engines about crucial information about your webpage. They also control how web browsers display to visitors. Meta tags are present on every web page and you can only see them in the HTML code. Here is a […]<\/p>\n","protected":false},"author":2,"featured_media":4399,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-4392","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo"],"acf":{"faq":" diib\u00ae connects to your Google Analytics account in about 60 seconds (optional to start) and shows you exactly what to fix to grow your website. More than 800,000 businesses use diib, starting with a free website scan. PRO memberships start at just $29.99 a month.<\/p>\r\n Because we serve so many members, we can also offer wholesale pricing<\/strong> on high-quality services, including:<\/p>\r\n Enter your website below to create your free account and see everything we offer our members.<\/strong><\/p>","new_slogan":"Our AI will Check Your Website for Free in 60 Seconds!","hero_button_text":"Check My Website Free","answer_first":"","meta_description":"","learn_faq_1_question":"","learn_faq_1_answer":"","learn_faq_2_question":"","learn_faq_2_answer":"","learn_faq_3_question":"","learn_faq_3_answer":"","learn_faq_4_question":"","learn_faq_4_answer":"","learn_faq_5_question":"","learn_faq_5_answer":"","learn_faq_6_question":"","learn_faq_6_answer":""},"yoast_head":"\nBest Practices<\/b><\/h3>\n
\n
Meta Refresh Redirect<\/b><\/h2>\n
<\/p>\nBest Practices<\/b><\/h3>\n
\n
Meta Keywords<\/b><\/h2>\n
What is a Meta Tags Generator?<\/b><\/h2>\n
Best Practices When Using HTML Metadata<\/b><\/h2>\n
Declare a Doctype Always<\/b><\/h3>\n
Use Meaningful Title Tags<\/b><\/h3>\n
Use Descriptive List of Meta Tags<\/b><\/h3>\n
Divide Your Layout into Major Sections Using Divs<\/b><\/h3>\n
Avoid Mixing Content From Presentation<\/b><\/h3>\n
Minify and Unify CSS<\/b><\/h3>\n
Minify, Unify and Move Down JavaScript<\/b><\/h3>\n
Use Heading Elements Wisely<\/b><\/h3>\n
Use the Right HTML tags at the Right Place<\/b><\/h3>\n
\n[post_cta_second]<\/p>\nAvoid Using Divs Excessively<\/b><\/h3>\n
Use an Unordered List for Navigation<\/b><\/h3>\n
<\/p>\nClose Your Tags<\/b><\/h3>\n
Use Lower Case Markup<\/b><\/h3>\n
Use Modular IE Fixes<\/b><\/h3>\n
Validate Your Code<\/b><\/h3>\n
Write Consistently Formatted Code<\/b><\/h3>\n
<\/p>\nAvoid Excessive Comments<\/b><\/h3>\n
Diib\u00ae: Get Your HTML Metadata Stats Here!<\/b><\/h2>\n
\n
FAQ's<\/b><\/h2>\r\n
What is metadata in HTML?<\/a><\/h2>\r\n<\/div>\r\n
How do you add meta tags in HTML?<\/a><\/h2>\r\n<\/div>\r\n
Is HTML a metadata?<\/a><\/h2>\r\n<\/div>\r\n
How do you use metadata?<\/a><\/h2>\r\n<\/div>\r\n
What is the difference between data and metadata?<\/a><\/h2>\r\n<\/div>\r\n
\r\n