做SEO對網(wǎng)頁設計制作的要求

做SEO對網(wǎng)頁設計制作的要求

網(wǎng)站建設中頁面設計一般是由網(wǎng)頁設計師完成。設計師設計網(wǎng)站往往僅從美觀、創(chuàng)意和易用的角度考慮，這對于一個期望獲得搜索引擎排名優(yōu)秀的商業(yè)網(wǎng)站來說，已經(jīng)遠遠不夠了，網(wǎng)站策劃人員至少應該為設計師遞交一份需求備忘錄，提醒在設計中需要配合和注意的環(huán)節(jié)。
目錄結構和URL
URL是統(tǒng)一資源定位，即每個網(wǎng)頁的網(wǎng)址、路徑。網(wǎng)站文件的目錄結構直接體現(xiàn)于URL。清晰簡短的目錄結構和規(guī)范的命名不僅有利于用戶體驗和網(wǎng)址傳播，更是搜索引擎友好的體現(xiàn)。

目錄層次：
對于一個小型網(wǎng)站來說，一般只有一層子目錄，如下：
http://m.aorustv.com/ymkj/
m.aorustv.com是域名，dir1是一級目錄名，page是文件名。
對搜索引擎而言，這種單一的目錄結構最為理想，即扁平結構（Flat）。

而對規(guī)模大一些的網(wǎng)站，往往需要二到三層子目錄。象這樣：
http://m.aorustv.com/dir1/dir2/dir3/page.htm
搜索引擎還是會去抓取二到三層子目錄下的文件，但最好不要超過3層，如果超過4層，象以下這個頁面，搜索引擎就很難去搜索它了：http://m.aorustv.com/dir1/dir2/dir3/dir4/page.htm

當然，以下情況下，即使深入第四層甚至更深層次的頁面，也同樣能被搜索到：

1、如果該頁提供了重要內(nèi)容，有大量來自其它網(wǎng)站的外部鏈接（Inbound Links）；
2、如果在首頁上增加一個該頁的鏈接，可以通過首頁直接到達，搜索Spider還是可以輕易地找到它；
3、如果有其它網(wǎng)站在頂級頁面上鏈接了該頁，其效果就好似你在自己的首頁上做了該鏈接。

此外，圖形、腳本、CGI-BIN和CSS樣式表則各自建立專門的目錄收入其中，一般不放在根目錄下。

目錄和文件命名：
根據(jù)關鍵字無所不在的原則,可以在目錄名稱和文件名稱中使用到關鍵詞。但如果是關鍵詞組,則需要用分隔符分開。我們常用連字符"-"和下劃線"_"進行分隔，URL中還經(jīng)常出現(xiàn)空格碼"%20"。因此，如果以"中國制造"作文件名,就可能出現(xiàn)以下三種分隔形式：
made-in-china.htm
made_in_china.htm
made%20in%20china.htm
但事實上，至少在目前Google并不認同"_"為分隔符。對Google來說， made-in-china和made%20in%20china都等于made in china，但made_in_china就被讀成了madeinchina，連在一起之后，關鍵詞就失去了意義。

因此，目錄和文件名稱如果有關鍵詞組，要用連字符"-"而不是下劃線"_"進行分隔。
URL應該越短越好。有人為了單純增加關鍵字而額外建多一個帶有關鍵字的子目錄，改變目錄結構。由于URL中含有關鍵字本身對排名提高幫助并不大，因而這種做法多此一舉，也是搜索引擎反感的。

絕對URL和相對URL：
絕對URL：即網(wǎng)頁路徑使用包含頂級域名在內(nèi)的完整的URL。
如：m.aorustv.com/page1/index.html是一個絕對路徑，其中/page1/index.html則為相對路徑，由瀏覽器自動在該鏈接前加上m.aorustv.com。
m.aorustv.com

