GENUKI Maintainers' Pages

Version 2.0

HTML Tutorial

W3 schools

For a more complete tutorial on HTML which is easy to read and follow see the W3 Schools website.

Basics

A web page consists of only two elements: the document type declaration, and the root.

The document type declaration is not used by browsers and simply tells a validator which standard of HTML is used in the root.

The root consists of HTML statements enclosed in <html> and </html> tags.

The HTML statements in the root are contained in two segments: the header enclosed in <head> and </head> tags, and the body enclosed in <body> and </body> tags.

References within web pages to other web pages, images, photographs, etc., are made using a Uniform Resource Locator (URL) which defines the location of the resource being sought, and how to obtain the resource. A URL may be absolute or relative (see Managing Your Folders And Files for more details).

Document type

Maintainers may use any HTML document type, provided the HTML code in the web page validates against the named document type. However, the HTML document type preferred on GENUKI is HTML 4.01 Transitional which provides modern structures but also allows more flexibility than a strict format. An acceptable alternative is XHTML 1.0 Transitional.

In the example county and parish web pages, HTML 4.01 Transitional is used. However, tags are in lower case, and tags are closed as required by XML, in case maintainers choose to use XHTML.

The preferred declaration is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html401/loose.dtd">

The header

In between the <head> and </head> tags, GENUKI maintainers would expect to insert:

The body

The body is where most HTML is placed to create a displayable web page. Use can be made of tables, headings, bold, italics, and underline to improve readability. GENUKI maintainers are encouraged to leave font size and color to the choice of readers of GENUKI who often have good reason to wish to choose these for themselves.

Pictures and photographs should be used sparingly and, wherever it's possible to provide a contextual hint, GENUKI maintainers should do so in order to improve accessibility by the visually challenged. These hints are provided by the use of:

Div

The use of <div>, </div> tags to group segments of HTML code provides the ability to associate attributes to the grouping. This is useful when used to associate a class (from a style sheet) or table attributes to all such tables in the grouping.

Termination

There is a standard termination to every GENUKI web page (found in the source of the parish page template) and it's helpful to keep these HTML statements as a snippet to be added quickly and easily to every page.

[Last updated at 07.23 on Tuesday, 15 July 2014, by Mel Lockie. 2014]
Hosted by Mythic Beasts Ltd.