img中alt与title辨析
时间:2022-05-04
本文章向大家介绍img中alt与title辨析,主要内容包括示例代码:、1、含义不同:、2、在浏览器中的表现不同:、为img标签不设置title属性,但设置了alt属性,在IE6、IE7显示如下图、3、对于网站SEO优化来说:、基本概念、基础应用、原理机制和需要注意的事项等,并结合实例形式分析了其使用技巧,希望通过本文能帮助到大家理解应用这部分内容。
HTML5学堂:img中alt与title有何不同?本文主要从表现在含义、浏览器中的表现以及对于网站seo优化程度三个方面进行辨析,接下来我们一起来看看。
示例代码:
<img src="h5course.jpg" alt="蜡笔小新 属性alt的值" title="蜡笔小新 属性title的值">
1、含义不同:
img标签alt属性是当图片不存在时或加载失败时的替代文字(进行显示);img标签title属性是对图片的描述与进一步说明。
2、在浏览器中的表现不同:
在FF、chrome和IE8+中,当鼠标经过图片时title属性的值会显示,而alt属性的值不会显示;只有在IE6、IE7中,如果img标签没有写title属性,而写了alt属性的时候,alt属性值会进行显示;如果img写了title属性和alt属性的时候,只会显示title属性值。
为img标签设置title属性和alt属性,在IE6、IE7显示如下图
为img标签不设置title属性,但设置了alt属性,在IE6、IE7显示如下图
3、对于网站SEO优化来说:
搜索引擎对图片意思的判断,主要靠alt属性。所以在图片alt属性中以简要文字说明,同时包含关键词,也是页面优化的一部分。条件允许的话,可以在title属性里,进一步对图片说明。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- PHP生成随机码的思路与方法实例探索
- CI框架教程之优化验证码机制详解【验证码辅助函数】
- ThinkPHP框架整合微信支付之Native 扫码支付模式一图文详解
- PHP中str_split()函数的用法讲解
- 微信JSSDK分享功能图文实例详解
- spring-boot-route(八)整合mybatis操作数据库
- PHP扩展Swoole实现实时异步任务队列示例
- ThinkPHP框架下微信支付功能总结踩坑笔记
- spring-boot-route(九)整合JPA操作数据库
- spring-boot-route(十)多数据源切换
- spring-boot-route(十一)数据库配置信息加密
- PHP中number_format()函数的用法讲解
- php7新特性的理解和比较总结
- PHP之认识(二)关于Traits的用法详解
- 详细分析Python可变对象和不可变对象