總體上，Google在排名時并不在意URL使用的是相對路徑還是絕對路徑。 動態(tài)URL： 目前很多網(wǎng)站都有數(shù)據(jù)庫驅(qū)動生成的URL，即動態(tài)URL，往往表現(xiàn)為在URL中出現(xiàn)"?"、"="、"%"，以及"&"、"$"等字符。動態(tài)URL極不利于搜索引擎抓取網(wǎng)頁，嚴重影響網(wǎng)站排名，通常是通過技術解決方案將動態(tài)URL轉化成靜態(tài)的URL形式，如：
將php?id=2&type=5">http://m.aorustv.com/messages.php?id=2&;type=5 轉化為http://m.aorustv.com/messages/2/5/ 下文將會專門提到動態(tài)URL的解決方案。
導航結構
網(wǎng)站導航是對引導用戶訪問網(wǎng)站的的欄目、菜單、在線幫助、布局結構等形式的統(tǒng)稱。其主要功能在于引導用戶方便地訪問網(wǎng)站內(nèi)容，是評價網(wǎng)站專業(yè)度、可用度的重要指標。同時對搜索引擎也產(chǎn)生諸多提示作用。概括地講，網(wǎng)站在導航方面應注意以下幾點：
1、主導航醒目清晰
主導航一般體現(xiàn)為一級目錄，通過它們用戶和蜘蛛程序都可以層層深入訪問到網(wǎng)站所有重要內(nèi)容。因此主欄目必須在網(wǎng)站首頁第一屏的醒目位置體現(xiàn)，并最好采用文本鏈接而不是圖片。
2、"面包屑型(Breadcrumbs)"路徑
所謂"面包屑"是比喻用戶通過主導航到目標網(wǎng)頁的訪問過程中的路徑提示，使用戶了解所處網(wǎng)站中的位置而不至于迷失"方向"，并方便回到上級頁面和起點。路徑中的每個欄目最好添加鏈接。

如下： 網(wǎng)信設計： 網(wǎng)信日志 > 技術資訊 > 網(wǎng)絡營銷
即使沒有詳細的路徑來源，也至少應該在每個子頁面提示回首頁的鏈接，包括頁面的LOGO作鏈接。
3、首頁突出重要內(nèi)容
除了主欄目，還應該將次級目錄中的重要內(nèi)容以鏈接的方式在首頁或其它子頁中多次呈現(xiàn)，以突出重點。搜索引擎會對這種一站內(nèi)多次出現(xiàn)的鏈接給予充分重視，對網(wǎng)頁級別（PageRank）提高有很大幫助，這也是每個網(wǎng)站首頁的網(wǎng)頁級別一般高于其它頁面級別的重要因素，因為每個子頁都對首頁進行了鏈接。

4、使用網(wǎng)站地圖
網(wǎng)站地圖（Site Map）是輔助導航的手段，最初是為用戶設計，以方便用戶快捷到達目標頁。良好的網(wǎng)站地圖設計常常以網(wǎng)站拓撲結構體現(xiàn)復雜的目錄關系，具有靜態(tài)、直觀、扁平、簡單的特點。多采用文本鏈接，不用或少用修飾性圖片，以加快頁面加載速度。以上特點符合搜索引擎友好的要求，因此網(wǎng)站地圖在SEO中也有重要的意義。尤其對于那些采用圖片導航和動態(tài)技術生成的網(wǎng)頁，通過在網(wǎng)站地圖中進行文本鏈接，可在一定程度上彌補蜘蛛程序無法識別圖片和動態(tài)網(wǎng)頁造成的頁面不可見的風險。
www.here123.com

