HTML Fundamentals – The Head Section

The HTML code you use in your page's body directly affects what your visitors see. If you post an image or specific line of text, the change is immediate and obvious.

Your page's head is not directly visible, but it can have a tremendous impact on how your page looks. In a nutshell, the head section of an HTML page is the area between the <head></head> tags. Here are a few items which most head sections will possess.

External links – Most webmasters use Cascading Style Sheets, or CSS, to format their sites. You can link to an external style sheet in your page header and the page will apply that style sheet's rules. This can be a tremendous time-saver in the long run, since you can put all your formatting rules in one document. If you need to change a rule later, you can do so in one place instead of having to go through every page.

You can also link to other types of external pages, such as Javascript programs. Again, this allows you to call on one document from several different pages, saving you a great deal of time (and, incidentally, reducing bandwidth demands as well).

Page title – You can define your page's title in the head section and this title will show up in the top bar of your visitors' browsers when they view the page. To define a title, you enter a line into the head as follows:

<title> HTML Fundamentals – The Head Section – HTML</title>

This title will also determine the linked text when your page shows up in a list of search results, so a good title can really help with search engine optimization.

Page description – This tag allows you to briefly describe your page and/or website. The description is not displayed for visitors; rather, it appears under the linked title when your page shows up in a list of search results. Like the title, a helpful page description can improve your search engine turnover. A description tag looks like this:

<meta name="description" content="Don't neglect the head section of your webpage. Here are some useful items you can include that will really make a difference with your site.">

Keywords – Search engines don't pay as much attention to your "meta keywords" as they once did, but why throw away a few optimization points by neglecting them? The keyword portion of your header is never visible; it's used only by search engines. A meta keyword tag looks like this:

<meta name="keywords" content="HTML, CSS, head tags, HTML code, javascript, cascading style sheets, meta tags, page title, external links">