| Tableless webpage design using divs (4) |
Why use DIVs?
What most designers want is a series of easy steps they can follow in order to produce a beautifully designed web page, it would also be pretty nice too if the web page worked on a range of different browsers and continued to work for a number of years. What a table-less layout offers is design using a set of standards that has been universally accepted by software vendors and designers alike. These standards have been devised by W3C using CSS2.
Why abandon tables?
The first point to make is that tables were never intended to be layout or design objects, a table rather is supposed to be a tabular device to hold data when spread-sheet like presentation is required. If it is used as such – that is fine, but if it is being used for design then technically it is being misused.
Layers by contrast always have been layout objects. They were originally designed as such; however, different browsers required different syntax for layers – what is more they proved amazingly difficult to use for standard web design. So designers turned to tables instead.
Recent advances is CSS now mean that DIV layers are far easier to use and more reliable. Using table-less design:
- meets accessibility requirements;
- means that pages index better on search engines;
- makes it easier to provide a common standard for websites;
- makes pages far smaller (quite often by 300 to 400 percent) – this can significantly speed up server operation;
- are easier to use for layout than tables – once you have understood the basics of layers.
XHTML
The Extensible HyperText Markup Language, or XHTML, is a markup language that has the same expressive possibilities as HTML, but a stricter syntax. It uses the same standards as XML (Extensible Markup Language - a simple, very flexible text format which is also playing an increasingly important role in the exchange of a wide variety of data on the Web and elsewhere.) XML is easier to parse and process than HTML, XHTML is also easier to parse. Therefore XHTML is more portable than HTML. It can be used on mobile devices like phones where browser cross compliance, page size and CPU speed are an issue. Typically XHTML pages are smaller and simpler than HTML pages. In the case of the AHS website illustrated in this manual, the home page reduced from 32k to only 8k when coded using XHTML. The size of the style sheet also was reduced. This manual is written for XHTML and not HTML.
Document Type Definition files .dtd
Document types give XHTML and stylesheets a framework on which to build a document. This framework defines which entities are allowed in the document and the relationship of these one to the other. In XHTML the doctype is the very first thing in the document prior to the <html> tag.
XHTML 1.0 defines three doctypes namely transitional, strict and frameset. Since we do not normally use frames we can forget the frameset definition. The choice becomes between strict and transitional. The transitional document types allows a number of traditional HTML layout features whereas the strict type leads to clean and simple markup free from presentational clutter. Dtd files originate from XML see above.
Transitional is as it says – a transition (half way between HTML and XHTML). It seemed to me better to go the whole hog – strict gives a presentationally cleaner model and helps reduce the rendering differences on browsers.
http://www.w3schools.com/tags/tag_doctype.asp
|
