Fixit – Alt Texts

You should consider how your page will render when the images are not available. Making a page readable in text-only mode can help a user assess its usefulness before images arrive. With alt text you can specify a text alternative to an image. This tests determines if you have provided an alternative text for each image in your markup.

Specifying alternative text

To specify alternative texts, you simply use the alt attribute in your img element.

<img src="images/logo.gif" alt="Company logo" />

If the alt attribute is missing, then this test will fail. However, it is acceptable to have an empty alt attribute:

<img src="images/clown.gif" alt="" />

(Note, for clarity we have not included width and height attributes in the examples above. These should be included whenever you use the img element. More info here.)

Reference

This test is based on a W3C mobileOK best practise test. See http://www.w3.org/TR/mobile-bp/#NON-TEXT_ALTERNATIVES for more details

 

Leave a Reply

Exclusive tips, how-tos, news and comment

Receive monthly updates on the world of mobile dev.

Other Products

Market leading device intelligence for the web, app and MNO ecosystems
DeviceAtlas - Device Intelligence

Real-time identification of fraudulent and misrepresented traffic
DeviceAssure - Device Verification

A free tool for developers, designers and marketers to test website performance
mobiReady - Evaluate your websites’ mobile readiness

© 2024 DeviceAtlas Limited. All rights reserved.

This is a website of DeviceAtlas Limited, a private company limited by shares, incorporated and registered in the Republic of Ireland with registered number 398040 and registered office at 6th Floor, 2 Grand Canal Square, Dublin 2, Ireland