980508-2

*:96
 

Internet application
protocols and standards
 


Above is shown a part of a web page. You might first think that this is one big GIF file. But it is not! To save the download time of large graphic, only a small part of this is actually a GIF file. What, then, is the HTML behind this?

Answer alternative 1:

There are many possible answers. Here is one of them. The HTML code below is slightly simplified. 

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 HEIGHT=100>
    <TR>
        <TD ROWSPAN=2 BGCOLOR="#0066FF">
            <P ALIGN=CENTER>
            <FONT SIZE=7 COLOR="#FFFFFF"><B>*:96</B></FONT>
            <BR>&nbsp;
        </TD>
        <TD WIDTH=73 HEIGHT=100 BGCOLOR="#0066FF">
            <IMG SRC="exam-98-05a.gif" WIDTH=73 HEIGHT=100>
        </TD>
        <TD WIDTH=254 HEIGHT=100 BGCOLOR="#FFFFCC">
            <FONT SIZE=4><B>Internet application<BR>
            protocols and standards</B></FONT>
        </TD>
    </TR>
    <TR>
        <TD HEIGHT=14 COLSPAN=2 BGCOLOR="#3366FF">&nbsp;</TD>
    </TR>
</TABLE>

Here is the rendering of answer alternative 1, but with BORDER=2 to show the cell divisions:

*:96
 

Internet application
protocols and standards
 

The only cell in the table above, which contains an image, is the second cell in the first row!

Answer alternative 2:

For some reason, I do not know why, answer alternative 1 will not work perfectly with the version of Netscape, on which I tested it. It did work OK with Explorer. Below is a variant with a slightly larger GIF image, but which worked OK when I tested it with both Netscape and Explorer.

<TABLE BORDER=1 CELLPADDING=0 CELLSPACING=0 HEIGHT=114>
<TR>
<TD ROWSPAN=2 BGCOLOR="#0066FF">
<P ALIGN=CENTER><FONT SIZE=7 COLOR="#FFFFFF"><B>*:96</B></FONT>
<BR>&nbsp;
</TD>
<TD WIDTH=73 ROWSPAN=2 BGCOLOR="#0066FF">
<IMG SRC="exam-98-05b.gif" WIDTH=73 HEIGHT=114>
</TD>
<TD WIDTH=254 HEIGHT=100 BGCOLOR="#FFFFCC">
<FONT SIZE=4><B>Internet application<BR>
protocols and standards</B></FONT>
</TD>
</TR>
<TR>
<TD HEIGHT=14 BGCOLOR="#0066FF">&nbsp;</TD>
</TR>
</TABLE>

Here is the rendering of answer alternative 2, but with BORDER=2 to show the cell divisions:

*:96
 

Internet application
protocols and standards
 

Not quite working answer alternative 3:

Here is a solution which some of you submitted, and which is smart and almost does the trick. However, with this solution, it is difficult to ensure correct alignment between the horizontal ruler and the logo. A solution which works with one browser might not work with another browser. Also, the GIF picture is much larger with this solution.
<BODY BGCOLOR="#FFFFCC"> 

<IMG SRC="exam-98-05c.gif" WIDTH=145 HEIGHT=112 ALIGN=LEFT BORDER=0>
<BR><BR><FONT SIZE=4><B>Internet application<BR>
protocols and standards</B></FONT></P>
<HR ALIGN=LEFT SIZE=13 NOSHADE>
<BR clear=all>

Not quite working answer alternative 4:

This solution works almost correctly, but not quite. Some browsers insert some kind of horizontal bar between the two images. 

<IMG SRC="exam-98-05d.gif" WIDTH=145 HEIGHT=98 ALIGN=LEFT BORDER=0><BR>
<FONT SIZE=5><B>Internet application<BR>
protocols and standards</B></FONT></P>
<P><BR clear=all>
<IMG SRC="exam-98-bottom-bar.gif" WIDTH=400 HEIGHT=14 ALIGN=BOTTOM BORDER=0></P>

Not quite working answer alternative 5:

Several students tried with diff solution:

<BODY BACKGROUND="exam-98-05e.gif">
<BLOCKQUOTE>
<BLOCKQUOTE>
<BLOCKQUOTE>
<H3><BR>
<FONT FACE="Geneva"><B>Internet application<BR>
protocols and standards</B></FONT>
</BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE>

This solution has, however, several problems. First, you do not save much downloading time, since the GIF will be almost the same size as a GIF with the text included. Secondly, the background picture is tiled multiple times, so that the result will look something like this (the number of tiles horizontally and vertically will depend on the window size):

*:96
 

Internet application
protocols and standards

*:96
 

 

*:96
 

 

*:96
 

 

List of exam questions