This page summarise some basic information about producing web pages.
Cascading Style Sheets (CSS) is a language used to describe the look and layout of a document written in a markup language such as XHTML.
Pretty much quoting Wikipedia: CSS is designed primarily to enable the separation of document content (for sourgumdrop.org.uk written in XHTML) from document presentation, including elements such as the colors, fonts, and layout. This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple pages to share formatting, and reduce complexity. CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. While the author of a document typically links that document to a CSS stylesheet, readers can use a different stylesheet, perhaps one on their own computer, to override the one the author has specified.
In practice it means that not only is content separated from document presentation, but users of the programs released here, need to understand far less XHTML: most of the necessary code is contained in the CSS, and that should not need changing.
Extensible Hypertext Markup Language, or XHTML is the language used, with CSS, to code these web pages. The XHTML knowledge needed to code these pages is small (I wrote them). To add or modify pages simply find one that looks like the one you want to produce and copy its XHTML and CSS class use.
All XHTML documents must have a DOCTYPE declaration. The html, head, title, and body elements must be present. This is an XHTML document with a minimum of required tags:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Title here</title> </head> <body> </body> </html>
Meta data provides information about a document rather than document content.
It provides information for search engines, and here we use 2 meta data types:
<meta name="description" content="...>
<meta name="keywords" content="...>
This data are components of criteria used in determining page ranking (how high the page is listed in search results). See Search engine optimisation(SEO) for more information.
If you are interested in Search Engine Optimisation, according to SEO Logic title tags should be 66 characters long for Google, 120 for Yahoo. Keywords should be 10-15 unique words or phrases - most important first. Description should be limited to 170-200 characters.
The W3C have a Markup Validation Service for XHTML and CSS. Languages have vocabulary, syntax and grammar. The validators check files to see if they follow these rules. Following the rules does not ensure a good web page, but is an important part of getting a page displayed correctly by modern web browsers: if you don't follow the rules the browser has to guess at what you meant!
Pages that pass are
entitled to display these icons:
The program check_pages will send files to the W3C validator for checking.
There are two types of sitemap: those for users, like the one at the bottom of this page, and those for web crawlers. The user sitemap for sourgumdrop.org.uk was created by make_sitemap.
When you create a new website or make changes to an existing one it's a good idea to help web crawlers find your new pages. This is done using a sitemap which is an XML file that lists the URLs for a site. Web crawlers will look for this file and use it to crawl the site.
The format for the sitemap is recognised by the major search engines, including those of Google, Microsoft and Yahoo. I get my sitemaps made by XML-Sitemaps.com and put a copy in the directory containing my web pages. Via my webmaster account at Google I also submit new copies of the sitemap whenever I make major changes.
Indexing robots crawl the web following links to provide the data used by search engines. Sites can limit the scope of this by use of the Robots exclusion standard. This requires a simple text file called robots.txt to be placed in the site's root directory. An example is shown in Figure 3.
# Allows all robots User-agent: * Disallow: /test
A favicon or website icon is a 16x16 pixel icon associated with a website. The sourgumdrop.org.uk site uses:
I use Portable Network Graphics(PNG) format, one of the officially recognised formats even though it is not properly supported by Microsoft browsers. This is true of all the files on this site.
Having a favicon file on the site can stop errors being generated by browsers expecting to find one. The same is true for the robots.txt file.
