Web Design All-in-One For Dummies, 2nd Edition
Book image
Explore Book Buy On Amazon
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.

Problem Solution 
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 instance when JavaScript is present in in-line JavaScript or at the 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 function of the JavaScript and, when appropriate, how visitors can access the information revealed by it, as shown here: 
<script language="JavaScript"
src="bookmark.js"
type="text/javascript"></script><noscript>The
JavaScript used on this page provides a quick link that allows
visitors to automatically bookmark this page. As an alternative,
please use your browser’s Bookmark This Page feature.</noscript>
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. 
type
attribute not specified for JavaScript or CSS		 Add the 
type="text/css"
attribute for 
<style>
tags and the 
type="text/javascript"
attribute for 
<script>
tags: 
<style type="text/css" ><script
type="text/javascript">
.
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.

About This Article

This article is from the book:

About the book author:

Sue Jenkins is a working designer as well as a design trainer and author. Her design firm, Luckychair, provides design services for web, logo, and print. Sue has also created a series of training DVDs on popular Adobe design tools including Photoshop, Dreamweaver, and Illustrator.

This article can be found in the category: