HTML Tags
HTML Tags are the build blocks of webpage. Tags are used to add content into html, like text, headings, table, list links etc. Tags along with attributes are core components of HTML. The latest version of HTML, i.e HTML5 includes 145 tags. View HTML Tags List.
HTML tags are used to build webpage structure, like p, h1, h2, h3, address, b, i, etc. Tags can have attributes to add extra information.
HTML Element
An HTML Tag with opening tag, closing tag, attributes and content is called HTML Element. Element include start tag, end tag, attributes and content inside.
Basically all HTML Elements are build using html tags.
HTML Tag <html>
HTML or HTML Tag is the parent tag of all HTML Elements. Its is also called root tag. HTML Tag is defined just after doctype declaration. To know more about html doctype, click html doctype.
HTML Tag has two children, head tag and body tag. Since HTML3, It is compulsory to define doctype and then HTML tag.
lang attribute is used inside html tag to define language. An option dir="ltr" is also used to add direction which is by default left to right.
For Urdu and Arabic, use dir="rtl" in html tag.
<!doctype html>
<html lang="en">
<head>
<title> Title of the webpage </title>
<meta charset="utf-8" >
</head>
<body>
</body>
<html> HEAD Tag
HTML Head tag is the first child of HTML. Head includes all the information related to webpage seo, css links, scripts and meta tags.
Head is not visible to user. It is mainly for search engines and browsers.
Tags in head
- Title Tag
- Meta Tag
- Link Tag
- Script Tag
- Style Tag
- Base Tag
HTML head tags
<!doctype html>
<html lang="en">
<head>
<title> Title of the webpage </title>
<meta charset="utf-8" >
<base href="https://tutorial.techaltum.com/htmlTags.html">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="keywords" content="Keywords">
<meta name="description" content="Search Description">
<link href="css/style.css" rel="stylesheet">
<style></style>
<script></script>
</head>
<body>
Body Content
</body>
</html>
BODY Tag <body>
HTML Body Tag is used to define the body of our HTML Document, basically the content visible to user.
The Body Tag contain all visible contents of a web page like paragraph, headings, tables, lists, images, videos visible to user.
By default, body is 100% wide, having white background and took a margin of 8px.
<body>
Body tag for content visible to user
</body>
TITLE TAG
HTML Title Tag is the compulsory child of HEAD. Title is compulsory and should be unique on all webpages. Title enhance search engine visibility of a webpage on various search engines. Maximum limits of characters inside title tag is 70 for maximum search engines.
Always use the first targeted keyword in title for best seo results.
<title> Title of the webpage </title>
META CHARSET
Meta charset was introduced in HTML5. Earlier meta tag with content and http-equiv was used to declare charset.
Meta charset is used to declare webpage character encoding. The recommended charset for maximum websites is UTF-8. The default charset for windows OS is windows-1252.
windows-1252
windows-1252 was build bu Windows Operating System for western languages like engish, spanish only. Use ASCII characters from 32 to 255 range. Not recommend for modern websites and apps.
UTF-8
(Unicode Transformation Format - 8-bit) supports 1 lakhs plus characters including ASCII and emoji. Recommended for modern website and applications.
UTF-8 vs Windows-1252
| Feature | Windows-1252 | UTF-8 |
|---|---|---|
| Max characters | 256 | Over 1.5 million |
| Fixed length? | Yes (1 byte) | No (1-4 bytes) |
| Language support | Western European | All languages |
| Legacy or modern? | Legacy | Modern standard |
HTML5 Meta Charset
<meta charset="utf-8">
HTML4 Meta Charset
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
XHTML Meta Charset
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
It is compulsory to declare meta charset on all webpages.
UTF-8 encoding is used by 98.7% websites worldwide including google, facebook, youtube, techaltum and tutorial.techaltum.com.