网站logo SEO优化

为了SEO优化，网站的logo不是直接用img标签放上去一个图片，可以如下这样写：

html中：

<div class="logo">
  <h1>
    <a href="index.html" title="我的商城">我的商城</a>
  </h1>
</div>

css：

.logo a {
  display: block;
  width: 171px;
  height: 61px;
  background: url(../images/logo.png) no-repeat;
  /* 让文字隐藏方法一： */
  /* font-size: 0; */
  /* 让文字隐藏方法二 */
  text-indent: -9999px;
  overflow: hidden;
}

对上面的解释：

1、logo里面首先放一个h1标签，目的是为了提权，告诉搜索引擎，这个地方很重要。

2、h1里面在放一个<a>链接，点击logo可以返回首页，把logo作为链接的背景图片。

3、让了让搜索引擎收录，在链接里面要放文字（例如，放网站名称），但是文字不要显示出来。文字不要显示出来的方法：

• 方法1：text-indent移到盒子外面（text-indent:-9999px;），然后overflow:hidden;

  text-indent: -9999px;
  overflow: hidden;

• 方法2：直接给font-size: 0; 就看不到文字了。

font-size: 0;

4、给链接一个title属性，这样鼠标放到logo上就可以看到提示文字了。

例如，京东的做法：

淘宝的做法：

小米的做法：