logo
g Text Version
Auto
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Society & Culture
Sports
Travel & Leisure
TV & Movies

dailyclick
Bored? Games!
Postcards
Astrology
Take a Quiz
Rate My Photo

new
Journals
Folklore and Mythology
Business Coach
Marriage
Senior Living
Ethnic Beauty
Adolescence


dailyclick
All times in EST

Autism Spectrum Disorders: 4:00 PM

Full Schedule
g
g Web Design Site
June Kaminski
BellaOnline's Web Design Editor

g

XHTML : Web Coding for Refined Design


XHTML 1.0 and 1.1 stand for EXtensible HyperText Markup Language and represent a giant leap forward from HTML 4.0. They combine the best of HTML 4.0 with XML to give the designer a more sophisticated coding schema for refined and more decisive web design.

The W3C, parents of all the HTML languages, described XHTML 1.0 as "the first major change to HTML since HTML 4.0 was released in 1997. It brings the rigor of XML to Web pages and is the keystone in W3C's work to create standards that provide richer Web pages on an ever increasing range of browser platforms including cell phones, televisions, cars, wallet sized wireless communicators, kiosks, and desktops."

XHTML Variations

Three distinct types of XHTML are available to meet the needs of all web designers. These include Strict, Transitional and Frameset XHTML.

XHTML 1.0 Strict - the purest form for experienced web designers. This versions allows you to create squeaky clean code, without having to insert layout code (font, color, layout) throughout your document. Instead, you incorporate Cascading Style Sheet (CSS) code at the beginning.

XHTML 1.0 Transitional - a middle of the road code format to help designers who need time to learn this new means of coding, or wish to accommodate viewers who still use older web browsers. Style sheets are used but good old HTML code is also incorporated. For instance the body tag still includes the bgcolor, text, links, vlinks attributes.

XHTML 1.0 Frameset - this variation is self explanatory - you use it when you want to incorporate XHTML into a frame based document.

Still another more advanced version, XHTML 1.1 allows modular code to be added for international and other special coding needs. RUBY modules are incorporated in order to facilitate this extra coding. The single most significant change in XHTML 1.1 is the uncoupling of data from presentation. Formatting is no longer embedded with data and can only be achieved by referencing Cascading Style Sheets (CSS). This leaves data available for easy parsing and reuse by a wide range of new non-desktop products and accessibility applications.

Tidying Up Your HTML

The W3C's Dave Raggett and Source Forge currently offer a great open-source utility, HTML Tidy to designers who want to convert their current HTML documents to XHTML (and tidy up their code in the process). This handy tool will help your code to shine by performing all of these helpful tasks:

  • Missing or mismatched end tags are detected and corrected

  • End tags in the wrong order are corrected

  • Fixes problems with heading emphasis

  • Recovers from mixed up tags

  • Adding the missing slash in end tags for anchors

  • Perfecting lists by putting in missing tags

  • Missing quotes around attribute values are added

  • Unknown/Proprietary attributes are reported

  • Proprietary elements are recognized and reported as such

  • Tags lacking a terminating bracket are spotted

  • Replaces excess layout code with style properties and rules using CSS

  • Deletes empty paragraph and heading elements

The Nitty Gritties

One of the primary "rules" when using XHTML is that the code must be clean and complete.

  • All elements must have closing tags, and nest properly.

  • All tags must be written in lower case - XML is case-sensitive.

  • End tags must be included for ALL elements

  • All attributes must be in quotes eg. width, colspan, rowspan

  • Empty elements must have an end tag


A Helping Hand


Feeling overwhelmed about learning yet another HTML format? Help is at hand, if so. XStandard is an WYSIWYG code editor that helps you write clean pure XHTML code in XHTML 1.0 Strict or XHTML 1.1. The creators describe this software as: "the most advanced, standards-based WYSIWYG editor on the market. It is ideal for any Windows or browser-based content managment system that supports ActiveX. XStandard manages rich content in any language, has strong accessibility features, and supports popular editing options including tables, wrapping of text around images, and file drag & drop into the editor." The software comes in a free XStandard Lite version and a more versatile XStandard Pro version.

If you want your site to work well in today’s browsers and non–traditional devices, and to continue to work well in tomorrow’s, it’s a good idea to author new sites in XHTML, and to convert old pages to XHTML as your work schedule permits. Of course, this isn't the end! Already, work is being done to creat XHTML 2.0. The move is to focus solely on structure, not backward compatibility. You can read about this newest form of XHTML at the IBM website in their article, The Web's Future: XHTML 2.0.


HTML Highlight Article Series

PART 1: Should a Credible Designer Know HTML?
PART 2: HTML 3.2 - The Birth of Wilbur
PART 3: HTML 4.0 AND 4.01 - More of a Good Thing!
PART 4: XHTML : Web Coding for Refined Design
PART 5: DHTML : Dynamic Web Coding


W3C - XHTML 1.0 Guide
XHTML Tutorial at W3schools.com
HTML Tidy Library Project
RSS
Related Articles
Previous Features
Site Map

Add XHTML+%3A+Web+Coding+for+Refined+Design to Twitter Add XHTML+%3A+Web+Coding+for+Refined+Design to Facebook Add XHTML+%3A+Web+Coding+for+Refined+Design to MySpace Add XHTML+%3A+Web+Coding+for+Refined+Design to Del.icio.us Digg XHTML+%3A+Web+Coding+for+Refined+Design Add XHTML+%3A+Web+Coding+for+Refined+Design to Yahoo My Web Add XHTML+%3A+Web+Coding+for+Refined+Design to Google Bookmarks Add XHTML+%3A+Web+Coding+for+Refined+Design to Stumbleupon Add XHTML+%3A+Web+Coding+for+Refined+Design to Reddit


Content copyright © 2009 by June Kaminski. All rights reserved.
This content was written by June Kaminski. If you wish to use this content in any manner, you need written permission. Contact June Kaminski for details.

g


For FREE email updates, subscribe to the Web Design Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor

g features
Free Happy Holidays Web Template

Join the Co-Creation Wave!

Folksonomies add Web 2.0 Fun to Your Web Site!

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter

jobs
what
job title, keywords
where
city, state or zip
jobs by job search


vote
Growing a Garden
Veggies and Flowers
Veggies Only
Flowers Only
No Garden

g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2009 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor