Code has been added to clipboard!

HTML meta Tag

Reading time 2 min
Published Jun 29, 2017
Updated Oct 2, 2019

HTML meta: Main Tips

  • With meta tags, HTML metadata can be defined.
  • In Greek, meta means beyond. Thus, metadata is not displayed on the web page: it is only parsable by the machine.
  • Using the meta tag, keywords, descriptions, and other information can be specified for the page.
  • HTML meta tags must be placed inside the <head> element.
  • You can use one or multiple meta tags in one document.

Using HTML meta Tags

The content between HTML meta tags is supplementary information about a website which is not displayed in the page:

Example
<head>
<meta charset="UTF-8">
<meta name="description" content="Learn to code!">
<meta name="keywords" content="HTML, PHP, JavaScript">
<meta name="author" content="The BitDegree Team">
</head>

Metadata is useful in search engine optimization (SEO). Search engines use meta keywords to gather information about the content your website offers its users.

Note: you can also set the viewport using your meta tags to control the visible page areas. However, not every browser supports that.

Udacity
Pros
  • Simplistic design (no unnecessary information)
  • High-quality courses (even the free ones)
  • Variety of features
Main Features
  • Nanodegree programs
  • Suitable for enterprises
  • Paid certificates of completion
Coursera
Pros
  • Professional service
  • Flexible timetables
  • A variety of features to choose from
Main Features
  • Professional certificates of completion
  • University-level courses
  • Multiple Online degree programs
Datacamp
Pros
  • Great user experience
  • Offers quality content
  • Very transparent with their pricing
Main Features
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable

Tag-specific Attributes for <meta>

charset sets the character encoding for the webpage:

Example
<meta charset="UTF-8">

Tip: defining character encoding helps prevent cross-scripting attacks. You should use UTF-8 or another ASCII-compatible encoding.

name sets a name for the metadata (e.g., meta keywords, author, etc.):

Example
<meta name="description" content="Learn to code">

http-equiv defines a pragma directive. All the possible values have the same names as certain HTTP headers (i.e., content-security-policy or refresh), hence the name:

Example
<meta http-equiv="refresh" content="30">

content defines the value for the name or http-equiv attribute:

Example
<meta name="description" content="Learn to code">
<meta name="keywords" content="HTML, HTML Meta Tag">

scheme used to set the context in which the value of the content attribute should have been interpreted (a format):

Example
<meta name="date" content="2019-08-04" scheme="YYYY-MM-DD">

Note: the scheme attribute has been made obsolete in HTML5.

Browser support

Browser image
Chrome
All
Browser image
Edge
All
Browser image
Firefox
1+
Browser image
IE
All
Browser image
Opera
All
Browser image
Safari
All

Mobile browser support

Browser image
Chrome
All
Browser image
Firefox
4+
Browser image
Opera
All
Browser image
Safari
All

Latest Udacity Coupon Found:

Verified STAFF PICK

75% OFF COURSES

Udacity Black Friday Offer

The best time to save on Udacity courses is now - follow this coupon to access a 75% Udacity Black Friday discount & enjoy learning at a very low cost!

Expiration date: 27/02/2021
3176 People Used
Only 97 Left
Rating
5.0