HTML 태그 요소의 Alt 속성과 제목 속성의 차이점에 대해 이야기해 보세요.-HTML 튜토리얼-php.cn

HTML 태그 요소의 Alt 속성과 제목 속성의 차이점에 대해 이야기해 보세요.

이 글에서는 HTML 태그 요소의 alt 속성과 title 속성의 차이점을 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

개요

이 질문에 한정자를 추가할 수 있습니다. 지금은 이 토론에서 <title> 태그를 제외하겠습니다. <title> 标签排除在本次讨论之外。

元素的 alt 和 title 属性有什么区别？

（推荐教程：html教程）

ALT 属性

最常见用在 <img> 标签上，那我们先来看下 <img> 标签的 alt 属性。

alt 属性是一个必需的属性，它规定在图像无法显示时的替代文本。

假设由于下列原因用户无法查看图像，alt 属性可以为图像提供替代的信息：

网速太慢
src 属性中的错误
浏览器禁用图像
用户使用的是屏幕阅读器

<img> 标签的 alt 属性指定了替代文本，用于在图像无法显示或者用户禁用图像显示时，代替图像显示在浏览器中的内容。

强烈推荐您在文档的每个图像中都使用这个属性。这样即使图像无法显示，用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说，alt 属性通常是他们了解图像内容的唯一方式。

注释和提示：

注释：alt 属性的值是一个最多可以包含 1024 个字符的字符串，其中包括空格和标点。这个字符串必须包含在引号中。这段 alt 文本中可以包含对特殊字符的实体引用，但它不允许包含其他类别的标记，尤其是不允许有任何样式标签。

注释：当用户把鼠标移动到 img 元素上时，Internet Explorer 会显示出 alt 属性的值。这种行为并不正确。所有其他的浏览器正在向规范靠拢，只要当图像无法显示时，才会显示出替代文本。

提示：如果需要为图像创建工具提示，请使用 title 属性。

用法和语法：

用法：alt 属性只能用在 img、area 和 input 元素中（包括 applet 元素）。对于 input 元素，alt 属性意在用来替换提交按钮的图片。比如：

<input type="image" src="image.gif" alt="Submit" />

로그인 후 복사

语法：
规定图像的替代文本

alt 文本的使用原则：

如果图像包含信息 - 使用 alt 描述图像
如果图像在 a 元素中 - 使用 alt 描述目标链接
如果图像仅供装饰 - 使用 alt=""

TITLE 属性

定义和用法：

title 属性规定关于元素的额外信息。

这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。

提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。当然 title 属性是比较广泛使用的，可以用在除了base，basefont，head，html，meta，param，script 和 title 之外的所有标签。但是并不是必须的。

title 属性有一个很好的用途，即为链接添加描述性文字，特别是当连接本身并不是十分清楚的表达了链接的目的。这样就使得访问者知道那些链接将会带他们到什么地方，他们就不会加载一个可能完全不感兴趣的页面。另外一个潜在的应用就是为图像提供额外的说明信息，比如日期或者其他非本质的信息。

TITLE 标签

看时间还早，我们继续来看下 <title> 标签吧。

<title> 元素可定义文档的标题。

浏览器会以特殊的方式来使用标题，并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样，当把文档加入用户的链接列表或者收藏夹或书签列表时，标题将成为该文档链接的默认名称。

提示： <title> 标签是 <head>

요소의 alt와 title
속성의 차이점은 무엇인가요?

(추천 튜토리얼: html 튜토리얼) 🎜🎜ALT 속성🎜🎜 이는 <img alt="HTML 태그 요소의 Alt 속성과 제목 속성의 차이점에 대해 이야기해 보세요." > 태그에서 가장 일반적으로 사용되므로 먼저 <img alt="HTML 태그 요소의 Alt 속성과 제목 속성의 차이점에 대해 이야기해 보세요." > 태그의 alt 속성을 살펴보겠습니다. 🎜🎜alt 속성은 이미지를 표시할 수 없을 때 대체 텍스트를 지정하는 필수 속성입니다. 🎜🎜다음과 같은 이유로 사용자가 이미지를 볼 수 없다고 가정하면 alt 속성은 이미지에 대한 대체 정보를 제공할 수 있습니다: 🎜

네트워크 속도가 너무 느립니다 li>
src 속성 오류
브라우저가 이미지를 비활성화합니다.
사용자가 스크린 리더를 사용하고 있습니다.

🎜

<img  alt="HTML 태그 요소의 Alt 속성과 제목 속성의 차이점에 대해 이야기해 보세요." > 태그의 alt 속성은 이미지를 표시할 수 없거나 사용자가 이미지를 비활성화한 경우 브라우저에 표시되는 이미지의 내용을 대체하는 데 사용되는 대체 텍스트를 지정합니다. 표시하다. 🎜🎜문서의 모든 이미지에 이 속성을 사용하는 것이 좋습니다. 이렇게 하면 이미지가 표시되지 않더라도 사용자는 누락된 내용에 대한 일부 정보를 계속 볼 수 있습니다. 장애가 있는 사용자의 경우 alt 속성이 이미지 내용을 이해하는 유일한 방법인 경우가 많습니다. 🎜🎜🎜참고 및 팁: 🎜🎜🎜참고: alt 속성의 값은 공백과 구두점을 포함하여 최대 1024자를 포함할 수 있는 문자열입니다. 이 문자열은 따옴표로 묶어야 합니다. 이 alt 텍스트에는 특수 문자에 대한 엔터티 참조가 포함될 수 있지만 다른 종류의 마크업을 포함할 수 없으며 특히 스타일 태그를 포함할 수 없습니다. 🎜🎜참고: 사용자가 img 요소 위로 마우스를 이동하면 Internet Explorer는 alt 속성 값을 표시합니다. 이 동작은 올바르지 않습니다. 다른 모든 브라우저는 사양에 더 가까워지고 있으며 이미지를 표시할 수 없는 경우에만 대체 텍스트를 표시합니다. 🎜🎜팁: 이미지에 대한 툴팁을 생성해야 하는 경우 title 속성을 사용하세요. 🎜🎜🎜사용법 및 구문: 🎜🎜🎜사용법: alt 속성은 img, area 및 input에만 사용할 수 있습니다. code > 요소(<code>applet 요소 포함). input 요소의 경우 alt 속성은 제출 버튼 이미지를 대체하기 위한 것입니다. 예: 🎜rrreee🎜구문:
 이미지의 대체 텍스트 지정🎜🎜alt 텍스트 사용 원칙: 🎜
