Web Page Quick Reference
If you encounter terms about web page construction in your reading on this website that you don't understand, you can refer to our quick reference for more information.
Anchor Tag
The anchor tag <a></a> is used to create hyperlinks on a web page. See Hyperlink.
Body
The body section of an HTML document will actually include the document heading and the footer of the page. It will contain all the text that is visible on the web page.
Body Tag
The body tag <body></body> consists of 2 tags (open and close) that enclose or contain the code that produces the visible content of a web page.
Basic HTML Page Code
The actual HTML code for a basic web page is very simple:
<html>
<head></head>
<body>
Hello World
</body>
</html>
This code saved in a text file with a .html extension and viewed with a browser, would produce the words Hello World on your computer screen.
Basic HTML Page - HTML Code Tutor
Division Tag
The division tag <div></div> can be used to divide a web page into sections.
Division Tag - HTML Code Tutor
Embedded Style Sheets
Embedded style sheets are placed in the head section of a web page.
Embedded Style Sheets - HTML Code Tutor
Fonts
Fonts are type faces. They should be designated using CSS (style sheets). Some of the most commonly used are arial, verdana, tahoma and times new roman.
Footer
A footer is usually placed at the very bottom of a document. It can contain copyright information, company information and sometimes information about the age of a web page.
Heading of a document
The document heading of a web page is part of the body. For website consistency it should be the same throughout your website. It usually includes your company logo and a slogan relating to website content. Some websites include advertisements as a part of the document heading.
Head Section
The head section of a web page is enclosed in these tags: <head></head>. It is very important. It contains your title tag, meta tags and other information for the visiting browser. It contains information for search engine spiders or bots that is used to index the web page and determine its ranking.
Header Tag
The header tag <h1></h1> is used to display large letters at the top of a page or paragraph. The header tag is important not only for good page structure, but is also used by search engine spiders in page ranking. Header tags should be keyword rich. They come in 6 different sizes. H1 is the largest.
Horizontal Rule Tag
The horizontal rule <hr>tag simply produces a line on the page for separating page sections or paragraphs.
You can also use borders for this purpose.
Horizontal Rule Tag - HTML Code Tutor
Hyperlink - Anchor Tag
Hyperlinks are the underlined words on a web page. When they are clicked the user is sent to a desired location set in the anchor tag code.
Inline Style Sheets
Inline style sheets can be placed in the actual code of the web page. They are placed as an attribute of a tag. style="". Example: <h1 style="color: #ff0000"></h1>. They should be used sparingly, as they add to the size of a web page.
Using Inline Style Sheets - HTML Code Tutor
Intradocument Hyperlinks
Intradocument hyperlinks are often used to send a user to a location on the same web page that the hyperlink is located on. This document is an example. It requires the use of 2 anchor tags. They can also be used to send a user to a specific location on another web page, defined by the <a name=""></a> tag.
Intradocument Hyperlinks - HTML Code Tutor
Images as Hyperlinks
Images can be used as hyperlinks.
Images as Links - HTML Code Tutor
Images on Web Pages
Images are pictures that are placed on web pages. The most popular file formats for images are GIF, JPG and PNG. Other formats can be used but some browsers may not recognize them.
Images in Paragraphs
Images can be placed right in your paragraphs. Their location is set using the align attribute.
Example: <p> <img align="right">Some text in the paragraph </p>
Images in Paragraphs - HTML Code Tutor
Layouts for Web Pages
Our basic layouts or web page structures are produced using single row tables.
Webpage Layout - Website Design Tutorial
Meta Tags
Meta tags <meta></meta>are placed in the head section of an HTML page. The most common are description and keywords. They are used to supply information about the content of the page for search engines. They do have other purposes.
Paragraph Tag
Paragraphs on a web page are controlled using the paragraph tag <p></p>. The fonts and alignment properties for paragraphs are best set using style sheets. If you are still using an HTML editor that uses inline coding for defining fonts - GET RID OF IT!.
Paragraph Tag - HTML Code Tutor
Span Tag
The span tag <span style=""></span> is an inline tag that can be used to change the appearance of text within a paragraph. You can add color or bolding, change the size or even the style of the font for emphasis.
Style Sheets
Style sheets (CSS) are used to format the appearance of a web page. The can be placed in a separate text file, in the head section of a document or as inline code.
Style Sheets - HTML Code Tutor
Tables
Tables are structures on a web page that can be divided into rows and columns. They are often used to dispaly data in chart form. They can also be used to structure web pages.
It was once considered bad programming to structure a page with tables. Today you'll find the practice used by most web designers. Create liquid pages using relative (percentage) width settings, rather than absolute settings.
Basic Tables - HTML Code Tutor
Template - Web Page Template - Website Template
A template, web page template or website template is a prebuilt web page that can be modified to suit a user's needs. The web page can be completed by adding your own text and images. Templates can be a single web page or they can be several linked web pages.
Build Template - Website Design Tutorial
Title Tag
The title tag <title></title> is one of the most important elements of a web page. It is found in the head section of all web pages. The text between the title tags appears on the blue bar on the top of the browser window.
It is one of the most important factors used by search engine spiders to index or rank your page. It should be keyword rich.
It should also be written in such a way that it attracts the attention of surfers who will see it in a list of pages returned by a search engine query.
Welcome, won't get it!.
Definitions
CSS
Cascading Style Sheet - Code used to format the apperance of text and structures on a web page.
Liquid
Liquid web pages are constructed in such a manner that they adapt to different monitor resolution settings and browser widths. Best results are obtained by setting page and element dimensions in percentages, rather than absolute values.
