I want to use alot of images on a page im doing. I want to use them for the buttons and also the background and more. What do I do because when a person with images disabled comes along, itmy page will look horrible and nothing will be there really.

2 answers

4
points
This was chosen as the best answer

If a person has images disabled, it will be for a reason, most likely:

  1. They are on a very slow or very expensive connection
  2. They are a search engine bot or similar
  3. They are visually impaired and images are of no value to them.

Such users are prepared (or forced) to accept aesthetic compromises.

Your duty as a designer is to deliver them the same functionality that they would receive if images were enabled:

  • Form buttons using <input type="image"> must have an alt text containing the same wording as the image. (this is a basic HTML validation requirement).
  • Purely decorative images which convey no contextual information should have EMPTY alt attributes. Reading or hearing "Small blue bullet" is of no help to the user and only slows them down.
  • If background images contain content which is essential to the comprehension of the page, then they have no right being background images - they (or some part of them) belong as content.
  • If you are using images in place of headings, use an image replacement technique which ensures that text is available with images disabled. If you are only using images to obtain a particular font, consider using cufon or SIFR.
Answered almost 7 years ago by Richard Grevers
1
point

If you are using images in place of headings, use an image replacement technique which ensures that text is available with images disabled. If you are only using images to obtain a particular font, consider using cufon or SIFR.

May I also recommend TypeKit, it has a large library of fonts and easy integration.

Answered almost 7 years ago by Greg Cooper
  • Even better. Set your header with the text, and a background image (of the desired text), then negatively indent your text way out of the viewport (`text-indent: -9999px`) Nathan DeGruchy almost 7 years ago