이미지에 정보가 포함된 경우 - alt code> 이미지 설명

이미지가 a 요소에 있는 경우 - alt를 사용하여 대상 링크 설명
 이미지가 장식용인 경우 - alt=""

를 사용하세요.🎜TITLE 속성🎜🎜🎜정의 및 사용법: 🎜🎜🎜 제목  속성은 요소에 대한 추가 정보를 지정합니다. 🎜🎜이 정보는 일반적으로 요소 위로 마우스를 이동할 때 도구 설명 텍스트를 표시합니다. 🎜🎜팁: title 속성은 입력 형식 및 링크 대상에 대한 정보를 제공하기 위해 form 및 a 요소와 함께 사용되는 경우가 많습니다. abbr 및 acronym 요소의 필수 속성이기도 합니다. 물론 title 속성은 널리 사용되며 base, basefont, head,  html, meta, param, script 및 title을 제외한 모든 태그. 그러나 그것은 필요하지 않습니다. 🎜🎜 title 속성은 특히 링크 자체가 링크의 목적을 명확하게 전달하지 않는 경우 링크에 설명 텍스트를 추가하는 데 유용합니다. 이렇게 하면 방문자는 링크가 어디로 이동하는지 알 수 있으며 전혀 관심이 없을 수도 있는 페이지를 로드하지 않게 됩니다. 또 다른 잠재적인 응용 분야는 날짜나 기타 필수적이지 않은 정보와 같은 이미지에 대한 추가 설명 정보를 제공하는 것입니다. 🎜🎜TITLE 태그🎜🎜아직 보기에는 이르지만, <title> 태그를 계속해서 살펴보겠습니다. 🎜🎜<title> 요소는 문서의 제목을 정의합니다. 🎜🎜브라우저에서는 제목을 특별한 방식으로 사용하며 일반적으로 브라우저 창의 제목 표시줄이나 상태 표시줄에 제목을 배치합니다. 마찬가지로 사용자의 링크 목록이나 즐겨찾기 또는 책갈피 목록에 문서가 추가되면 제목이 문서 링크의 기본 이름이 됩니다. 🎜🎜팁: <title> 태그는 <head> 태그에 포함되어야 하는 유일한 것입니다. 🎜🎜🎜더 읽어보기:🎜제목에 무슨 내용이 있나요? 🎜올바른 제목을 선택하세요. 문서를 정의하고 웹에서 효과적으로 사용할 수 있는지 확인하는 것이 중요합니다. 
사용자는 순서에 상관없이 컬렉션의 각 문서에 독립적으로 액세스할 수 있다는 점을 기억하세요. 따라서 문서의 제목은 다른 문서의 맥락에서 정의되어야 할 뿐만 아니라 그 자체의 특성을 나타내야 합니다. 
문서 인용 순서가 포함된 제목은 일반적으로 좋은 제목이 아닙니다. 예를 들어, "16장"이나 "5부"와 같은 제목은 독자가 내용을 이해하는 데 아무런 도움이 되지 않습니다. "16장: HTML 제목" 또는 "5부: 제목 사용 방법"과 같은 보다 설명적인 제목은 더 큰 문서 모음 내에서 해당 위치를 표현할 뿐만 아니라 문서의 내용을 설명하여 독자의 관심을 유도합니다. 독서에 더 관심을 가지세요. 
자기 참조 제목도 거의 사용되지 않습니다. "홈 페이지"와 같은 제목은 콘텐츠와 아무런 관련이 없으며 유사한 제목에는 "피드백 페이지" 또는 "자주 사용되는 링크"가 포함됩니다. 독자들이 이 페이지를 방문할 필요가 있는지 판단할 수 있도록 특정 내용과 목적을 전달할 수 있는 제목을 디자인해야 합니다. "요소의 대체 제목과 제목의 차이점은 무엇입니까 - 문제"는 설명 제목입니다. 
사람들은 종종 웹 문서를 작성하는 데 많은 시간을 소비하지만, 매력이 없거나 의미 없는 제목 때문에 그 모든 노력이 낭비되는 경우가 많습니다. 사용자를 위해 자동으로 링크를 수집하는 특수 소프트웨어가 웹에서 점점 더 인기를 끌자 웹 페이지의 제목만이 페이지와 관련된 설명 단어로 방대한 링크 데이터베이스에 삽입되었습니다. 따라서 이 점은 아무리 강조해도 지나치지 않습니다. 설명적이고 유용하며 상황에 독립적인 각 문서의 제목을 신중하게 선택하세요. 
END.