How to Fix Noncompliant Code on Your Web Page
For each web coding issue identified by a validator, you need to determine what course of action to take. Although some culprits that repeatedly crop up are easy to fix, such as missing alt text and <noscript> tags, you’re bound to find coding issues that completely baffle and stump you.
For instance, if you get an error message that reads XML Parsing Error: Opening and ending tag mismatch: br line 52 and body, it might be difficult to figure out what that means, let alone why it was caused and how you should fix it.
As a strategy then, try to fix the issues within the code from the top down, as they’re listed in the validation results, because sometimes fixing one issue resolves another. With the XML parsing error, that issue might disappear when you correct for an omitted closing element on a <br /> tag listed earlier in the error results.
The best way to find out how to code better and make fewer mistakes before validation testing is to make lots of honest mistakes and figure out how to correct them on your own. Most often, you can fix noncompliant code by hand or with the help of a good HTML editor.
To help you identify some of the more common coding mistakes, here several code issues along with suggestions about how to fix them.
|alt text attribute missing from <img> tag||Add the alternative text attribute, either with or without a description, as in <img src=images/logo.gif width=150 height=150 alt=Pete’s Pizza> <img src=images/flourish.gif width=200 height=150 alt=>.|
|<noscript> tags missing from code||Add <noscript> tags below each
end of the content before the closing body tag. Between the <noscript> tags, insert HTML content
(text, graphics, media files, and so on) that describes the
access the information revealed by it, as shown here:
|Flashing or flickering element(s) detected, such as animated GIFs, Java applets, and other multimedia plug-ins||Adjust the speed of any animations to avoid causing the screen to flicker with a frequency between 2 Hz and 55 Hz. Animations that exceed these two measures may cause seizures in visitors with photosensitive epilepsy.|
|No DOCTYPE specified||Add a valid DOCTYPE above the opening <head> tag.|
|No HTTP charset parameter specified||This special meta tag specifies the character set used in the HTML code. Some HTML editors include it automatically when generating new blank web pages. If validation finds that this tag is missing from your HTML or XHTML code, insert the following code by hand: <meta http-equiv=Content-Type content=text/html; charset=utf-8>. For HTML5, insert <meta charset="utf-8">.|
|No <title> tag specified||Add a unique title between <title> tags in the head area on each page.|
|No <meta> tags specified||Add meta keywords and meta description tags to the head of each page. These can be identical on every page on the site. If desired, you may also add additional meta tags as needed.|
|No Robots tags specified||Add the Robots <meta> tag in the head of the page to instruct web spiders and robots whether to index the page and follow any hyperlinks, such as <meta name=Robots content=All>.|
|Deprecated <font> tags detected||Move all the presentation markup of the HTML (page, fonts, tables, links, and so on) to an external CSS file and remove all <font> tags and HTML and inline formatting attributes.|
|Deprecated table height attribute detected||Control table cell heights, when necessary, with CSS styles.|
|Style attributes detected in the opening <body> tag||Move body attributes, like margin attributes and background page color, to a BODY tag redefine style in an external CSS file.|
|Entity name used instead of entity number||Change the entity name to an entity number, such as using $#169; instead of © to create the copyright symbol (c).|
|No background color attribute was specified for a CSS style that specifies text color||Provide each style that contains a text color attribute with an attending background color attribute. The background color should match, or closely match, the background color upon which the text will display on.|
When you’re finished identifying and adjusting all the noncompliant code identified by the validation tools, and have fixed everything that needed fixing, move on to the retesting and acceptable failure phase of the testing process.