XHTML Tutorial
XHTML Tags Types
XHTML Documents
First Web Page
Page Content
List Structure
Styles
Color Styles
Span and Division
Style & Classes
Font Tags
Special Characters
Lists Style
Element Position
Text Links
Redirecting Pages
Traversing Folders
Tables
Table Borders
Table Colors
Table Groupings
Creating Framesets
Form Controls
Group Boxes
Form Submission


Free Tutorials
Internet
What is Internet
Internet Games
Learn TCP IP
HTML
Learn HTML
Learn DHTML
Learn CSS
Learn XML
Learn XHTML
Learn WML
Database
Learn Access
Learn Data-VB
Learn Oracle
Learn SQL
Programming
Learn ActiveX
Learn C++
Learn CGI_Perl
Learn Interdev
Learn Java
Learn JavaScript
Learn Vbscript
Learn VisualBasic
Learn VC++
Operating systems
Learn RedHat
Learn Unix
Learn Winnt
Page Content

Previous Next


XHTML tags have the primary purpose of structuring and arranging text and graphic content on a Web page. They are not designed to style or decorate the content, only to arrange it so that information is presented in a visual order for ease of reading and in a logical order for enhanced understanding.

There are, of course, numerous ways to style page presentations. You can apply different sizes, colors, and font styles to text, and you can size and decorate images. Throughout these tutorials you are introduced to styling methods that add these kinds of visual appeal to text and graphic elements. First, however, it is necessary to become familiar with the basic tags that bring order to page content.

Editor versus Browser Displays

Recall that Web page design begins with a standard document setup that gives its overall structure. This page template is reproduced below.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD/XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml11-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>...enter page title here</title>
</head>
<body>

  ...enter content here

</body>
</html>

Each page you design begins with this coding. You need to code an appropriate title for the page within the <title> tag. This text appears in the browser’s Title Bar when you open the page. Then you add information content inside the <body> tag. Only the information appearing in the body of the document shows up in the browser window. It is inside the <body> tag where text and graphic images are placed, surrounded by XHTML tags to order and arrange them.

It is important to understand that no formatting of Web pages takes place except through XHTML tags.

A heading appears at the top of the document and all paragraphs are separated from one another by single blank lines. Care has been taken to enter information in the editor in much the same way it is to appear in the browser. This practice should be followed so that the editor display itself is orderly and readable. However, editor formatting has little to do with how the entered information appears as a Web page.

Its appearance is very different from its display in the editor. The reason is, of course, that no XHTML tags appear in the document to guide the browser in laying out the text on the page. Therefore, the browser treats the information as one continuous string of text. All blank spaces and line breaks appearing in the editor are collapsed to single blank spaces separating the words; the result is a single block of text on the page.

Over the next several topics you are introduced to a basic set of XHTML tags to bring order and structural formatting to page content. Initial focus is on text arrangement; later, basic tags for adding graphic images and links are introduced. The examples are rather simple when it comes to styling. For the time being, though, you need to learn the structural aspects of page design; you will learn styling techniques beginning with the next tutorial.


Previous Next





|  About us | Categories | New Releases | Most Popular | Web Tutorial | Free Download | Drivers |



2013 Soft Lookup Corp. Privacy Statement