HTML and CSS Reference
In-Depth Information
5.2.6.9. Removing the image border
You can eliminate the border around an image hyperlink altogether with
the
border=0
attribute within the
<img>
tag. For some images, particu-
larly image maps, the absence of a border can improve the appearance
of your pages. Images that are clearly link buttons to other pages may
also look best without borders.
Be careful, though, that by removing the border, you don't diminish your
page's usability. No border means you've removed a common visual in-
dicator of a link, making it more difficult for your readers to find the
links on the page. Browsers will change the mouse cursor as the reader
passes it over an image that is a hyperlink, but you should not assume
they will, nor should you make readers test your borderless images to
find hidden links.
We strongly recommend that with borderless images you use some ad-
ditional way to let your readers know to click the images. Even including
simple text instructions will go a long way toward making your pages
more accessible to readers.
5.2.6.10. The height and width attributes
Ever watch the display of a page's contents shift around erratically while
the document is loading? That happens because the browser readjusts
the page layout to accommodate each loaded image. The browser de-
termines the size of an imageand, hence, the rectangular space to re-
serve for it in the display windowby retrieving the image file and ex-
tracting its embedded height and width specifications. The browser then
adjusts the page's display layout to insert that picture in the display.
[*]
This is not the most efficient way to render a document because the
browser must sequentially examine each image file and calculate its
screen space before rendering adjacent and subsequent document con-
tent. That can significantly increase the amount of time it takes to
render the document and can disrupt reading by the user.
