HTML Interview Question

Question

Well I got this question in an interview test.Give two reasons why the page might take longer to download than necessary with this image.

< IMG src="somethin.gif" width=10 height=10 border=0 >

Well I came up with 3 instead of 2 reasons Xhtml validation problems,image resizing and unnecessary border=0.So what is wrong in here? .

Answer 1

Validation problems don't increase download times (and, aside from some extra whitespace, it is the only thing stopping it being valid HTML 4.01 Transitional is the missing alt attribute).

The things that could increase download times are:

• The image might be more than 10x10 and have to be scaled down
• Presentational attributes are used instead of cache-friendly CSS (which isn't going to be significant as a one-off)

Images which are inside links have a border by default, so border=0 might not be as "unnecessary" as you think (although it is still better handled with CSS).

Answer 2

There is a space at either end. That's 2 unnecessary bytes to download ;)

Answer 3

something.gif might not actually be pointing to a static picture on the filesystem.

something.gif might:

• Might Redirect
• Produce non 200 response codes
• Dynamically Created
• Call a server side script(eg WebBug)

Answer 4

How about:

<img src="data:image/gif;base64, {insert base64 image here} >

Reduces the download time by about one round trip time. Since it's quite small, 10 by 10, the overhead of base64 is not significant, I think..