設計分享-標題

回首頁設計分享列表設計分享

[SEO]SEO-CSS和網頁設計

time : 2008/12/29 上午 10:38:57    瀏覽次數:6272

[ 轉載 ] 索尼和香蕉王的紅燈人生

你的網站還在用傳統的Table在編輯排版嗎?如果是,請看下面的分析,
不管你是已經有網站或者正要準備建構網站,一定要要求承做的
網頁設計公司,
一定要用CSS設計排版,這樣才會符合現今的網頁規格與往後的SEO優化。



我們知道SEO的目標是帶來網路流量,要如何實施SEO、要注意哪些細節
我整理了CSS和網站設計一些比較大方向的要點出來,與大家一起分享

首先,在設計網站前 我們應該先決定網站或是BLOG的主題。
因為 搜尋引擎也會分類,就像產品一樣,搜尋引擎會將您的網站放在正確的分類中。
讓您的網站在正確地被搜尋、正確地出現在瀏覽者的頁面中。
而網站的每個頁面應該遵循一個主題,所以在格式設計上應保持一制性或是內容的連貫性。

以下是網站設計和CSS對於SEO的幾項要點說明:
先簡單介紹一下CSS,CSS全名為『 Cascading Style Sheers 』,中文稱為串接樣式表。
用具體的話來描述CSS的運用,就是將網頁的標籤建立統一的規範。
W3C 於1996年12月發表了CSS1,直到這幾年越來越多網站設計師(公司)開始遵循並使用CSS。
造成趨勢的原因在於 網頁標準規格 (Web Standards)
所謂的網頁標準規格,其實就是 在網路世界上大家共通的規定。
主要目的是在不同的瀏覽器上,將網頁的內容完整並正確地顯示於瀏覽者面前,留下更好的網站使用體驗。
因此,在瀏覽器與瀏覽工具日益多樣化的情況下,CSS也逐漸開始受到重視與推廣運用。
接著,讓我們更了解CSS的主要優點在於哪些方面:

1. 提高可維護性

    藉由遵循網頁設計標準規格,文件的內容構造與版面設計變得可以分開管理。
    因此只要修改單一一個CSS檔,就能讓整個網站的版面一新。

2. 減輕網路負荷

    原本為了版面設計使用的多層巢狀表格消失後,(X)HTML的檔案不在龐大。
    因此,可以減少在網路上傳送的資料量。
    尤其是在點閱率高的網站上,網路負荷的減輕就等於是成本的節省。
    而且對使用者而言 還有等待時間縮短的優點。 

3. 外掛JavaScript

    我們可以透過CSS將難看、冗長的JavaScript等一長串的程式置於網頁之外。
    而以連結方式外掛使用,還可以將網頁開頭的一些不重要的程式碼移到網頁頁尾,
    以便搜尋引擎快速讀取中心內容。這樣不僅能為網頁減肥,而且能使搜尋引擎最佳化中,
    可以對重要標題給予修飾的同時,而不影響網頁美觀。

4. 外掛CSS

    將CSS程式碼做成外掛程式檔,當需要執行時在載入使用,不用放在網頁中,
    以減少網頁的檔案大小,還能使搜尋引擎儘快地存取網頁內容,同時還可以使網頁顯示的速度加快。

5. 實施SEO

    這是最重要的原因,對於搜尋引擎的網頁搜錄程式(Web Crawler)或蜘蛛機器人程式(Spider)而言,
    首頁標題和內容小標題完備的網頁是最容易處理的。
    所以只要網頁遵循網頁標準規格,網頁搜錄程式就能正確地顯示出頁面摘要。
    在這裏介紹一下一個有趣的 Google 機器人與芭樂網經理的對話 (上) (中) (下),很好笑又很有料


接下來,在設計網站前,我們應該先了解以下幾種不利於最佳搜尋的狀況:

1. 動畫 (Flash)

    許多網站採用了Flash動畫,使網站變得很精彩、動態感十足。
    但,不幸的是,搜尋引擎卻沒有辦法觀賞動畫的內容,應該是說搜尋引擎無法判別這個動畫代表著什麼意義
    因此我們可以在同一頁面上增加一些文字的說明或是在Flash檔案下面放上Flash檔案內容的相關說明。
    在 FALSH與SEOGoogle中提供一些解決的方法,請大家參考看看。

2. 圖片 (Picture)

    網站上的圖片顯示速度比文字漫,所以實施SEO前,我們必須要求圖片的檔案大小儘量限制在最小。
    當網站背景或頁面上有太多、太大的圖片,搜尋引擎探測器會浪費太多的時間在讀取圖片內容,
    這樣會使得搜尋引擎不能完全抓到網站的內容,而影響網站在搜尋結果中出現的機率。
    一般來說以GIF檔為適合,當然還是要以圖檔的使用目的與用途為前提來設計網站。
    還有,避免用圖片做連結,因為搜尋引擎不認識圖片,它們只認識純文字。
    所以,圖片加上註明的標籤、說明,不只讓瀏覽者了解,更是網頁中的一兩個關鍵字。

  3. 網站地圖 (Sitemap)

      網站地圖不只方便瀏覽者導覽,更是SEO的一個重要步驟
      最主要的作用是協助搜尋引擎的探索機器人(Web Crawler)或蜘蛛機器人程式(Spider)
      指引它們按照地圖上的指示進入各個網頁的連結,順利到達各個網頁,讓搜尋引擎收錄網站的全貌
      而這個地圖對於使用JavaScript做的Menu網站,或使用Flash隱含連結的網站來說更是非常重要。

  4. 框架和表格 Frame and Table

      在探討框架和表格前,先來看看Google怎麼說
     「Google 會在能力所及內支援頁框及 iframe。但是頁框可能會造成搜尋引擎的問題,
      因為頁框與網頁的概念模組不符。在此模組內,一個網頁只能顯示一個網址。
      使用頁框或 iframe 的網頁會在單一網頁內顯示數個網址 (每個頁框一個)
      Google 會嘗試將頁框內容與包含頁框的網頁連結,但無法保證可以做到。」
      從這段說明可以看出,使用框架或是表格都是有礙於SEO化。
      使用過多的框架和表格,會讓搜尋引擎以爬行、非常緩慢的方式在來搜尋網站。
      當遇到多個網頁組合在一起的時候,就像是火車在鐵軌上行駛一樣。
      在交叉的軌道中只能隨著一條軌道走,存取一個網頁,其它網頁就會被忽略了。
      因此,SEO強調網站必須擺脫使用框架或表格的組成方式,
      這也是我推薦使用CSS來製作網站的最重要的原因。 

[ 結論 ] 
無論是自己要架設網站或是請
網頁設計公司架設網站,這些設計細節都是極為重要的
在這個數位行銷的時代,將網站朝向SEO化確實是一件重要的龐大工程
從網站設計、CSS排版、關鍵字分析、網站登錄、資訊發佈、內外部連結的選擇...等等許多細節
都是需要時間的累積與實務的探討,在這過程往往是緩慢、持續、令人耗費精神的。
SEO沒有一步登天的方法,只有在穩紮穩打中累積自身的實力並和競爭對手抗衡。
相信,搜尋頁面被第一位的您佔據後,隨後而來的並不是只有驕傲和商業機會
而是,繼續維持現有的名次甚至朝向其它關鍵字發展,不斷地更新、充實自己。
SEO是一件很好玩、很複雜、很專業、很值得讓人研究的數位行銷方式,
在了解、接觸SEO後,它帶來的往往比你想像還要多更多。

 

相關連結:http://sony1708.pixnet.net/blog/post/23945230

 

 

上一頁