需要注意，網(wǎng)站地圖也要突出重點，盡量給出主干性內(nèi)容及鏈接，而不是所有細枝末節(jié)。一頁內(nèi)不適宜放太多鏈接。Google明確提出"如果網(wǎng)站地圖上的鏈接超過大約 100 個，則最好將網(wǎng)站地圖拆成多個網(wǎng)頁"。
工具推薦：
Xenu：http://home.snafu.de/tilman/xenulink.html 生成網(wǎng)站地圖
框架結構
框架結構，即幀結構（Frame）網(wǎng)頁表現(xiàn)為一個頁面內(nèi)的某一塊保持固定，其它部分信息可以通過滾動條上下或左右移動顯示，如左邊菜單固定，正文信息可移動，或者頂部導航和LOGO部分保持固定，其它部分上下或左右移動。我們的郵箱通常都采用框架建構?？蚣苄途W(wǎng)頁的另一個表現(xiàn)是，深層頁面的域名通常不會在URL中體現(xiàn)出來，即使進入深層子頁面，瀏覽器顯示出來的URL仍然是主頁的URL。

框架型網(wǎng)站的優(yōu)越性體現(xiàn)在頁面的整體一致性和更新方便上。尤其對于那些大型網(wǎng)站而言，框架結構的使用可以使網(wǎng)站的維護變得相對容易。但框架對搜索引擎來說是一個很大的問題，這是由于大多數(shù)搜索引擎都無法識別框架，也沒有什么興趣去抓取框架中的內(nèi)容。此外，某些瀏覽器也不支持框架頁面。

如果網(wǎng)頁已經(jīng)使用了框架，或出于某種原因一定要使用框架結構，則必須在代碼中使用"Noframes"標簽進行優(yōu)化，把Noframe標簽看做是一個普通文本內(nèi)容的主頁。在<Noframe></Noframe>區(qū)域中包含指向frame頁的鏈接以及帶有關鍵詞的描述文本，同時在框架以外的區(qū)域也出現(xiàn)關鍵詞文本。這樣，搜索引擎才能夠正確索引到框架內(nèi)的信息。

還有一個辦法是采用iframe即內(nèi)聯(lián)框架(Inner Frame)技術來避免Frame帶來的不便。所謂iframe也是框架的一種形式，它是相當于在主瀏覽器窗口中內(nèi)嵌一個子窗口，內(nèi)容自動打開。iframe可以嵌在網(wǎng)頁中的任意部分，也可以隨意定義其大小，其代碼顯示為：

<iframe src=xx width=x height=x scrolling=xx frameborder=x></iframe>"
對搜索引擎來說，iframe中的文字是可見的，也可以跟蹤到其中鏈接指向的頁面，不過與用戶所見不同的是，搜索引擎將iframe內(nèi)容看成單獨的一個頁面內(nèi)容，與被內(nèi)嵌的頁面無關。
圖像優(yōu)化
一般而言，搜索引擎只識讀文本內(nèi)容，對圖像是不可見的。同時，圖像文件直接延緩頁面加載時間，如果超過20秒網(wǎng)站還不能加載，用戶和搜索引擎極有可能離開你的網(wǎng)站。因此，除非你的網(wǎng)站內(nèi)容是圖片為主，比如游戲站點或者圖片至關重要，否則盡量避免使用大圖片，更不要采用純圖像制作網(wǎng)頁(SPLASH PAGE)。

網(wǎng)站圖片優(yōu)化的核心有兩點：增加搜索引擎可見的文本描述，以及在保持圖像質(zhì)量的情況下盡量壓縮圖像的文件大小。
Alt屬性：
每個圖像<IMG>標簽中都有ALT屬性，搜索引擎會讀取該屬性以了解圖像的信息。因此，最好在所有插圖的ALT屬性中都有文字描述，并帶上該頁關鍵字在其中。
如：m.aorustv.com的主頁LOGO部分代碼為：
<img src="/article/UploadPic/2007-3/200739223415731.gif" alt="重慶網(wǎng)站建設" width="200" height="70" border="0">
文本說明：
除了ALT屬性文字，還可以考慮以下方法直接優(yōu)化圖像，使之被搜索到：
1、在圖片上方或下方加上包含關鍵詞的描述文本；
2、在代碼中增加一個包含關鍵詞段的heading標題標簽，然后在圖片下方增加文字描述。
3、在圖片下方或旁邊增加如"更多某某"鏈接，包含關鍵詞。
4、創(chuàng)建一些既吸引用戶又吸引搜索引擎的文本內(nèi)頁，先把流量吸引到這些頁面，再提供文本鏈接指向你的圖片頁面。
總體上，網(wǎng)頁應盡量減少裝飾性圖片以及大圖片。而Alt屬性中的文字對搜索引擎來說，其重要性比正文內(nèi)容的文字要低。
Gif和JPGE圖像優(yōu)化：
Alt屬性和文本說明都只是對圖像之外的文本環(huán)境進行優(yōu)化，下面簡單談談對圖片本身的優(yōu)化處理。對圖片文件優(yōu)化的目的是在盡量不影響圖像畫面效果的情況下，將其文件大小降到最低，以加快頁面整體下載速度。

網(wǎng)頁圖片格式主要有GIF和JPGE兩種形式。一般來講，GIF適用于線圖和企業(yè)標識；JPEG適宜照片元素的格式。主要通過減少GIF顏色數(shù)量、縮小圖片尺寸和降低分辯率來縮小文件，也可以采用層疊樣式表達到優(yōu)化的目的。PhotoShop的版本越高越適用于網(wǎng)絡圖形。此外，將大圖片切割成若干小圖片于不同的表格區(qū)間內(nèi)進行拼接，也可以相對加快下載時間。

由于FLASH優(yōu)美的視覺效果和廣闊的創(chuàng)意空間，F(xiàn)LASH技術在網(wǎng)頁設計和網(wǎng)絡廣告中的應用非常廣泛，很多網(wǎng)站首頁甚至全部用FLASH設計。但FLASH網(wǎng)頁有一個非常致命的問題，即大部分搜索引擎無法識別FLASH中的信息。Google也只能檢索到部分Flash文件中的內(nèi)嵌鏈接。
以下列舉一個制造機電設備的企業(yè)網(wǎng)站首頁的代碼，用FLASH制作，請注意是否可以看見有意義的文本：

因此可以得出結論是：
蜘蛛程序沒有在這個企業(yè)網(wǎng)站首頁獲得任何有意義的文本內(nèi)容，也沒有獲得該Flash首頁中進入"中文版""英文版"關鍵性內(nèi)容的鏈接。

FLASH優(yōu)化可以從以下三個方面來考慮：
1、做一個輔助HTML版本： 保留原有FLASH版本的同時，還可以設計一個HTML格式的版本，這樣既可以保持動態(tài)美觀效果，也可以讓搜索引擎通過HTML版本的網(wǎng)頁來發(fā)現(xiàn)網(wǎng)站。

2、將Flash內(nèi)嵌HTML文件： 還可以通過改變網(wǎng)頁結構進行彌補，即不要將整個網(wǎng)頁都設計成Flash動畫，而是將Flash內(nèi)容嵌入到HTML文件中，這樣對于用戶瀏覽并不會削弱視覺效果，搜索引擎也可以從HTML代碼中發(fā)現(xiàn)一些必要的信息，尤其是進入內(nèi)容頁面的鏈接。 即使首頁全部動用了FLASH，也應該將進入內(nèi)頁的關鍵性按鈕/鏈接置于FLASH文件之外，以獨立純文本鏈接的方式呈現(xiàn)。上文案例將"中文版"鏈接置于FLASH文件中，使得蜘蛛程序一無所獲，無法抓取到內(nèi)頁信息。

3、付費登錄搜索引擎： 如果FLASH網(wǎng)站錯過了被免費的技術型搜索引擎自動檢索的機會，或者搜索結果排名效果不太理想，可以通過付費登錄或做搜索引擎關鍵詞廣告，同樣被用戶搜索到。
總體上，商業(yè)網(wǎng)站應盡量少用FLASH，站點間進行廣告交換時也要避免采用FLASH廣告為上策。

 信息來源：重慶網(wǎng)站建設,網(wǎng)站建設