Optimize the site, validate the code

With the spread of visual editors, fewer and fewer Web designers delve into the knowledge of the code generated by programs like Frontpage, Dreamweaver, etc.

Perhaps many do not yet know that the HTML, XHTML, XML coding standards were created by the study groups of the W3C (World Wide Web Consortium): thanks to the W3C which periodically updates the recommendations, it is possible to create content for the Web so that it can be viewed by any browser on any device that supports such recommendations. Unfortunately, only today are browser developers and applications oriented towards creating web pages beginning to adhere to the guidelines, which therefore causes compatibility and content display problems with non-latest generation browsers. The W3C provides several tools for the professional who desires a technically perfect website: I also remind that in creating web pages, the only possible certification is based on the quality of the code since beauty, usability, etc. are subjective evaluations. The code validation systems offered by the W3C are two: HTML/XHTML Validator and CSS Validator. HTML/XHTML Validator (http://validator.w3.org) This system validates the correct syntax of the web page both online (by entering the URL of the page to be validated) and by uploading a document from local. To be able to validate a web page, it is first necessary to define the DOCTYPE, which currently is reported as follows for documents that comply with the HTML 4.01 recommendation:

This header varies depending on the type of document to be created: the document being validated is therefore subject to the DOCTYPE which, for HTML 4.01 currently consists of: HTML 4.01 Strict (used to maintain maximum compatibility with older versions)

HTML 4.01 Transitional (used as the standard for web pages and in our example) HTML 4.01 Frameset (used for versions with frames)

If, instead, we move on to using the XHTML recommendation (which will soon replace HTML), the recommended DOCTYPE for version 1.0 is the following:

Now moving on to XHTML which aims to separate content from graphical appearance, thus increasing the use of style sheets (CSS) and allowing the variation of the website’s graphic theme limiting changes to the CSS. For XHTML there are also three types of DOCTYPE: XHTML 1.0 Strict (used to maintain maximum compatibility with previous systems)

XHTML 1.0 Transitional (used as the standard for web pages and in our example) XHTML 1.0 Frameset (used for framed versions)

It is also important to include the character encoding used within the web page (i.e., the charset): At this point, it is necessary to have a knowledge of the contents of the recommendations, whose URLs we report below in English but for which you can also find Italian translations: HTML 4.01: www.w3.org/TR/html401/ and XHTML 1.0: www.w3.org/TR/xhtml1. The most common errors usually recurring for HTML 4.01 are: – the absence of ALT tags for images: it is necessary for every image to specify an alternative text: It is important to remember that the text of the ALT tag must be explanatory for the image and not used for exaggerated repetition of keywords for search engine indexing since it is used by screen readers to provide information to the disabled and also to provide information to users in case the image does not load. – topmargin, leftmargin which are not used except by visual editors and viewable only by some browsers. Therefore, code like the following is not recommended: – Background images for cells and tables. HTML 4.01 does not allow the use of background images for cells and tables, leaving possibly the use by style sheets (CSS). So code like the following does not allow validation:

 

 

while it is validatable if applied to a class named for example “background”:

 

 

– Errors on scripts: it is always necessary to specify the type of script it is:

Pubblicato in Digital Tools