Website logo text SEO takes into account the perfect experience skill of website user

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

Website logo is the soul of the site, we can from Google and Baidu often update their original design logo can be seen. But most of us stationmaster, the logo may not often change, but the problem is, many search engines for the picture understanding ability is relatively poor, and to link or say anchor text understanding is quite original. So, can we use links to replace pictures?

Maybe you think it's impossible, but that's not the case. Using Div, we can easily achieve this expectation.

First of all, a normal logo location How do we write it?

< div id= "logo" >< a href= "http://www.hezewangzhan.com" >< img src= "/image/logo.gif" alt= "Heze website construction"/>&L T; /a ></div >

This is normal to write, but the problem is Baidu and other search engines for the image of the ability to understand the limited, even if we add alt tag, but Baidu is likely to not recognize this. Why should we give such an important position to a picture?

After a study, I thought of another solution, transforming the code into the following:

< H1 id= "logo" >< a href= "http://www.hezewangzhan.com" > Heze website Construction </a ></h1 >

OK, such as the surface code, we will remove the picture, and use the direct anchor text, in order to highlight the subject, we still use the H1 tag. Once again, this keyword is highlighted.

Well, directly in the browser to display this text is absolutely embarrassing for you, then how do we control this code in the CSS?

#logo {width:170px height:88px; Background:url (/image/logo.gif) no-repeat; text-indent:-10000px;}

#logo a {display:block; width:170px; height:88px;}

Width and height Control This does not have to be detailed, say a few important parts:

1:text-indent:-10000px; This code means that the text indents negative 10,000 pixels, that is, running out of the sky. Therefore, the text will not be visible. This method of hiding text is the best way I've ever met, and it's no exaggeration to say that no one has taught me this. But after I read the book CSS Zen Garden, I know that a foreign designer called Rundle The earliest use of this text-hiding method.

2:background:url (/image/logo.gif) no-repeat; This code uses the background image, which is the logo we designed. If the front is hidden, here is the replacement, so in combination, this is the "image replacement text" of a small CSS technique.

Of course, people with open mind will have different approaches, such as:

#logo {width:170px height:88px; Background:url (/image/logo.gif) no-repeat;}

#logo a {display:none;}

This generation of code is much simpler than the code I provide, isn't it? The problem is that Baidu or other search engines may think you are cheating if they crawl css. But more seoer think that search engines do not read CSS. So I don't know.

But the question is not over, because, if there is no a? That is to say, we do not add links, it seems that only my solution.

Of course, there are other, such as the font is 0, such a design is I think is not desirable, because such words are not not displayed, but will appear particularly small. You can experiment.

By the way, the webmaster net adds two full-width spaces in front of each article to indicate the meaning of the break. I don't think that's a bad idea. Because this undoubtedly increased the size of the Web page. Use TEXT-INDENT:2EM to achieve this effect. Webmaster Station is to do so.

The usefulness of these codes is not just that, but to show you a website for my clients: http://www.feiyuedianchi.com the code and display effects of this site will surprise you! If your browser disables CSS, I believe that This page will still be able to give you a clear picture of the structure of the site and the content you want to express.

Do you have any better ideas?

Article starting: http://www.hezewangzhan.com/news/news/6911.html reprint please keep the link.