Social Meta Tags for Google, Twitter and Facebook


Meta tags are the HTML or XHTML <meta … > element used to provide structured metadata about a Web page. Multiple Meta tags with different attributes are often used on the same page. Meta tags can be used to specify page description, keywords and any other metadata not provided through the other head elements and attributes.The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.

Note: <meta> tags always goes inside the <head> element. Metadata is always passed as name/value pairs. In HTML the <meta> tag has no end tag. In XHTML the <meta> tag must be properly closed.

I have already posted the blog with name META Tags for HTML.

Meta Tags for Discoverability

This helps to improves Google ownership for search engine optimization(SEO).
<meta property="place:location:latitude" content="13.062616"/>
<meta property="place:location:longitude" content="80.229508"/>
<meta property="business:contact_data:street_address" content="Street Name"/>
<meta property="business:contact_data:locality" content="City Name"/>
<meta property="business:contact_data:postal_code" content="ZIP Code"/>
<meta property="business:contact_data:country_name" content="Country"/>
<meta property="business:contact_data:email" content="cotact@mail.com"/>
<meta property="business:contact_data:phone_number" content="+91 1234567890"/>
<meta property="business:contact_data:website" content="http://www.website.com"/>

Google Plus

Here add you website details.
<meta itemprop="name" content="Website Name"/>
<meta itemprop="description" content="Website Description"/>
<meta itemprop="image" content="https://website.com/image250X250.png"/>

Google Structured Data Testing Tool
http://www.google.com/webmasters/tools/richsnippets

Twitter

<meta name="twitter:card" content="summary"/>
<meta name="twitter:site" content="Website Name"/>
<meta name="twitter:title" content="Website Name">
<meta name="twitter:description" content="Website  Description"/>
<meta name="twitter:creator" content="Author Name"/>
<meta name="twitter:image:src" content="https://website.com/image250X250.png"/>
<meta name="twitter:domain" content="website.com"/>

Twitter Verification - Validate your website here
https://dev.twitter.com/docs/cards/validation/validator

Facebook

Modify with your website and Facebook profile details.
<meta property="og:type" content="profile"/> 
<meta property="profile:first_name" content="First Name"/> 
<meta property="profile:last_name" content="Last Name"/>
<meta property="profile:username" content=""/>
<meta property="og:title" content="Website Name"/>
<meta property="og:description" content="Website  Description"/>
<meta property="og:image" content="https://website.com/image250X250.png"/>
<meta property="og:url" content="http://www.website.com"/>
<meta property="og:site_name" content="Website Name"/>
<meta property="og:see_also" content="http://www.website.com"/>
<meta property="fb:admins" content="Facebook_ID"/>

Facebook debugger tool to validate meta information
https://developers.facebook.com/tools/debug

Meta Tags for HTML


Meta tags are the HTML or XHTML <meta … > element used to provide structured metadata about a Web page. Multiple Meta tags with different attributes are often used on the same page. Meta tags can be used to specify page description, keywords and any other metadata not provided through the other head elements and attributes.The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.

Note: <meta> tags always goes inside the <head> element. Metadata is always passed as name/value pairs. In HTML the <meta> tag has no end tag. In XHTML the <meta> tag must be properly closed.


One way to improve your blog SEO (Search Engine Optimization) is to add in description and keywords meta tags. They are placed inside the head section of your blog template HTML.

Defining the Description for Search Engine:


<meta name="description" content="Free Tutorials Point">

Defining Keyword for Search Engine:


<meta name="keywords" content="HTML5,CSS3,JavaScript,PHP,MySQL,Blogger">

Defining Author of Site or Blog:


<meta name="author" content="Bilal Raza">

Specify the name of the Web application that the page represents:


<meta name="application-name" content="Blogger">

Specify the software packages used to generate the document:


<meta name="generator" content="M.S. Office">

Specify the character encoding for the HTML Document:


<meta charset="UTF-8">

Specify the time interval (in sec.) of the HTML Document in Every 30 Second:


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

New HTML5 - Video Tutorials in Urdu & Hindi



HTML5 is a markup language used for structuring and presenting content for the World Wide Web and a core technology of the Internet. It is the fifth revision of the HTML standard (created in 1990 and standardized as HTML 4 as of 1997) and, as of December 2012, is a candidate recommendation of the World Wide Web Consortium (W3C). Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices (web browsers, parsers, etc.).

What is HTML5?


  • HTML5 is the latest standard for HTML.
  • The previous version of HTML, HTML 4.01, came in 1999, and the internet has changed significantly since then.
  • HTML5 was designed to replace both HTML 4, XHTML, and the HTML DOM Level 2.
  • It was specially designed to deliver rich content without the need for additional plugins. The current version delivers everything from animation to graphics, music to movies, and can also be used to build complicated web applications.
  • HTML5 is also cross-platform. It is designed to work whether you are using a PC, or a Tablet, a Smartphone, or a Smart TV.

HTML5 - New Features

Some of the most interesting new features in HTML5 are:
  • The <canvas> element for 2D drawing
  • The <video> and <audio> elements for media playback
  • Support for local storage
  • New content-specific elements, like <article>, <footer>, <header>, <nav>, <section>
  • New form controls, like calendar, date, time, email, url, search

Here is New HTML5 - Video Tutorials in Urdu & Hindi:

HTML5 & CSS3 website layout - Video Tutorial in Urdu & Hindi

HyperText Markup Language (HTML) is the main markup language for creating web pages and other information that can be displayed in a web browser.

In this video tutorial we'll learn how to create make/create a complete website using HMTL & CSS and we’ve used HTML5 & CSS3 while creating this project, this tutorial is in Urdu & Hindi and there are total 8 parts, so you should watch each of them to understand it completely.


Here is the Tutorials of HTML5 & CSS3 website layout with 8 Parts.


HTML5 & CSS3 website layout in Urdu & Hindi part1:


HTML5 & CSS3 website layout in Urdu & Hindi part2:


HTML5 & CSS3 website layout in Urdu & Hindi part3:


HTML5 & CSS3 website layout in Urdu & Hindi part4:


HTML5 & CSS3 website layout in Urdu & Hindi part5:


HTML5 & CSS3 website layout in Urdu & Hindi part6:


HTML5 & CSS3 website layout in Urdu & Hindi part7:


HTML5 & CSS3 website layout in Urdu & Hindi part8: