Codice di output dello script trasformazione 1, come visibile nell’esempio online:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML lang="it">
<HEAD>
<TITLE>bbs</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<p><a href="http://bobby.watchfire.com/bobby/bobbyServlet?URL=http://www.protty.net/trasformazione1.php" class="external">Bobby</a>
| La trasformazione di pagine dinamiche, WA </p>
<p>
<H1>BBS</H1>
<H2>il codice dopo la prima correzione</H2>
<UL>
<LI>(2003-02-15 16:47:29) <A HREF="bbs_source.php?messageID=2">codice originario</A><BR>
<UL>
</UL>
</UL>
<FORM ACTION="bbs.php" METHOD="post">
<INPUT TYPE="hidden" NAME="inputParent" VALUE="0"><INPUT TYPE="hidden" NAME="ACTION" VALUE="POST"><TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5" >
<TR><TD><B>Oggetto</B></TD><TD><INPUT TYPE="text" NAME="inputTitle" SIZE="35" VALUE=""></TD></TR>
<TR><TD><B>Poster</B></TD><TD><INPUT TYPE="text" NAME="inputPoster" SIZE="35" ></TD></TR>
<TR><TD></td><td><TEXTAREA NAME="inputBody" COLS="45" ROWS="5"></TEXTAREA></TD></TR>
<TR><TD COLSPAN="2"><CENTER><INPUT TYPE="submit" VALUE="Post"></CENTER></TD></TR></TABLE>
</FORM>
</p>
<p>&nbsp;</p>
<p>script di Leon Atkinson</p>
</BODY>
</HTML>

I controlli di form mancano dell’elemento LABEL. Dobbiamo intervenire nel sorgente per generare in output i controlli di form con label.

Ecco le linee da modificare, tratte dal sorgente trasformazione 1:

function postForm($parentID, $useTitle)
{
printf("<FORM ACTION="bbs.php" METHOD="post">n");
printf("<INPUT TYPE="hidden" NAME="inputParent" VALUE="$parentID">");
printf("<INPUT TYPE="hidden" NAME="ACTION" VALUE="POST">");
printf("<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5" >n");
printf("<TR><TD><B>Oggetto</B></TD>");
printf("<TD><INPUT TYPE="text" NAME="inputTitle" SIZE="35" VALUE="$useTitle"></TD></TR>n");
printf("<TR><TD><B>Poster</B></TD>");
printf("<TD><INPUT TYPE="text" NAME="inputPoster" SIZE="35" ></TD></TR>n");
printf("<TR><TD></td>");
printf("<td><TEXTAREA NAME="inputBody" COLS="45" ROWS="5"></TEXTAREA></TD></TR>n");
printf("<TR><TD COLSPAN="2"><CENTER><INPUT TYPE="submit" VALUE="Post"></CENTER></TD></TR>n");
printf("</TABLE>n");
printf("</FORM>n");
}

Ecco le stesse linee corrette:

function postForm($parentID, $useTitle)
{
printf("<FORM ACTION="bbs.php" METHOD="post">n");
printf("<INPUT TYPE="hidden" NAME="inputParent" VALUE="$parentID">");
printf("<INPUT TYPE="hidden" NAME="ACTION" VALUE="POST">");
printf("<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5">n");
printf("<TR><TD><LABEL FOR="oggetto"><B>Oggetto</B></LABEL></TD>");
printf("<TD><INPUT TYPE="text" NAME="inputTitle" SIZE="35" id="oggetto"></TD></TR>n");
printf("<TR><TD><LABEL FOR="poster"><B>Poster</B></LABEL></TD>");
printf("<TD><INPUT TYPE="text" NAME="inputPoster" SIZE="35" id="poster"></TD></TR>n");
printf("<TR><TD><LABEL FOR="messaggio"><b>Messaggio</b></LABEL></td>");
printf("<td><TEXTAREA NAME="inputBody" COLS="45" ROWS="5" id="messaggio"></TEXTAREA></TD></TR>n");
printf("<TR><TD COLSPAN="2"><CENTER><INPUT TYPE="submit" VALUE="Invia"></CENTER></TD></TR>n");
printf("</TABLE>n");
printf("</FORM>n");
}

Proviamo a validare la pagina, otteniamo il seguente risultato:

Priority 3 accessibility errors found:

  • Provide a summary for tables. (1 instance) >>> terza trasformazione
    Line 17
  • Include default, place-holding characters in edit boxes and text areas. (3 instances) >>> quarta trasformazione
    Lines 18, 19, 20

Visualizza l’esempio online dopo la seconda trasformazione.

Il secondo problema priorità 2 è stato risolto. Restano 2 errori. >>> continua con la terza trasformazione