网站SEO优化之【logo设置篇】

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

2.h1里面再放一个链接,可以放回首页的,把logo的背景图片给链接即可。

3.为了搜索引擎收录我们,我们链接里面要放文字(网站名称),但文字不要显示出来。

 方法1:text-index移到盒子外面(text-index:-9999px),然后overflow:hidden,淘宝的做法

 方法2:直接给font-size:0;就看不到文字了,京东的做法

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

例如:

<style>
/* header 头部制作 */
.header {
    position: relative;
    height: 105px;
 
}
.logo {
    position: absolute;
    top: 25px;
    width: 171px;
    height: 61px;
    
}
.logo a {
    display: block;
    width: 171px;
    height: 61px;
    background: url(../images/logo.png) no-repeat;
    /* font-size: 0;京东的做法*/
    /* 淘宝的做法让文字隐藏 */
    text-indent: -9999px;
    overflow: hidden;
}
</style>   
    <header class="header w">
        <div class="logo">
            <h1> 
                <a href="index.html" title="品优购商城">品优购商城</a>
            </h1>
        </div>
    </header>

猜你喜欢

转载自blog.csdn.net/weixin_43837268/article/details/109035452