DIV CSS 佈局教程網

在我們對提交的非盈利網站的分析過程中，我們發現這些網站對於在什麼位置用什麼類型的HTML標記（或稱標簽，tag）以及在標記內部放置什麼內容有一些混淆。這兩點都可能對用戶以及網站在搜索結果中的外觀有重大影響。

在你裝飾大廳以前，裝飾你的title元素

在提交的所有非盈利網站中，27%的網站遺漏了他們的title元素，這些元素的關鍵之處在於它們讓谷歌和用戶知道哪些東西對你的網站十分重要。通常，一個搜索引擎從你的主題元素中選取60個左右的字符進行顯示；這是非常寶貴的不動產，所以你應當把它利用起來！在討論實際代碼以前，讓我們先看看提交給我們的網站之一Sharp的好標題元素在搜索引擎頁面下看起來是怎樣的：

理想情況下，一個好的title元素包括組織名稱還有一個描述性的標簽行。讓我們看看一些提交網站的實例：

如果你不指定一個標簽，谷歌將為你創建一個標題。我們猜測得再好可能也沒有你做得好，所以還是你自己控制你的title標簽吧！這只是一個簡單的修改，但是能起到巨大的作用。 為你的深層URL使用特定title標簽也很重要，我們將在下一期的網站診室文章中談到。

注意你的描述元標簽

提交給我們的網站中有54%的網站沒有充分挖掘描述元標簽的潛力。這些標簽常用於導出搜索頁面中為用戶顯示的兩行摘要。借助內容充實的摘要，你可以讓你的潛在浏覽者興奮起來並准備了解更多有關你組織的情況。讓我們看一下提交的網站中的一個好例子Tales of Aussie Rescue：

如果描述元標簽缺失或不相關，系統將從網頁內容中自動選擇一段作為摘要。如果你很幸運，自動選擇了一個好的摘要，你要記住搜索引擎在摘要的選擇方式上各不相同，所以最好寫一個內容充實的描述元標簽以保持一致性和相關性。

讓你的h元素保持原位

在你的清理工作中另一項快速的修復是確保你的網站正確使用標題（heading） 標簽。在我們對非盈利組織的調查中，將近19%的提交網站在標題元素方面還有待改善。在標題元素方面最常見的問題是他們往往以h2 或 h3標簽開始定義標題（header），而不包括h1標簽，也許是因為美觀的原因。

標題讓你有機會告訴谷歌和用戶對你和你的網站很重要的東西。在谷歌和你的用戶看來，你的標簽數字越小，文字越重要。充分利用h1標簽！如果你不喜歡h1標簽渲染的視覺效果，你隨時可以在你的CSS中改變其外觀。

為圖片使用替換文字

節日來臨每個人都會自豪地展示他們的家庭照片，但是不要忘了告訴我們他們都是誰。37%以上的網站沒有正確使用圖片替換文字屬性。如果使用正確，這種屬性可以：

幫助谷歌了解你的圖片是什麼

讓有訪問問題或設備功能有限的純文本浏覽器用戶了解你的圖片

請記住，豐富的描述性替換文字在這裡很關鍵。讓我們再看一些提交給我們的網站和他們的替換屬性使用情況：

谷歌有一些很好的資源來進一步讓你實現最佳源代碼實踐。對於初學者，你可以在網站管理員工具中使用我們的HTML建議工具。此外，讓所有浏覽者都能訪問你的網站始終是一種好的做法。