关于logo的优化(建议)
1.一般情况下,logo给的是背景图片
2.我们要在logo里面放一个h1标签,就是为提权,说明这个盒子很重要。
3.我们继续在h1 里面放一个链接a 要和 logo盒子一样大。
4.注意 a链接 里面要放上网站标题。(是为了优化)1
2
3
4
5<div class="logo">
<h1>
<a href="#" title="阳光科技网">阳光科技网</a>
</h1>
</div>
5.给链接添加 title 提示文本 增强用户体验。
6.链接里面的文字对用户体验不好,这里不需要看见。 有两种方法实现:1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17// 利用text-indent:-2000em; 或者 利用padding 挤开盒子 并且overflow 切割
// 方法1:
.logo a{
display: block;
height: 82px;
text-indent: -99999px;
overflow: hidden;
}
// 方法2:
.logo{
height: 82px;
overflow: hidden;
}
.logo a{
display: block;
padding-top: 82px; // logo的高。
}