Using Web Standards in Web Pages

WWW is a common space where users can share information to work together, play, and socialize. But in this period of tremendous growth, the Web needs guidance to realize its full potential. Web standards provide the necessary guidance and help to ensure that everyone has access to the information we are providing, and also make web development faster and more enjoyable.

Standards compliance makes it easier for the people with special needs to utilize the Web to its fullest. Blind people may have their computer read web pages to them. People with poor eyesight may have pages rearranged and magnified for easier reading. And people using hand-held devices can browse the Web just as easily as those using high-end workstations.

W3C standards

HTML 4.0 – HyperText Markup Language
XML 1.0 – Extensible Markup Language
XHTML 1.0, 1.1, and Modularization
CSS – Cascading Style Sheets
DOM 1 – Document Object Model Level 1

HTML/XHTML as a standard

HTML has evolved during its development, and is available in several versions. All of these versions are standards, and you can select one that meets your requirement. Most of the time, the latest version will be the best choice, unless you target a very specific audience, or older, broken browsers. The version you choose defines the elements and attributes you can use.

For example, in HTML 4.01, you will find the list of elements and the list of attributes you are allowed to use in your pages. You can edit your pages manually, a means usually referred to as “hand-coding” or “writing the source”.

List of elements:

List of attributes

Advantages of Using Web Standards:

  1. Greater visibility in web searches.
  2. Gives opportunity of validating your page with a validation service.
  3. Compliant documents can easily be migrated for devices such as TVs and PDAs.
  4. Enables Kids to enjoy the web surfing using graphical browsers used to enhance high-end graphics and animations views.
  5. Enables people with disabilities (using Braille or voice browsers) to browse the Internet with ease.
  6. Compatibility with the future browsers.
  7. Cross browser compatibility.

Structuring Web Pages Using XHTML

XHTML (Extensible Hypertext Markup Language) is similar to HTML. If anyone knows how to create Web Pages using HTML, then he already know most of what he need to know about creating Web pages using XHTML. Although HTML can define both the appearance and the structure of a Web page, XHTML defines the structure of a Web page while relying on other technologies, such as CSS (Cascading Style Sheets), to state the formatting information. XHTML is a markup language like HTML, but was made to conform to the XML standard. XML is a widely used industry standard. XHTML was an attempt to create a language for constructing Web pages that conforms to the standards and principles of XML. You can think of XHTML as an effort to revise the HTML language using XML.

There are some differences between HTML and XHTML the most well-known being that, unlike HTML, XHTML requires all tags to have a closing tag. Most HTML tags have a closing tag; some do not, such as the break tag <br>. But in XHTML these tags must have a closing tag. If the tag does not enclose any content, such as the <br> tag, you can add a forward slash (/) preceded by a space to the opening tag instead of using two tags, as in <br />. The tag <br /> is the correct XHTML version of the HTML <br> tag. All tag names are lowercase in XHTML. So, the HTML tag is only valid in XHTML as <body>. All attribute names in XHTML must also be lowercase and all of the values within tags must be with in quotation marks.

Standards in XHTML
XHTML is a single language; it consists of two major standards: XHTML Strict and XHTML Transitional. XHTML Strict requires XHTML code to strictly follow the rules of the XML standard. XHTML Transitional is not as strict as XHTML Strict and it was intentionally made to be less strict to help bridge the gap between the loose, more forgiving HTML standard of yesterday and the stricter, less forgiving XHTML standard of today. XHTML Transitional was made to be just that – transitory – so it is not a good idea to standardize on XHTML Transitional. XHTML Transitional is more like a short-term resolution for quickly recreating existing HTML.

Because XHTML is stricter than HTML and requires the use of other technologies such as Cascading Style Sheets (CSS) to create Web pages, creating Web pages using XHTML will initially take more time. XHTML is also less forgiving than HTML when a Web page’s code contains errors. Many of today’s Web developers use specialized tools to create Web pages. Any of the tools that are more than a couple of years old may not be able to create valid XHTML Web pages without upgrading or replacing the software. Because XHTML uses CSS to format Web page elements, users must also learn how to implement CSS if they want their Web pages to resemble those created with just HTML.

In general, if we want to create Web pages that will stay alive on the Internet for a long period, we should use XHTML to ensure that our Web pages will be compatible with Web browsers of the future. If we are simply creating a Web page for short term use, we can use HTML instead of XHTML to structure and format our Web page.

Cascading Style Sheets (CSS) for Web pages

Our HTML documents can be displayed using different output styles using CSS. HTML tags were originally developed to define the content of a document but Styles sheets define HOW HTML elements are to be displayed. All major browsers support Cascading Style Sheets. As a Website designer we can define a style for each HTML element and apply it to as many Web pages as we want. To make a global change, simply change the style, and all elements in the Web are updated automatically.

CSS allows developers to control the style and presentation of multiple Web pages all at once. Style sheets allow style details to be specified in many ways. Styles can be defined inside a single HTML element, inside the element of an HTML page, or in an external CSS file. Even multiple external stylesheets can be referenced inside a single HTML page. An inline style defined in an HTML element has the highest priority, which means that it will skip a style declared inside the tag, in an external style sheet.

selector {property: value}

body {color: blue}