HTML Tutorial: title attribute and alt attribute

HTML Tutorial: title attribute and alt attribute

XHTML is the basis of CSS layout. jb51.net has always emphasized the learning of XHTML knowledge and paid attention to semantics and document structure. The most intuitive feeling I get from the title and alt attributes is that they can improve the adaptability of the document and reasonably increase the keyword density. In the XHTML standard, the alt attribute of images is required.
XHTML is the basis of CSS layout. jb51.net has always emphasized the learning of XHTML knowledge and paid attention to semantics and document structure. The most intuitive feeling I get from the title and alt attributes is that they can improve the adaptability of the document and reasonably increase the keyword density. In the XHTML standard, the alt attribute of images is required.
alt attribute <br />For user agents (UA) that cannot display images, forms, or applets, the alt attribute is used to specify alternative text. The language of the replacement text is specified by the lang attribute. Alt attributes (note the word "attribute" and not "tag") contain alternate descriptions and are required for images and image hotspots. It can only be used in img, area, and input elements (including applet elements). For input elements, the alt attribute is intended to be used to replace the submit button's image.
For example: Use the alt attribute to provide text descriptions to viewers who cannot see the images in your document. This includes users who use browsers that don't natively support image display or have image display turned off, users with visual impairments, and users who use screen readers. Alt text is used to replace images rather than provide additional description text.
Think carefully before writing alt text to make sure it actually provides information for people who can’t see the image and that it makes sense in context. For decorative images, use an empty value (alt="" with no spaces between the quotes) instead of using irrelevant alt text like "blue bullet" or "spacer.gif". Don't omit it, if you do some screen readers will read the image filename directly, and text browsers like Lynx will display the image filename, which is not useful to your viewers.
It is easiest to set alternative text for images that contain text. The text contained in the image can generally be used as the alt attribute value.
The title attribute provides advisory information for the element on which it is set.
The title attribute can be used in all tags except base, basefont, head, html, meta, param, script, and title. But it is not necessary. Maybe that’s why many people don’t understand when to use it.
Use the title attribute to provide nonessential additional information. Most visual browsers display the title text as a tool tip when the mouse hovers over a specific element, but it is up to the manufacturer to decide how to render the title text. Some browsers will display the title text in the status bar. For example, early versions of the Safari browser.
A good use of the title attribute is to add descriptive text to a link, especially when the link itself doesn't clearly convey the purpose of the link. This lets visitors know where the links will take them, so they don't load a page that they may not be interested in. Another potential application is to provide additional captions for images, such as dates or other non-essential information.
The title attribute value can be longer than the alt attribute value. Be aware, though, that some browsers will truncate long text (like tooltips or whatever). For example, Mozilla-based browsers can only display the first 60 characters. This is considered a Mozilla bug, and is something you should be aware of.

<<:  Echarts sample code for using multiple X-axes to achieve seven-day weather forecast

>>:  How to install tomcat8 in docker

Recommend

linux exa command (better file display experience than ls)

Install Follow the README to install The document...

Faint: "Use web2.0 to create standard-compliant pages"

Today someone talked to me about a website develo...

Tips for making web table frames

<br />Tips for making web table frames. ----...

MySQL 5.7.30 Installation and Upgrade Issues Detailed Tutorial

wedge Because the MySQL version installed on the ...

Linux C log output code template sample code

Preface This article mainly introduces the releva...

MySQL independent index and joint index selection

There is often a lack of understanding of multi-c...

How to check if the firewall is turned off in Linux

1. Service method Check the firewall status: [roo...

Summary of various methods for JS data type detection

Table of contents background What are the methods...

How to publish a locally built docker image to dockerhub

Today we will introduce how to publish the local ...

js and jquery to achieve tab status bar switching effect

Today we will make a simple case, using js and jq...

Customization Method of Linux Peripheral File System

Preface Generally speaking, when we talk about Li...

Methods of adaptive web design (good access experience on mobile phones)

1. Add the viewport tag to the HTML header. At th...

4 ways to modify MySQL root password (summary)

Method 1: Use the SET PASSWORD command First log ...

Vue encapsulates the public function method of exporting Excel data

vue+element UI encapsulates a public function to ...