0% found this document useful (0 votes)
4 views

HTML Metadata cheat sheet

This document provides a comprehensive cheat sheet for HTML meta tags, detailing their structure and types used for SEO and responsive design. It includes examples of basic meta tags, HTTP-equiv tags, and mobile-specific tags to improve web page categorization and user experience. The conclusion emphasizes the importance of using meta tags effectively in web applications.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
4 views

HTML Metadata cheat sheet

This document provides a comprehensive cheat sheet for HTML meta tags, detailing their structure and types used for SEO and responsive design. It includes examples of basic meta tags, HTTP-equiv tags, and mobile-specific tags to improve web page categorization and user experience. The conclusion emphasizes the importance of using meta tags effectively in web applications.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML Meta Tags Cheat Sheet

Meta tags are essential for conveying information to search engines and improving the
categorization of web pages. Here’s a concise guide to the structure and types of meta tags you can
use in your web applications.

Structure of a Meta Tag

• Name: Identifies the property. Example: <meta name="author" content="name">

• Content: Specifies the property's value. Example: <meta name="language"


content="english">

• Charset: Defines the character encoding for the page. Commonly used is UTF-8: <meta
charset="UTF-8">

• HTTP-equiv: Simulates HTTP response headers. Example: <meta http-equiv="refresh"


content="30"> (refreshes the page every 30 seconds).

Basic Meta Tags for SEO

• <meta name="description" content="Your page description here"/>: Provides a brief


description of the web page.

• <meta name="title" content="Your Page Title"/>: Specifies the title of the web page.

• <meta name="author" content="name">: States the author of the page.

• <meta name="language" content="english">: Specifies the language of the web page.

• <meta name="robots" content="index,follow"/>: Instructs search engines on how to crawl


or index the page.

• <meta name="google" content="nositelinkssearchbox"/>: Prevents Google from showing


the sitelinks search box for your page.

• <meta name="googlebot" content="notranslate"/>: Indicates that you do not want


automatic translation for your page.

• <meta name="revised" content="Date and Time"/>: Specifies the last modified date and
time of the page.

• <meta name="rating" content="safe for kids"/>: Indicates the expected audience for your
page.

• <meta name="copyright" content="Copyright 2022"/>: Specifies copyright information.

HTTP-equiv Meta Tags

• <meta http-equiv="content-type" content="text/html">: Specifies the document format


returned by the server.

• <meta http-equiv="default-style" content="style.css">: Specifies the default stylesheet.


• <meta http-equiv="refresh" content="30">: Refreshes the page every 30 seconds.

• <meta http-equiv="Content-Language" content="en">: Specifies the language of the page.

• <meta http-equiv="Cache-Control" content="no-cache">: Instructs the browser on caching


behavior.

Responsive Design / Mobile Meta Tags

• <meta name="format-detection" content="telephone=yes"/>: Makes telephone numbers


clickable links.

• <meta name="HandheldFriendly" content="true"/>: Indicates that the page is optimized for


mobile devices.

• <meta name="viewport" content="width=device-width, initial-scale=1.0"/>: Sets the


viewport to control layout on mobile browsers.

Conclusion

Keeping this cheat sheet handy will help you effectively implement meta tags in your web
applications, enhancing both SEO and user experience.

You might also like