HTML Tutorial: On title attribute and Alt attribute

Source: Internet
Author: User

XHTML is the basis of CSS layout, webjx.com has always emphasized the learning of XHTML knowledge, the importance of semantic and document structure. Title and Alt attribute, give me the most intuitive feeling is that can improve the adaptability of the document, and reasonable increase the keyword density. In the XHTML standard, the ALT attribute of the picture is required.

Alt Property

The ALT attribute is used to specify alternate text for the user agent (UA) that cannot display images, forms, or applets. The language of the alternate text is specified by the lang attribute. The ALT attribute (note "property" instead of "label") includes an alternate description, which is necessary for image and image hotspots. It can only be used in IMG, area, and input elements (including applet elements). For the INPUT element, the ALT attribute is intended to replace the picture of the Submit button.

For example, the ALT attribute is used to provide a text description for viewers who cannot see the images in your document. This includes users who use the browsers that do not support image display or image display, and users who are visually impaired and those who use screen readers. Alternate text is used to replace an image instead of providing additional descriptive text.

Think carefully before writing alternate text to ensure that the text does provide descriptive information for those who do not see the image, and that it is meaningful in the context. For those decorative pictures you can use an empty value (alt= "", no spaces in the quotation marks), instead of using unrelated alternate text such as "Blue Bullet" or "spacer.gif". Do not ignore it, if you ignore it, then some screen readers will directly read the file name of the image file, those text browser, such as Lynx will display the file name of the image file, and that is not used for your visitors.

Image picture with text set alternate text is the simplest, and the text contained in the image can generally be used as the Alt attribute value.

Title Property

The Title property provides the recommended information for the element that sets the property.

The title attribute can be used for all tags except base,basefont,head,html,meta,param,script and title. But it's not necessary. Maybe that's why a lot of people don't understand when to use it.

Use the Title property to provide extra information that is not essential. Most visual browsers display title text as a hint (tool tip) when the mouse hovers over a particular element, but it is up to the manufacturer to decide how to render the title text. Some browsers will display title text in the status bar. Like the previous version of Safari browser.

A good use of the title attribute is to add descriptive text to the link, especially when the connection itself is not a very clear expression of the purpose of the link. This allows visitors to know where the links will take them and they will not load a page that may not be entirely interesting. Another potential application is to provide additional descriptive information for the image, such as date or other non essential information.

The Title property value can be set longer than the Alt property value. Note, however, that some browsers truncate text that is too long (such as tooltips or other). For example, the Mozilla core browser can only display the first 60 characters. This is considered a Mozilla bug, and that's what you should be aware of.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.