|
|
Posted by Gιrard Talbot on 01/23/33 11:43
johnsonholding@yahoo.com wrote :
> Do I need to add anything else but what you have shown?
>
>> <img style="border:0;" src="jugs.jpg" alt="Two earthy containers">
>
I do not agree with some of what you were replied.
First, it's best to indicate the width and height of the image so that
the browser does not have to process this info when rendering the page.
The parsing+rendering of the image is a bit faster.
Second, I personally strongly recommend that you do not remove the
border on a clickable image (also called/referred as reactive image)
because such border may be the only thing revealing easily and visually
to the user that it is a clickable image. A link or clickable image
should always be easy to recognize as such.
Web Authoring FAQ: Images
{
7.6. How do I eliminate the blue border around linked images?
In your HTML, you can specify the BORDER attribute for the image:
<a href=...><img src=... alt=... border="0"></a>
Or in your CSS, you can specify the border property for linked images:
a img { border: none ; }
However, *_note that removing the border that indicates an image is a
link makes it harder for users to distinguish quickly and easily which
images on a web page are clickable._*
}
http://www.htmlhelp.com/faq/html/images.html#no-border
Also:
{
One of the most common questions on HTML authoring is how to get rid of
the "ugly border", and the answer -> is technically simple: add the
attribute border="0" into the img tag. This cannot force anything;
browsers may still override it. For example, the Opera browser lets the
user specify "Always have border on image links" rather simply, via the
preferences settings. And on browsers with sufficient support to
stylesheets, e.g. on IE 4, a user can write a user's style sheet which
suggests borders around image links and declare the suggestions as
!important, to override author's stylesheets.
But at present the border="0" attribute mostly works; and that exactly
is the problem. *_If there are no borders around an image, the user does
not see what images are links._* Browsing becomes guesswork, trial and
error.
}
Links Want To Be Links
What about the "ugly borders"?
http://www.cs.tut.fi/~jkorpela/www/links.html#borders
Third, if you want your clickable image to be optimally accessible and
conformant to accessibility guidelines, you may want to specify the
target/destination of the link in the title attribute in the link.
E.g.:
<a href="[Mom's website url]" title="Visit my mom's website"><img
src="[path]/mom.gif" width="150" height="200" alt="My mom"></a>
4th, for beginners wishing to learn HTML 4.01 and CSS, you'll find good
resources, links (that I recommend) here:
http://www.gtalbot.org/NvuSection/NvuWebDesignTips/WebDesignResources.html#LearningHTMLCSS
GΓ©rard
--
remove blah to email me
Navigation:
[Reply to this message]
|