Head Content
What is Head Content?
We know that every web page is designed using the basic structure of Web Page in which the first section called the Head Section. This section is designed by using <head> Tag that illustrate about the Head Content in it. Head Tag is a Container Tag that contains meta data means data about data of Web Page. Like Other Container tags <head> Tag also have opening and closing.
Head Element works as a container for <title>, <script>, <style>, <link>, <base> & <meta> element. These elements or tags are used inside the Head Element to define the document.
Head Elements inside the Head tag are used to define meta data or information about the Web Page or Document. Meta Data is nothing but a data about the web Page or Document.
 |
| Head Container or Head Element |
Head Section Elements-
 |
Head Elements |
1. Title Element- This element is used to give a title of your web page or document. Title Information is given on Tab Section or in Title bar in Browser. In terms of Search Engine Optimization (SEO), Title Element content is very useful because Search Engine processes the Webpages according to the Title of Webpage in result list. So title is very important if programmer wants good ranking of web page.
To apply this Element we use <title> tag inside <head> container tag. Title of Web Page must be appropriate and meaningful according to the content of web page.
Let us take an Example by following steps in Notepad or any HTML Editor-
A. Open Notepad and write the code given below and save it as .html file.
B. Open file using any Browser in out case we se Google Chrome Browser and see the effect given in Title Bar.
 |
| Title Element or Title Tag |
2. Style Element- This tag is used to give an attractive look to your web page. By Style tag we can put different type of styles coding so that after implementation your webpage looks attractive.
Let Us take an Example of <style> tag with its output-
 |
| Style Element or Style Tag |
3. Link Element- This element or tag is used to link external files. Mostly we will use this tag to link external Cascading Style Sheet Files.
Let use Understand <link> tag with an Example: abc.css is an external CSS file and abc.html is an HTML file which uses link tag to link CSS file.
 |
| Link Element or Link Tag |
4. Script Element- The script element is used to add Client Side Scripting Language like Javascript. To include script in HTML page we use <script> tag.
Let us take an Example to understand how script works-
 |
| Script Element or Script Tag |
5. Meta Element- This tag or element is used to provide some specification for web page like author, keywords, description, viewport and character set. Browser not displaying the content of <meta> tag but <meta> tag teaches the browser, how to display data and search engine works on keywords of <meta> tag for web page ranking.
Let us take an Example of each-
a) Define Character Set-
<meta charset="UTF-8">
b) Define Author of Web Page-
<meta name="author" content="Ankur Saxena">
c) Define Keywords of Webpage for Search Engine-
<meta name="keywords" content="BCom Notes, BCA Notes, Web Design Notes">
d) Define Web Page Description-
<meta name="description" content="This Website provides easy notes to learner!">
e) Define Webpage refreshment time (time in second-example 10sec)-
<meta http-equiv="refresh" content="10">
f) Define viewport for all devices(this will automatically adjust content on device or we can say this provide instruction to control device dimension and scaling of webpage)-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6. Base Element- This tag is used to provide base address for all the URL's used in Webpage. We do not need to use complete path for relative addresses if we use <base> element. In this tag two properties are exist href and target. We can use either any one or both with <base> element. We can use only one <base> tag in Complete Web page.
Let us take an Example-
 |
| Base Element or Base Tag |
No comments:
Post a Comment