與背景圖像，並沒有文字

XHTML錨鏈接是否有可能有錨鏈接沒有文本里面有一個背景圖像和固定尺寸，仍然是良好的搜索引擎優化？與背景圖像，並沒有文字

範例CSS：

a{display:block;width:50px;height:20px;background-image:url('images/background.jpg');background-repeat:no-repeat;background-position:0 0;} 

a:hover img{background-position:0 -20px;}

示例HTML：
<a href="#"></a>

來源

2011-01-20 Francisc

如果它是一個鏈接，那麼它做一些事情，當你點擊它。如果它做了什麼，用戶需要知道它做了什麼。因此它需要內容。一張**背景**圖片並不滿足。使用``和'alt`屬性，並停止關注針對祕密算法的微優化。 – Quentin 2011-01-20 14:55:20

我有理由要求，謝謝你的評論。 – Francisc 2011-01-20 15:01:38

如果圖像有文字，或者你只是想添加對它的描述，有一兩件事可以做，以幫助搜索引擎優化和可訪問性是給錨標題和內容與大的負文本縮進，添加此您a CSS：

display:block; 
text-indent:-9999em;

...用下面的HTML：

<a href="#" title="IMAGE TEXT">IMAGE TEXT</a>

來源

2011-01-20 14:57:49 mVChr

這是我可以做的感謝，但我從來沒有做過這種文本隱藏的粉絲。再次感謝！ – Francisc 2011-01-20 15:03:35

如果文本位於背景圖片中，但不會隱藏，它會將其提供給屏幕閱讀器，否則在沒有不利影響您的設計的情況下不會看到它。 – mVChr 2011-01-20 15:07:03

搜索引擎無法讀取它，所以它會如何爲SEO是好？更重要的是，你爲什麼要這樣做，你想做什麼？

來源

2011-01-20 14:48:42 plebksig

我想使用精靈，這是主要目的。關於引擎無法讀取內容的非常好的一點，我想他們會按照鏈接閱讀網頁的內容，沒有想到它是如何放置它的。謝謝！ – Francisc 2011-01-20 15:04:36

閱讀了其他評論，只是想一想。你也許可以把你的背景/精靈圖像放在鏈接中，作爲一個img內的圖像，然後使用懸停的CSS將標記內的圖像偏移。（我沒有想到這一點，但如果你想走這條路，可以看看）。當網站不能被個人搜索時，我只使用按鈕/鏈接的精靈。 – plebksig 2011-01-20 15:17:08

使用alt和title屬性，但具有標籤內沒有內容是pointless.I認爲有嚴重有可能會在搜索結果中受到處罰！

再次，爲什麼你想這一點。你正在做鏈接到另一個頁面的按鈕，或者運行JavaScript函數的那個按鈕？

來源

2011-01-20 14:58:02 keatch

通過另一個答案neXib的評論啓發。

HTML：

<a href="/home" title="Homepage" class="home"> 
    <div><img src="/images/sprite.png" alt="Home" /></div> 
</a>

CSS：

a { 
    display: block; 
} 
.home div { 
    width: 84px; 
    height: 27px; 
    overflow: hidden; 
    position: relative; 
} 
.home div img { 
    position: absolute; 
    top: -65px; 
    left: -20px; 
}

只要div有「溢出：隱藏」和固定尺寸的內部可被定位在僅將圖像顯示的部分你想要的精靈。

搜索引擎優化也是我的一個問題，我認爲這個解決方案將正常工作。

來源

2011-04-21 10:01:18 benjovanic

難道不此問題解決了？

<a href="#">&nbsp;</a>

這是一個有點老的問題，但只是想在這個意見！

來源

2012-05-30 23:38:49 FeRtoll

與背景圖像，並沒有文字

回答

相關問題