課本：
您用來標(biāo)記頁面的方法決定了它們是否可以被軟件很好地讀取，并且被搜索引擎很好地編入索引坦袍。網(wǎng)站所依賴的底層文件和目錄的邏輯性和穩(wěn)定性會影響其功能匕争，以及其增長和擴(kuò)展的潛力。
第五章
網(wǎng)站結(jié)構(gòu)
網(wǎng)站的組成部分
盡管現(xiàn)在大多數(shù)網(wǎng)站都是使用網(wǎng)站內(nèi)容管理系統(tǒng)（CMS）構(gòu)建的贯卦，它可以讓您遠(yuǎn)離組成網(wǎng)站的大部分代碼资柔，但仍然需要對基本代碼和原則有深入的了解。
使用超文本標(biāo)記語言（HTML）
以下部分介紹了HTML內(nèi)容標(biāo)記的一些核心原則撵割，在撰寫本文時(shí)贿堰，HTML的最新版本是HTML5，我們在這里介紹的示例使用HTML5約定啡彬。
語義標(biāo)記
正確使用HTML是獲得最大靈活性和投資回報(bào)網(wǎng)絡(luò)內(nèi)容的關(guān)鍵羹与。從最初的起源看，HTML的設(shè)計(jì)是為了清楚地區(qū)分文檔的層次輪廓結(jié)構(gòu)（標(biāo)題1庶灿，標(biāo)題2纵搁，段落，列表等）和文檔的可視化表示（粗體往踢，斜體腾誉，字體，字體大小，顏色利职， 等等）趣效。當(dāng)使用標(biāo)準(zhǔn)HTML標(biāo)簽來傳達(dá)意義和內(nèi)容結(jié)構(gòu)時(shí)，HTML標(biāo)記被認(rèn)為是語義的猪贪，而不僅僅是在瀏覽器中使文本看起來特定跷敬。
這種網(wǎng)絡(luò)標(biāo)記的語義方法是高效網(wǎng)頁編碼，信息架構(gòu)热押，通用可用性西傀，搜索引擎可見性和最大顯示靈活性的核心概念。
文檔結(jié)構(gòu)
結(jié)構(gòu)合理的HTML文檔可能包含以下元素：
HTML文檔結(jié)構(gòu)（<head>楞黄，<body>池凄，<div>，<span>）
文字內(nèi)容
傳達(dá)意義和內(nèi)容結(jié)構(gòu)的語義標(biāo)記（標(biāo)題鬼廓，段落文本肿仑，列表，引文）
使用CSS進(jìn)行視覺呈現(xiàn)以使內(nèi)容看起來有一定的方式
視聽內(nèi)容（.gif碎税，.jpeg或.png圖形尤慰，媒體文件）的鏈接
交互行為（JavaScript，PHP或其他編程技術(shù)）
在格式正確的HTML中雷蹂，所有網(wǎng)頁代碼都包含在兩個(gè)基本元素中：
頭（<head>…</head>）
身體（<body>…</body>）
<head>區(qū)域是您的網(wǎng)頁向顯示設(shè)備（網(wǎng)頁瀏覽器伟端，手機(jī)，平板電腦等）以及所有重要頁面標(biāo)題所在的位置聲明其代碼標(biāo)準(zhǔn)和文檔類型的區(qū)域匪煌。頁首區(qū)域還可以包含指向您的網(wǎng)站中許多頁面可以共享的外部樣式表和JavaScript代碼的鏈接责蝠。
該<body>區(qū)域包含所有頁面內(nèi)容，對于視覺樣式萎庭，編程和語義內(nèi)容標(biāo)記的CSS控制非常重要霜医。頁面主體中的區(qū)域通常用division（<div>）或span（<span>）標(biāo)簽進(jìn)行功能分割。例如驳规，大多數(shù)網(wǎng)頁都具有頁眉肴敛，頁腳，內(nèi)容和導(dǎo)航區(qū)域吗购，所有這些頁面都使用命名<div>標(biāo)簽進(jìn)行指定医男，可以使用CSS進(jìn)行尋址和視覺樣式。
使用HTML5作為頁面標(biāo)記的標(biāo)準(zhǔn)方面有很多優(yōu)勢捻勉，其中包括：
與當(dāng)前文檔結(jié)構(gòu)技術(shù)兼容镀梭，以及HTML5強(qiáng)大的新媒體功能。
與非HTML網(wǎng)頁標(biāo)記標(biāo)準(zhǔn)（如用于科學(xué)文檔的Mathml和可縮放矢量圖形（svg））的最大兼容性踱启。
與新的內(nèi)容標(biāo)記和編程技術(shù)报账，內(nèi)容管理系統(tǒng)以及其他將從HTML5標(biāo)記標(biāo)準(zhǔn)中受益的不斷發(fā)展的網(wǎng)絡(luò)技術(shù)的未來兼容性撒强。
內(nèi)容結(jié)構(gòu)
這些鏈接以及它們包含的替代文本（“alt”文本）或長描述（“l(fā)ongdesc”）鏈接對于通用可用性和搜索引擎可見性至關(guān)重要。
使用級聯(lián)樣式表（CSS）
級聯(lián)樣式表允許Web發(fā)布者保留使用語義HTML傳達(dá)邏輯文檔結(jié)構(gòu)和含義的巨大好處笙什，同時(shí)讓圖形設(shè)計(jì)師完全控制每個(gè)HTML元素的視覺顯示細(xì)節(jié)。
CSS級聯(lián)層次結(jié)構(gòu)
CSS具有多個(gè)級別級別胚想，從重要性和優(yōu)先級級聯(lián)琐凭，從所有頁面共享的常規(guī)CSS代碼，包含在特定頁面文件中的代碼浊服，嵌入到特定HTML標(biāo)簽中的代碼统屈。常規(guī)頁面代碼覆蓋共享站點(diǎn)代碼，嵌入在HTML標(biāo)記中的CSS代碼覆蓋常規(guī)頁面代碼牙躺。這種CSS優(yōu)先級的級聯(lián)級聯(lián)允許您為整個(gè)網(wǎng)站設(shè)置非常一般的樣式愁憔，同時(shí)允許您根據(jù)特定節(jié)或頁面樣式的需要覆蓋樣式。
跨多頁共享CSS
例如孽拷，如果您<h1>在主文件中調(diào)整標(biāo)題的印刷風(fēng)格吨掌，<h1>整個(gè)網(wǎng)站中的每個(gè)標(biāo)題都會更改以反映新外觀。
CSS中“級聯(lián)”的強(qiáng)大優(yōu)勢是內(nèi)置于CMS程序（如WordPress和Drupal）所使用的主題中脓恕，但這兩種程序還允許您通過創(chuàng)建主樣式表來創(chuàng)建主題樣式的自定義變體膜宋，以調(diào)整特定樣式你正在使用的主題。例如炼幔，您可能對WordPress主題的外觀和感覺非常滿意秋茫，但可能希望所有標(biāo)題都使用Tahoma字體而不是主題的內(nèi)置Arial字體作為標(biāo)題。大多數(shù)WordPress主題允許您添加自己的CSS來自定義主題的各個(gè)方面乃秀。例如肛著，在WordPress儀表板中，請參閱菜單外觀>自定義> CSS以訪問自定義CSS列表跺讯。要將您網(wǎng)站中的所有標(biāo)題更改為Tahoma枢贿，您可以將此行添加到自定義CSS列表中：
h1, h2, h3, h4, h5, h6 { font-family: Tahoma, sans-serif; }
媒體樣式表和響應(yīng)式CSS樣式
“響應(yīng)式”CSS樣式根據(jù)用戶屏幕的大小自定義導(dǎo)航和內(nèi)容的顯示，使用CSS3媒體查詢確定用戶顯示屏幕的最大或最小寬度抬吟。在這個(gè)簡單的例子中萨咕，我們使用媒體查詢語句（@media）在小型手機(jī)屏幕上隱藏左側(cè)導(dǎo)航邊欄：
<style>
@media (max-width: 600px) {
.left_sidebar { display: none; }
}
</style>
本機(jī)，網(wǎng)頁或混合：
原生應(yīng)用程序是使用該平臺的開發(fā)工具和編程語言創(chuàng)建的火本。他們可以訪問平臺功能危队，如地理定位和相機(jī)。它們速度快并且簡單易用钙畔，尤其是在設(shè)計(jì)遵循平臺的用戶界面準(zhǔn)則時(shí)茫陆。
Web應(yīng)用程序使用Web技術(shù)構(gòu)建 - HTML，CSS和JavaScript擎析。使用響應(yīng)式設(shè)計(jì)技術(shù)構(gòu)建簿盅，網(wǎng)絡(luò)應(yīng)用可以在各種設(shè)備上運(yùn)行良好 網(wǎng)絡(luò)應(yīng)用程序最大的缺點(diǎn)是它們無法訪問設(shè)備功能挥下，包括離線存儲。
混合應(yīng)用程序是基于HTML和JavaScript的Web應(yīng)用程序桨醋，它們被封裝在本機(jī)應(yīng)用程序容器中棚瘟，允許訪問本地平臺功能。
交互式腳本
JavaScript是一種常用于在網(wǎng)頁上創(chuàng)建交互式行為的語言喜最。JavaScript也是網(wǎng)頁內(nèi)容交付策略的關(guān)鍵技術(shù)偎蘸，如ajax和廣泛使用的代碼庫，如jQuery瞬内。在大多數(shù)情況下迷雪，JavaScript代碼屬于網(wǎng)頁的“頭部”區(qū)域，但如果您的代碼復(fù)雜且冗長虫蝶，則您的“真實(shí)”網(wǎng)頁內(nèi)容將被推到代碼下方幾十行章咧，并且可能不會被搜索引擎發(fā)現(xiàn)。如果您使用頁面級JavaScript腳本（也稱為客戶端腳本）能真，則應(yīng)將所有代碼中最短的代碼放在鏈接的JavaScript文件中赁严。通過這種方式，您可以使用冗長而復(fù)雜的JavaScript粉铐，而不會冒著搜索排名的風(fēng)險(xiǎn)误澳。
其他文件格式
PDF（便攜式文檔格式）是一種廣泛用于提供功能和面向紙張格式的文檔格式，這些格式不可用于基本HTML秦躯。對于源自文字處理和頁面布局程序的文檔忆谓，為了保留原始文檔的外觀，PDF文件通常受到青睞踱承。通常倡缠，最好的方法是將文檔提供為純HTML，因?yàn)闃?biāo)記提供了更大的靈活性茎活，并且旨在實(shí)現(xiàn)通用可用性昙沦。
Adobe尤其努力通過支持語義標(biāo)記，文本等價(jià)物载荔，和鍵盤可訪問性盾饮。Bing和Google等主要搜索引擎可以“讀取”并索引PDF文件的內(nèi)容，但許多移動設(shè)備不能很好地在小屏幕上顯示PDF文件懒熙。
建立堅(jiān)實(shí)的結(jié)構(gòu)
瀏覽器變體
不要相信HTML5丘损，CSS，JavaScript工扎，Java或任何瀏覽器插件體系結(jié)構(gòu)（如Adobe Flash）的實(shí)施徘钥，直到您看到您的網(wǎng)頁顯示并可靠地與每個(gè)主要桌面和移動Web瀏覽器以及兩個(gè)主要操作系統(tǒng)（Microsoft Windows，Apple Macintosh肢娘，Apple的移動iOS呈础，
檢查您的網(wǎng)絡(luò)日志或使用Google Analytics等服務(wù)舆驶，確保您了解哪些瀏覽器品牌，瀏覽器版本和操作系統(tǒng)（Mac而钞，Windows沙廉，移動設(shè)備）在您的特定讀者群中最為常見。如果您在不同瀏覽器中呈現(xiàn)頁面的方式出現(xiàn)差異臼节，則可以使用代碼驗(yàn)證服務(wù)（例如來自W3C的代碼驗(yàn)證服務(wù)）來確認(rèn)您使用的是有效的HTML和CSS代碼（對于HTML蓝仲，validator.w3.org ;對于CSS ，jigsaw.w3.org/CSS-validator）官疲。并非所有的瀏覽器都支持CSS3的每一項(xiàng)功能（在撰寫本文時(shí)為最新版本），特別是如果該功能很少使用或最近已添加到CSS3代碼的官方標(biāo)準(zhǔn)中亮隙。例如途凫，盡管放置陰影的文本是一個(gè)有效的CSS3選項(xiàng)，但并非每個(gè)瀏覽器都支持它溢吻。
文件名稱
網(wǎng)頁是由瀏覽器傳送到我們屏幕上看到的一致頁面的一組文件维费。注意文件和目錄名稱對于跟蹤組成網(wǎng)站的無數(shù)頁面和支持文件至關(guān)重要。
在純語言名稱的情況下促王，千萬不要使用技術(shù)或數(shù)字亂碼來命名組件犀盟。
當(dāng)你使用簡單英文標(biāo)簽并為你的代碼添加解釋性評論時(shí)，你可能最為青睞的人是你自己蝇狼，從現(xiàn)在起三年阅畴。三年后，你會知道一個(gè)名為“x83_0002”的網(wǎng)站目錄是什么嗎迅耘？
內(nèi)容管理系統(tǒng)
Web內(nèi)容管理系統(tǒng)（CMS）是基于服務(wù)器的軟件贱枣，可以簡化，結(jié)構(gòu)化和管理Web內(nèi)容的創(chuàng)建和交付颤专，提供圖形用戶界面纽哥，允許用戶創(chuàng)建網(wǎng)頁和其他Web信息，而無需學(xué)習(xí)HTML栖秕， CSS或其他類型的網(wǎng)頁編碼春塌。
CMS還可以處理站點(diǎn)管理任務(wù)，例如將整個(gè)站點(diǎn)脫機(jī)進(jìn)行維護(hù)簇捍。
流行的內(nèi)容管理系統(tǒng)
流行的開源內(nèi)容管理系統(tǒng)（如WordPress只壳，Drupal和Joomla）是個(gè)人，政府暑塑，大學(xué)和中小企業(yè)使用最廣泛的CMS程序。大型企業(yè)梯投，政府况毅，新聞和電子商務(wù)網(wǎng)站通常使用更復(fù)雜的商業(yè)CMS程序尔艇，如OpenText CMS（以前稱為Red Dot），Ingeniux CMS或Ektron CMS终娃。
在這里，我們將主要使用兩個(gè)開源產(chǎn)品WordPress和Drupal作為示例棠耕，原因如下：
- 這兩種廣泛使用的網(wǎng)絡(luò)內(nèi)容管理系統(tǒng)都可以免費(fèi)安裝。有了適中的技術(shù)技能辉巡，您可以在大約半小時(shí)內(nèi)從WordPress（wordpress.org）或Drupal（drupal.org）下載并安裝任一程序蕊退。
- Drupal和WordPress都可以通過WordPress.com（wordpress.com）和Drupal Gardens（drupalgardens.com）以托管產(chǎn)品的形式提供郊楣，而且這兩個(gè)程序的基本功能集都可以免費(fèi)托管。
- WordPress和Drupal反映了不同的CMS方法：Drupal是一個(gè)功能強(qiáng)大瓤荔，高度可擴(kuò)展的CMS净蚤，非常適合復(fù)雜的內(nèi)容體。WordPress的功能也很豐富输硝，但開始起步要容易得多今瀑，而且對于非技術(shù)型的設(shè)計(jì)師和作家來說更容易上手。
我們強(qiáng)烈建議您花費(fèi)一點(diǎn)時(shí)間在Drupal和WordPress托管版本中点把，這是熟悉內(nèi)容管理系統(tǒng)世界的最快方式放椰。
建立編輯工作流程
內(nèi)容管理系統(tǒng)的核心功能之一是將編輯角色正式化，并為內(nèi)容創(chuàng)建和發(fā)布創(chuàng)建有組織的工作流程
對于協(xié)作式內(nèi)容創(chuàng)建組愉粤，CMS提供了強(qiáng)大的優(yōu)勢砾医，可以精心構(gòu)建和規(guī)范編輯工作和發(fā)布流程。
角色和責(zé)任
搜索引擎優(yōu)化（SEO）
CMS作為內(nèi)容策略的一部分
內(nèi)容策略項(xiàng)目的主要“交付內(nèi)容”是內(nèi)容制作模板衣厘，它不僅描述了新內(nèi)容及其目標(biāo)受眾和用途的一般意圖如蚜，而且還包括指導(dǎo)作者為最佳類別生成建議的說明，將在CMS中使用的子類別和關(guān)鍵字影暴。有關(guān)內(nèi)容策略的概述错邦，請參閱第1章“策略”。
選擇一個(gè)CMS
Linux-Apache-Mysql-PHP（LAMP）
數(shù)字資產(chǎn)管理系統(tǒng)（DAM）
WordPress的
到目前為止型宙，WordPress已經(jīng)成為任何主要網(wǎng)站內(nèi)容管理系統(tǒng)中最友好撬呢，最精致的用戶界面。它也是當(dāng)今網(wǎng)絡(luò)上使用最廣泛的CMS妆兑，該軟件下載量超過四千六百萬次魂拦，大約46％的網(wǎng)站使用CMS毛仪。您可以從WordPress.org在您自己的服務(wù)器或個(gè)人計(jì)算機(jī)上下載并安裝WordPress，許多Web托管服務(wù)（如Rackspace和Media Temple）在您的托管服務(wù)器上提供“一鍵式”WordPress安裝芯勘。開始使用WordPress的最簡單方法是在WordPress.com的托管版本中使用它箱靴，該版本管理所有服務(wù)器問題荷愕，并且只使用該軟件安疗。簡單的WordPress.com網(wǎng)站是免費(fèi)的荐类，具有自定義域名掉冶，更高級主題和其他功能的更復(fù)雜的網(wǎng)站價(jià)格適中厌小。
WordPress和Drupal最初都是為支持網(wǎng)絡(luò)日志（博客）而創(chuàng)建的璧亚，但WordPress仍然更接近博客的根源癣蟋，特別是它處理內(nèi)容創(chuàng)建和工作流程的簡單性疯搅。WordPress以易用性著稱幔欧，許多小型網(wǎng)站或Web團(tuán)隊(duì)不需要Drupal提供的復(fù)雜的內(nèi)容構(gòu)建功能或工作流功能礁蔗。如果您的內(nèi)容需求并不復(fù)雜浴井，并且想要通過易于混合短文本和圖片的網(wǎng)站快速啟動并運(yùn)行洪囤，WordPress可能是您的完美解決方案箍鼓。
WordPress可以通過插件添加軟件來擴(kuò)展款咖，這些軟件為WordPress的核心功能帶來新的功能和特性 - 尤其是為了添加更高級的CMS功能铐殃。UltimateCMS和白標(biāo)CMS是兩個(gè)這樣的插件富腊，但值得注意的是：WordPress的核心優(yōu)點(diǎn)是簡單赘被。如果您已經(jīng)嘗試使用WordPress并迅速達(dá)到其作為內(nèi)容組織工具的極限民假，那么您最好考慮使用Drupal羊异。Drupal很難開始使用野舶，但如果您有復(fù)雜的內(nèi)容需求平道，則需要更多的時(shí)間巢掺。
Drupal的
Drupal是一個(gè)功能強(qiáng)大的網(wǎng)頁內(nèi)容管理框架陆淀，可以支持各種網(wǎng)站轧苫，從簡單的博客到主要的機(jī)構(gòu)網(wǎng)站身冬，有成千上萬頁的內(nèi)容和復(fù)雜的信息架構(gòu)需求酥筝。所有這些功能和靈活性都以最初的易用性為代價(jià)嘿歌。Drupal的聲譽(yù)遠(yuǎn)遠(yuǎn)低于WordPress宙帝，并且用戶界面不太好用步脓。然而靴患，最新版本的Drupal（本文寫作版本為7）已經(jīng)向新用戶提供了一個(gè)不太令人生畏的接口鸳君，并且即將推出的Drupal 8也將重點(diǎn)放在使Drupal更易于使用相嵌。大約7-8％使用CMS的網(wǎng)站使用Drupal，但這可能低估了Drupal的中型機(jī)構(gòu)和商業(yè)網(wǎng)站的核心市場格了。例如盛末，Drupal是高等教育中占主導(dǎo)地位的CMS悄但，
Drupal包含強(qiáng)大的工具檐嚣，用于構(gòu)建內(nèi)容和創(chuàng)建分類（受控詞表嚎京，用于對內(nèi)容進(jìn)行排序和標(biāo)記）鞍帝，并為設(shè)計(jì)工作流角色和編輯訪問權(quán)限提供了很大的靈活性; 此外帕涌，Drupal擁有龐大而活躍的用戶和開發(fā)人員社區(qū)宵膨，遠(yuǎn)遠(yuǎn)超過任何同等商業(yè)CMS產(chǎn)品谷扣。模塊化結(jié)構(gòu)使得Drupal對有經(jīng)驗(yàn)的PHP開發(fā)人員更具吸引力会涎，因?yàn)榛镜腄rupal軟件核心可以通過增加新功能的代碼模塊進(jìn)行擴(kuò)展末秃。
組織內(nèi)容和功能
塊
塊是頁面布局區(qū)域內(nèi)的內(nèi)容或交互功能的區(qū)域练慕。將塊視為預(yù)先設(shè)計(jì)的模塊化單元或可以放入頁面布局模板中的“構(gòu)建塊”铃将，以將預(yù)定義的功能添加到頁面中劲阎。例如悯仙，用戶登錄區(qū)域可以是塊锡垄，用戶輪詢货岭，搜索條目表單或特定類型的導(dǎo)航鏈接布局寻拂。在Drupal塊中祭钉，通常是附加模塊的可視化界面慌核，它們擴(kuò)展了CMS的基本功能垮卓∷诎矗可以將塊配置為顯示多種不同的方式灭将，并且CMS管理員可以決定塊在頁面區(qū)域（頁眉庙曙，左側(cè)欄捌朴，頁腳）中的顯示位置砂蔽。
查看
視圖允許您以多種不同的方式安排特定類型的文本和視覺內(nèi)容察皇。
分類
CMS分類系統(tǒng)允許您精確地構(gòu)建和控制用于標(biāo)記內(nèi)容的信息 - 元信息（如內(nèi)容可能適合的一般和特定類別）以及關(guān)于內(nèi)容的關(guān)鍵字和其他描述符泽台。
創(chuàng)建主題和模板
主題控制基于CMS的網(wǎng)站的大部分視覺效果怀酷，包括整體頁面布局蜕依，排版友瘤，配色方案辫秧，圖形以及頁面和頁面標(biāo)題的其他視覺細(xì)節(jié)盟戏，以及內(nèi)容組織元素（如區(qū)域）的位置柿究，塊和視圖蝇摸。
自定義主題
搜索引擎優(yōu)化
搜索引擎用于“抓取”網(wǎng)頁之間的鏈接并創(chuàng)建搜索索引的自動化軟件的網(wǎng)頁顯示方式已成為用戶是否會查找您在網(wǎng)絡(luò)上發(fā)布的信息的最重要因素探入。
了解搜索
網(wǎng)站使用的大多數(shù)模式遵循廣為人知的長尾分布蜂嗽。
這種流行的長尾分布模式適用于商店中的產(chǎn)品植旧，亞馬遜銷售的書籍病附，可在iTunes上下載的歌曲或沃爾瑪出售的藍(lán)光光盤完沪。
搜索引擎組件
鏈接和個(gè)人網(wǎng)頁是網(wǎng)絡(luò)搜索的主要元素覆积。
搜索引擎通過遵循從一個(gè)頁面到另一個(gè)頁面的網(wǎng)頁鏈接來查找網(wǎng)頁宽档。搜索引擎公司使用自動化流程來查找和跟蹤網(wǎng)站鏈接吗冤，并分析和索引網(wǎng)頁內(nèi)容以獲得專題相關(guān)性椎瘟。這些自動搜索程序統(tǒng)稱為網(wǎng)絡(luò)爬蟲肺蔚。
抓取工具只有在存在鏈接時(shí)才能找到您的網(wǎng)頁婆排，而搜索引擎不會對網(wǎng)站進(jìn)行排名 - 它們會對單個(gè)網(wǎng)頁的流行度和內(nèi)容相關(guān)性進(jìn)行排名。
搜索引擎爬蟲
搜索引擎抓取工具只能分析網(wǎng)頁上的文本腮猖，網(wǎng)頁鏈接和一些HTML標(biāo)記代碼澈缺，然后根據(jù)每頁上文字的統(tǒng)計(jì)分析來推斷網(wǎng)頁的性質(zhì)，質(zhì)量和主題相關(guān)性柠掂。
以下內(nèi)容對大多數(shù)搜索引擎不可見：
- 在圖形涯贞，標(biāo)題州疾，橫幅和公司徽標(biāo)內(nèi)顯示文本严蓖。
- Flash或gif動畫颗胡，視頻內(nèi)容和音頻內(nèi)容的內(nèi)容杭措。
- 幾乎沒有文字內(nèi)容和大量未標(biāo)記圖形的頁面手素。
- 較舊類型的使用基于圖形的“翻轉(zhuǎn)”或其他圖形鏈接或HTML圖像映射的網(wǎng)站導(dǎo)航泉懦。
- 依賴于JavaScript或其他動態(tài)代碼的導(dǎo)航鏈接（網(wǎng)絡(luò)爬蟲通常不會執(zhí)行JavaScript代碼）。
- 內(nèi)容功能邓嘹，如RSS提要和其他依賴于JavaScript的文本出現(xiàn)在頁面上汹押。
以下可能會導(dǎo)致搜索爬蟲繞過網(wǎng)頁：
- 具有非常復(fù)雜結(jié)構(gòu)的頁面：深層嵌套表格或異常復(fù)雜的HTML棚贾。
- 頁面頂部冗長的JavaScript或CSS代碼HTML代碼列表：搜尋器放棄了似乎不包含內(nèi)容的頁面妙痹。
- 包含許多斷開鏈接的網(wǎng)頁：抓取工具放棄或取消排名有許多斷開鏈接的網(wǎng)頁怯伊，并且無法按照斷開的鏈接查找新網(wǎng)頁震贵。
- 關(guān)鍵字垃圾內(nèi)容（在隱藏文本猩系，替代圖像文本或元標(biāo)記中多次重復(fù)關(guān)鍵字）的內(nèi)容：搜索引擎現(xiàn)在忽略了這些原始相關(guān)性偏置方案寇甸，并且如果您使用這些技術(shù)，甚至可能會禁止您的頁面進(jìn)入搜索索引绽淘。
- 具有特殊字符（＆沪铭，杀怠？橙依，％窗骑，$）的漫長而復(fù)雜的URL通常由動態(tài)編程或數(shù)據(jù)庫生成。在網(wǎng)站目錄中使用簡單的英語昔榴，如果您使用CMS來運(yùn)行您的網(wǎng)站碘橘，請始終選擇“友好”的網(wǎng)址互订。搜索引擎會查看網(wǎng)址，并使用他們在網(wǎng)址中找到的可識別詞匯來評估相關(guān)性痘拆。
- 通過低效的動態(tài)鏈接緩慢加載頁面到內(nèi)容管理系統(tǒng)或數(shù)據(jù)庫：如果頁面在幾秒鐘內(nèi)不加載仰禽，許多爬蟲就放棄并繼續(xù)前進(jìn)。使用Google的PageSpeed Insights（developers.google.com/speed/pagespeed/）等工具來檢查網(wǎng)頁的加載速度纺蛆。
- 使用框架或內(nèi)聯(lián)框架的頁面：搜尋器經(jīng)常忽略具有復(fù)雜框架方案的頁面吐葵，因?yàn)樗鼈儫o法理解構(gòu)成每個(gè)框架“頁面”的單個(gè)HTML文件。
- Web應(yīng)用程序和數(shù)據(jù)庫請求匯編的一些動態(tài)頁面; 請確保您的開發(fā)人員知道您希望如何在為動態(tài)網(wǎng)站選擇開發(fā)技術(shù)或內(nèi)容管理工具之前處理內(nèi)容的搜索可見性桥氏。這些應(yīng)用程序組裝頁面的URL通常充滿了編程亂碼凤藏。要求您的開發(fā)人員提供更易讀的英文網(wǎng)址蹄梢，以提高搜索引擎的可見度
搜索引擎排名
當(dāng)前的搜索引擎使用兩個(gè)信息源的組合來對網(wǎng)頁與任何給定搜索項(xiàng)的相關(guān)性進(jìn)行排名：
內(nèi)部因素：頁面中的文本和鏈接的特征 - 頁面標(biāo)題，內(nèi)容標(biāo)題桂塞，正文文本，圖像HTML標(biāo)簽中的替代文本，站點(diǎn)內(nèi)部和其他站點(diǎn)外部的Web鏈接以及頻率和分布熱門關(guān)鍵字晾捏。有組織的元信息，如關(guān)鍵字和描述HTML元標(biāo)簽也是頁面排名的因素呀伙，盡管不如頁面內(nèi)容中的頁面標(biāo)題麻汰，標(biāo)題和單詞重要岔擂。即使您的域名以及網(wǎng)頁網(wǎng)址中的文件和目錄名稱也可能會計(jì)入相關(guān)性排名，因此請盡可能使用純英文的文件名，網(wǎng)站目錄和網(wǎng)址。
外部因素：您的網(wǎng)頁與同一主題上現(xiàn)有排名較高的網(wǎng)頁關(guān)聯(lián)的程度，您的搜索結(jié)果中的網(wǎng)頁的用戶點(diǎn)擊您網(wǎng)頁的鏈接的頻率以及搜索引擎搜集的其他統(tǒng)計(jì)因素的頻率他們自己有關(guān)用戶執(zhí)行的搜索的數(shù)據(jù)以及他們?yōu)榻o定主題或關(guān)鍵字所做的鏈接選擇长捧。發(fā)送讀者到您網(wǎng)頁的流行頁面的鏈接基本上是您的網(wǎng)站與搜索主題相關(guān)的投票赵抢。來自其他高排名頁面的鏈接是決定排名的最重要因素之一其爵，但也是整體數(shù)量：您的網(wǎng)頁與其他網(wǎng)頁的鏈接越多，以及搜索引擎結(jié)果中點(diǎn)擊您的網(wǎng)頁鏈接的搜索用戶越多，您的整體頁面排名越高。
使用關(guān)鍵字和關(guān)鍵短語
一般考慮
獲得目標(biāo)關(guān)鍵字或短語列表后黍特，您需要查看現(xiàn)有網(wǎng)站的每個(gè)頁面旁涤，并查看每個(gè)元素如何支持您的關(guān)鍵字策略，或者需要重新編寫這些元素以包含關(guān)于內(nèi)容的最相關(guān)關(guān)鍵字頁：
網(wǎng)址：是的，搜索引擎會在網(wǎng)址中查找可識別的字詞蚊逢。盡可能在URL中使用關(guān)鍵字。
頁面標(biāo)題： HTML <title>元素是頁面SEO中最關(guān)鍵的元素季率。確保您的主要關(guān)鍵字出現(xiàn)在頁面標(biāo)題標(biāo)簽中史辙。頁面標(biāo)題也形成SERP上的鏈接文本甸陌。
說明： HTML元描述標(biāo)簽。此標(biāo)記在頁面上不可見臭蚁，但在頁面的HTML標(biāo)題代碼中私爷。元標(biāo)記對搜索引擎排名沒有多大貢獻(xiàn)侵佃，但是主頁上“description”元標(biāo)記的文本非常重要，因?yàn)橄馟oogle這樣的搜索引擎經(jīng)常會在SERP頁面標(biāo)題鏈接下方使用該文本。
標(biāo)題：您的第一個(gè)<h1>標(biāo)題應(yīng)位于內(nèi)容區(qū)域的頂部逞刷，并且必須包含您的主要關(guān)鍵字或短語。盡可能使用散文風(fēng)格允許的其他標(biāo)題中使用關(guān)鍵字溯街。
正文：您的關(guān)鍵字和短語也應(yīng)該出現(xiàn)在這里，但不要過分。搜索引擎將取消排名似乎比正常散文中使用的關(guān)鍵字重復(fù)次數(shù)更多的網(wǎng)頁。
圖像焚碌，嵌入式視頻：始終使用鏈接代碼的替代和標(biāo)題屬性來提供圖片或視頻內(nèi)容的準(zhǔn)確描述。切勿使用無關(guān)或重復(fù)的關(guān)鍵字加載這些標(biāo)簽畏线。
其他網(wǎng)絡(luò)鏈接上的標(biāo)題標(biāo)簽：大多數(shù)網(wǎng)絡(luò)創(chuàng)作程序（如Dreamweaver或CMS程序）都會提示您為圖像提供替代描述性文本（“替代文本”）或鏈接“標(biāo)題”標(biāo)簽的描述性文本。使用準(zhǔn)確描述鏈接材料的語言。不要懶惰鬓照，對于許多鏈接或圖像使用相同的標(biāo)題文本押蚤，因?yàn)樗阉饕鎸吹较嗤亩陶Z重復(fù)多次并且可能會降低您的頁面排名時(shí)非常謹(jǐn)慎供汛。
Google和適合移動設(shè)備的網(wǎng)站
鏈接
選擇網(wǎng)頁上的文本并將該文本鏈接到其他相關(guān)網(wǎng)頁是一個(gè)強(qiáng)大的語義聲明：它確定鏈接的文本與頁面上的內(nèi)容非常重要并且高度相關(guān)赫编，從而將該頁面與其他相關(guān)內(nèi)容相關(guān)聯(lián)。在典型的網(wǎng)頁上有兩種基本類型的鏈接：
導(dǎo)航鏈接：通常位于頁面的頁眉或側(cè)欄中奋隶，并在網(wǎng)站的大多數(shù)頁面上重復(fù)擂送。
上下文鏈接：將頁面與相關(guān)內(nèi)容綁定在一起的鏈接。
網(wǎng)絡(luò)爬蟲使用導(dǎo)航鏈接作為評估您的網(wǎng)站和主要內(nèi)容主題的一般結(jié)構(gòu)的手段唯欣。當(dāng)抓取工具點(diǎn)擊鏈接時(shí)嘹吨，它會查看鏈接文本中的關(guān)鍵字相關(guān)性，但它也會評估鏈接指向相關(guān)性的頁面境氢。理想情況下蟀拷，兩個(gè)網(wǎng)頁應(yīng)共享相似的關(guān)鍵字，因?yàn)檫@會加強(qiáng)相關(guān)性排名萍聊，特別是如果您指向Google或Bing對于類似關(guān)鍵字排名較高的網(wǎng)頁的鏈接问芬。這樣的鏈接本質(zhì)上是搜索爬蟲的一個(gè)信號，表明您的內(nèi)容與您的頁面標(biāo)題寿桨，標(biāo)題和其他頁面元素中的關(guān)鍵字完美匹配此衅。這也表明，您應(yīng)該避免鏈接到網(wǎng)站之外的頁面亭螟，這些頁面只與頁面內(nèi)容有關(guān)挡鞍。
事實(shí)上，您已選擇并鏈接到搜索爬行器的單詞或短語信號预烙，表明鏈接的文本很重要墨微。這就是為什么避免在頁面鏈接中使用“點(diǎn)擊這里”或“鏈接”等無用信息的關(guān)鍵”獾В“單擊此處”不會通知您的讀者或搜索爬蟲有關(guān)頁面內(nèi)容或您指向的內(nèi)容翘县。請始終在鏈接文本中使用描述性關(guān)鍵字和短語最域，并使用鏈接標(biāo)題屬性進(jìn)一步告知讀者該鏈接將帶給她的位置。
架構(gòu)
網(wǎng)絡(luò)搜索引擎非常擅長查找和解釋地址等信息炼蹦，但是可以通過向網(wǎng)頁添加額外標(biāo)記信息的方式使搜索引擎更輕松地解釋您的關(guān)鍵業(yè)務(wù)信息羡宙。
本地搜索
對于“實(shí)體”本地企業(yè)而言，搜索引擎優(yōu)化歸結(jié)為四個(gè)主要因素：相關(guān)性掐隐，距離狗热，聲譽(yù)和移動搜索。
相關(guān)性：您的網(wǎng)站是否圍繞您的服務(wù)和產(chǎn)品組織得很好虑省，并涵蓋了所有可能的搜索關(guān)鍵字和短語匿刮？理想情況下，您應(yīng)該為每個(gè)提供的主要服務(wù)或產(chǎn)品設(shè)定一個(gè)優(yōu)化頁面探颈，并使用我們上面介紹的頁面SEO技術(shù)熟丸。
距離：您的企業(yè)所服務(wù)的地理區(qū)域，以及您的主頁上突出顯示的位置和覆蓋范圍信息以及產(chǎn)品頁面的主要服務(wù)伪节？搜索引擎使用這些基本的午睡信息來確定您與您所在城市或地區(qū)的客戶的相關(guān)程度光羞。將您的午睡聯(lián)系信息突出顯示在您的網(wǎng)站的主頁和每頁的頁腳上，并經(jīng)常在您的頁面內(nèi)容中引用您的報(bào)道區(qū)域怀大。仔細(xì)考慮客戶可能使用哪些地理關(guān)鍵詞纱兑，以及它們可能具體如何（例如，紐約市化借，布魯克林區(qū)潜慎，Bay Ridge，第四大道和第86街）蓖康。
聲譽(yù)：您的業(yè)??務(wù)在當(dāng)?shù)厝绾瓮怀鲱盱牛繉Ρ镜匦侣劸W(wǎng)站，博客蒜焊，客戶評論網(wǎng)站（如Yelp和FourSquare）或社交媒體網(wǎng)站（如Facebook）有沒有積極的參考倒信？您的企業(yè)在其他網(wǎng)站上被正面提及的頻率越高，它在搜索結(jié)果中排名越高山涡。定期搜索對您業(yè)務(wù)的參考堤结，密切關(guān)注您的Yelp和其他評論網(wǎng)站，并快速回復(fù)并回復(fù)任何負(fù)面評論鸭丛。
移動搜索越來越引人注目：大多數(shù)網(wǎng)絡(luò)搜索現(xiàn)在都在移動設(shè)備（智能手機(jī)和平板電腦）上完成。您的企業(yè)網(wǎng)站如何適合移動設(shè)備唐责？許多小型本地企業(yè)都有使用舊版網(wǎng)絡(luò)技術(shù)構(gòu)建的網(wǎng)站鳞溉，并且維護(hù)得不好并且保持最新。今天鼠哥，將您的網(wǎng)站轉(zhuǎn)移到適合移動設(shè)備的模板非常重要熟菲，因?yàn)槿绻蛻粼谛∈謾C(jī)屏幕上看起來太難以使用看政，它們會很快離開您的網(wǎng)站。
代碼優(yōu)化
- Google網(wǎng)站管理員工具：www.google.com/webmasters/tools
- Bing網(wǎng)站管理員工具：www.bing.com/toolbox/webmaster
W3C的HTML代碼驗(yàn)證程序
- W3C標(biāo)記驗(yàn)證服務(wù)：validator.w3.org
服務(wù)器優(yōu)化
大多數(shù)CMS程序通過在每次從Web服務(wù)器發(fā)出對頁面的請求時(shí)動態(tài)組裝頁面來創(chuàng)建頁面抄罕。所有的程序集都需要花費(fèi)時(shí)間和服務(wù)器周期允蚣，并且如果你的服務(wù)器不能完成任務(wù)，你的頁面加載速度會很慢呆贿。
許多基于CMS的站點(diǎn)使用服務(wù)器緩存來幫助減少CMS上的負(fù)載嚷兔。每次從服務(wù)器請求頁面時(shí)，服務(wù)器都會將組合頁面的副本保留在內(nèi)存緩存中做入，并且如果再次請求頁面冒晰，服務(wù)器將發(fā)送緩存版本，從而減少CMS本身的負(fù)載竟块。這種熱門頁面的緩存可以大大增加像主頁這樣的高流量頁面的明顯加載速度壶运。大多數(shù)高速緩存軟件都有發(fā)送高速緩存頁面的時(shí)間限制 - 通常為幾分鐘，有時(shí)甚至更長浪秘。時(shí)間限制到期后蒋情，服務(wù)器將檢索所請求頁面的新版本，并將更新版本放入緩存中耸携。這種方式積極改變的頁面將永遠(yuǎn)不會超過幾分鐘過時(shí)棵癣。
提交網(wǎng)站索引
對于新網(wǎng)站來說，讓您的網(wǎng)站在主要搜索引擎中列出的最佳方式是通過其他現(xiàn)有網(wǎng)站的鏈接违帆，通過新聞發(fā)布浙巫，聯(lián)系本地商業(yè)目錄網(wǎng)站或通過詢問其他相關(guān)網(wǎng)站但非競爭性組織如果他們可能會在新聞簡報(bào)中列出您的新網(wǎng)站，或與其他“資源”或“相關(guān)網(wǎng)站”一起列出刷后。最大的搜索引擎提供的頁面允許您提交新網(wǎng)站的網(wǎng)址的畴，但在那里不能保證搜索抓取工具能夠立即找到您的網(wǎng)站。網(wǎng)絡(luò)搜索爬蟲可能需要幾周或更長時(shí)間才能訪問您的新網(wǎng)站并將其首次編入索引尝胆，但通常這一過程只需一兩天丧裁。
網(wǎng)站地圖
網(wǎng)站地圖頁面：大多數(shù)網(wǎng)站地圖都是普通的網(wǎng)頁，其中包含指向您網(wǎng)站主要元素的鏈接列表含衔。這些網(wǎng)站主要頁面的主列表是搜索引擎抓取工具的絕佳資源煎娇，站點(diǎn)地圖頁面提供了一種很好的方式來確保您的站點(diǎn)的每個(gè)重要頁面都以搜索抓取工具和用戶可以輕松找到的方式進(jìn)行鏈接。站點(diǎn)地圖或“索引”頁面是網(wǎng)站的常見元素贪染，喜歡瀏覽鏈接列表的用戶知道要在組織良好的站點(diǎn)中查找站點(diǎn)地圖或索引頁面缓呛。在網(wǎng)絡(luò)的早期階段，您會看到網(wǎng)站地圖杭隙，這些網(wǎng)站地圖以網(wǎng)站的圖表或視覺地圖的形式進(jìn)行了布置哟绊，但圖形網(wǎng)站“地圖”隱喻大部分已經(jīng)淡出，贊成更加高效和可搜索的列表鏈接痰憎。
搜索引擎的XML站點(diǎn)地圖：第二種常見類型的“站點(diǎn)地圖”是XML格式的文本文件票髓，位于您主頁的級別攀涵，并通知網(wǎng)絡(luò)搜索爬蟲有關(guān)您網(wǎng)站中的主要頁面，如何查找頁面以及頁面可能更新的頻率（每日洽沟，每周以故，每月）。這些基于XML的網(wǎng)站地圖對您的網(wǎng)站用戶不可見裆操，但它們提供了一種將網(wǎng)站結(jié)構(gòu)傳達(dá)給Google和Bing等搜索引擎的有效方式怒详。有關(guān)如何構(gòu)建XML站點(diǎn)地圖文件的詳細(xì)信息，請參閱sitemaps.org站點(diǎn)跷车。
