Monday, September 13, 2010

Page titles

Many designers are so keen to get pages online that they forget to provide a title for each
page. Titles are added using the title element, as follows:
<title>IMAGES FROM ICELAND - photography by Craig Grannell</title>
The title is usually shown at the top of the browser window (and sometimes within the
active tab, if you’re using a browser that has a tabbed interface); the results of the previous
code block are shown in the following image

 

By default, web design packages usually do one of the following things with regard to the
title element:
Add no content.
Set the title element’s content as “Untitled Document.”
Set the title element’s content as the application’s name.The first of these results in no title being displayed for the web page and is invalid XHTML,
while the second means your page joins the legions online that have no title. The third
option is just as bad: using your web page to advertise the application you used to create
it. Therefore, add a title to every web page you create—in fact, make it one of the first
things you do, so you don’t forget.
With regard to the content of your web page titles, bear in mind that this is often the most
prominent thing returned in search engine results pages. Keep titles clear, concise, and
utterly to the point. Use too many words and the title will be clipped; use too few (or try
to get arty with characters) and you may end up with something that stumps search
engines and potential visitors, too.
Generally speaking, for the homepage at least, it’s good to include the name of the site or
organization, followed by an indication of the site’s reason for existence (and author or
location, if relevant). For instance, as shown in the following image, the Snub
Communications title includes the organization’s name, the primary services it offers, and
its author.

 
Some designers use the same title throughout their site. This is a bad idea—web page titles
are used as visual indicators by visitors trawling bookmarks or their browser’s history. This
is why I generally tend to use titles as a breadcrumb navigation of sorts, showing where a
page sits within the website’s hierarchy, like this:
<title>Company name - Services - Service name</title>
THE ESSENTIAL GUIDE TO CSS AND HTML WEB DESIGN

No comments:

Post a Comment