HTML基礎(chǔ)

開始

上周我已經(jīng)學(xué)習(xí)了一些開發(fā)工具（Sublim Text兼吓、vscode），我學(xué)會了如何一些基礎(chǔ)設(shè)置和如何新建文件并且能夠保存預(yù)覽（chrome笛质、firefox），經(jīng)過這幾天對HTML基礎(chǔ)的聯(lián)系，也更加熟練胰丁。那么接下來我開始對網(wǎng)頁開發(fā)進(jìn)行再深入的學(xué)習(xí)。為了入門前端喂分，我的第一步計劃就是先學(xué)習(xí)HTML锦庸、CSS、JavaScript蒲祈、jquery甘萧。

1.1 電腦配置

主機部分

1、CPU：中央處理器梆掸，計算機的運算核心和控制核心扬卷。主要功能是解釋計算機指令以及處理計算機軟件中的數(shù)據(jù)。

2酸钦、顯卡：顯示適配器怪得，主要功能是電腦進(jìn)行數(shù)模信號轉(zhuǎn)換的設(shè)備，承擔(dān)輸出顯示圖形的任務(wù)卑硫。

3徒恋、內(nèi)存：內(nèi)存儲器，主要作用是用于暫時存放CPU中的運算數(shù)據(jù)欢伏，以及與硬盤等外部存儲器交換的數(shù)據(jù)入挣。

4、硬盤：有固態(tài)硬盤（SSD 盤硝拧，新式硬盤）径筏、機械硬盤（HDD 傳統(tǒng)硬盤）葛假、混合硬盤，計算機的所有文件均存儲到此匠璧。

5桐款、主板：計算機的各部件安插在主板上協(xié)同工作。

6夷恍、電源：給各部件供電魔眨。

7、機箱：用于保護機箱內(nèi)部的所有部件酿雪。 外設(shè)部分： 1遏暴、顯示器：用于顯示電腦的圖像。 2指黎、鍵盤鼠標(biāo)：用于操作電腦朋凉。 4、音響：用于輸出聲音醋安。 5杂彭、攝像頭：用于攝像、視頻聊天吓揪、拍照等亲怠。 6、話筒：用于輸入聲音柠辞、語音聊天等团秽。

電腦操作系統(tǒng)

Windows
Windows采用了圖形化模式GUI，比起從前的DOS需要鍵入指令使用的方式更為人性化叭首。隨著電腦硬件和軟件的不斷升級习勤，微軟的Windows也在不斷升級，從架構(gòu)的16位焙格、32位再到64位图毕， 系統(tǒng)版本從最初的Windows 1.0 到大家熟知的Windows 95、Windows 98间螟、Windows ME吴旋、Windows 2000、Windows 2003厢破、Windows XP荣瑟、Windows Vista、Windows 7摩泪、Windows 8笆焰、Windows 8.1、Windows 10 和Windows Server服務(wù)器企業(yè)級操作系統(tǒng)见坑，不斷持續(xù)更新嚷掠，微軟一直在致力于Windows操作系統(tǒng)的開發(fā)和完善捏检。
UNIX和LINUX系統(tǒng)
UNIX操作系統(tǒng)（尤尼斯），是一個強大的多用戶不皆、多任務(wù)操作系統(tǒng)贯城，支持多種處理器架構(gòu)，按照操作系統(tǒng)的分類霹娄，屬于分時操作系統(tǒng)能犯，最早由KenThompson、Dennis Ritchie和Douglas McIlroy于1969年在AT&T的貝爾實驗室開發(fā)犬耻。目前它的商標(biāo)權(quán)由國際開放標(biāo)準(zhǔn)組織所擁有踩晶，只有符合單一UNIX規(guī)范的UNIX系統(tǒng)才能使用UNIX這個名稱，否則只能稱為類UNIX（UNIX-like）枕磁。
Linux是一套免費使用和自由傳播的類Unix操作系統(tǒng)渡蜻，是一個基于POSIX和UNIX的多用戶、多任務(wù)计济、支持多線程和多CPU的操作系統(tǒng)茸苇。它能運行主要的UNIX工具軟件、應(yīng)用程序和網(wǎng)絡(luò)協(xié)議沦寂。它支持32位和64位硬件税弃。Linux繼承了Unix以網(wǎng)絡(luò)為核心的設(shè)計思想，是一個性能穩(wěn)定的多用戶網(wǎng)絡(luò)操作系統(tǒng)凑队。
MAC的系統(tǒng)
Mac使用獨立的[Mac OS](https://baike.baidu.com/item/Mac OS)系統(tǒng)，最新的OS X系列基于NeXT系統(tǒng)開發(fā)幔翰，不支持兼容漩氨。是一套完備而獨立的操作系統(tǒng)。OS X操作系統(tǒng)界面非常獨特遗增，突出了形象的圖標(biāo)和人機對話(圖形化的人機對話界面最初來自施樂公司的Palo Alto研究中心叫惊，蘋果借鑒了其成果開發(fā)了自己的圖形化界面，后來又被微軟的Windows所借鑒并在Windows中廣泛應(yīng)用)做修。[Mac OS](https://baike.baidu.com/item/Mac OS)系統(tǒng)集合了Windows系統(tǒng)和Unix系統(tǒng)的特點霍狰。

1.2 Github與Coding的區(qū)別

1、Coding是中文饰及，主打團隊蔗坯，項目協(xié)作，私有庫免費燎含。
2宾濒、Github是英文，主打開源屏箍，公開項目免費绘梦，缺點是得交錢才能開私有庫橘忱。

1.3 前端開發(fā)流行的框架Vue、angular卸奉、React優(yōu)缺點

1钝诚、Vue.js
1.1 優(yōu)點：
（1）簡單易學(xué)，比Anaular容易學(xué)榄棵。
（2） 快速：異步批處理方式更新 DOM凝颇。
（3） 組合：用解耦的、可復(fù)用的組件組合你的應(yīng)用程序秉继。
（4） 對模塊友好：可以通過 NPM祈噪、Bower 或 Duo 安裝，不強迫你所有的代碼都遵循 Angular 的各種規(guī)定尚辑，使用場景更加靈活辑鲤。
1.2缺點：
（1）Vue.js是一個新的項目，沒有angular那么成熟杠茬。
（2）不支持IE8月褥。
2、angularJS
2.1 優(yōu)點：
（1）模板功能強大豐富瓢喉，自帶了極其豐富的angular指令宁赤。
（2） 是一個比較完善的前端框架，包含服務(wù)栓票，模板决左，數(shù)據(jù)雙向綁定，模塊化走贪，路由佛猛，過濾器，依賴注入等所有功能坠狡；
（3） 自定義指令继找，自定義指令后可以在項目中多次使用。
2.2 缺點：
（1）angular 入門很容易 但深入后概念很多, 學(xué)習(xí)中較難理解逃沿。
（2）文檔例子非常少, 官方的文檔基本只寫了api
（3）對IE6/7 兼容不算特別好
3婴渡、React
3.1 優(yōu)點：
（1）速度快：在UI渲染過程中，React通過在虛擬DOM中的微操作來實現(xiàn)對實際DOM的局部更新
（2）跨瀏覽器兼容：虛擬DOM幫助我們解決了跨瀏覽器問題凯亮，它為我們提供了標(biāo)準(zhǔn)化的API边臼，甚至在IE8中都是沒問題的。
（3）模塊化：為你程序編寫?yīng)毩⒌哪K化UI組件触幼，這樣當(dāng)某個或某些組件出現(xiàn)問題是硼瓣，可以方便地進(jìn)行隔離。
（4）單向數(shù)據(jù)流：Flux是一個用于在JavaScript應(yīng)用中創(chuàng)建單向數(shù)據(jù)層的架構(gòu)，它隨著React視圖庫的開發(fā)而被Facebook概念化
（5）同構(gòu)堂鲤、純粹的javascript：因為搜索引擎的爬蟲程序依賴的是服務(wù)端響應(yīng)而不是JavaScript的執(zhí)行亿傅，預(yù)渲染你的應(yīng)用有助于搜索引擎優(yōu)化。
（6）兼容性好：比如使用RequireJS來加載和打包瘟栖，而Browserify和Webpack適用于構(gòu)建大型應(yīng)用葵擎。它們使得那些艱難的任務(wù)不再讓人望而生畏。
3.2 缺點：
（1）React本身只是一個V而已半哟，并不是一個完整的框架酬滤，所以如果是大型項目想要一套完整的框架的話，基本都需要加上ReactRouter和Flux才能寫大型應(yīng)用寓涨。

1.4 后端語言node,php,java的優(yōu)缺點

1盯串、Node.js
1.1 優(yōu)點：
（1）采用事件驅(qū)動、異步編程戒良，為網(wǎng)絡(luò)服務(wù)而設(shè)計体捏。
（2）Node.js非阻塞模式的IO處理給Node.js帶來在相對低系統(tǒng)資源耗用下的高性能與出眾的負(fù)載能力，非常適合用作依賴其它IO資源的中間層服務(wù)糯崎。
（3）Node.js輕量高效几缭。
1.2 缺點：
（1）可靠性低
（2）單進(jìn)程，單線程沃呢，只支持單核CPU年栓，不能充分的利用多核CPU服務(wù)器。一旦這個進(jìn)程崩掉薄霜，那么整個web服務(wù)就崩掉了某抓。
2、PHP
2.1 優(yōu)點：
（1）開源惰瓜、免費性搪缨，程序開發(fā)快，運行快鸵熟，技術(shù)本身學(xué)習(xí)快。
（2）跨平臺性強负甸，效率高流强。
2.2 缺點：
（1）單線程。
（2）只支持web開發(fā)呻待，不方便做 .exe文件,不方便做桌面應(yīng)用程序. 不方便做手機程序打月。
（3）不適合做爬蟲、自動運行腳本蚕捉。
3奏篙、Java
3.1 優(yōu)點：
（1）跨平臺、穩(wěn)定。
（2）一次編寫秘通，到處運行
（3）系統(tǒng)的多平臺支持
3.2 缺點：
（1）需要JAVA虛擬機为严，運行環(huán)境。

1.5 HTML概述

HTML肺稀，超文本標(biāo)記語言第股，超文本就意味著有多于文字的形式，比如包含超鏈接话原、圖片夕吻、視頻、動畫等形式繁仁。HTML是應(yīng)用在網(wǎng)站網(wǎng)頁展現(xiàn)的一種語法結(jié)構(gòu)涉馅。我們在使用瀏覽器瀏覽網(wǎng)頁的時候，看到的界面都是由HTML代碼表現(xiàn)出來的黄虱。HMTL可以說是一種展示文字圖片視頻等元素的一種方式稚矿。通過特定的標(biāo)記就能展示出來自己想要的效果。怎么樣展現(xiàn)效果悬钳？讓我們一起一步一步探索盐捷。

1.6 HTML標(biāo)記語言的特點

HTML是解釋性語言，不需要編譯默勾，直接在編輯器上編寫碉渡，就可以運行。
HTML純文本類型語言母剥，可以直接通過記事本編寫滞诺。（不推薦，最好使用編輯器）
HTML具有平臺無關(guān)性环疼，任何平臺任何一款瀏覽器习霹，都可以打開HTML網(wǎng)頁。
HTML代碼在瀏覽器中運行炫隶，就是需要使用瀏覽器進(jìn)行測試運行
HTML中有很多的標(biāo)簽淋叶，也有很多不同的功能，接下來就一起看看下面幾個標(biāo)簽?zāi)軐崿F(xiàn)什么效果伪阶？

1.7 HTML<!DOCTYPE>標(biāo)簽 (HTML5 <!DOCTYPE html>)

實例:

      <!DOCTYPE html>
      <html>
      <head>
           <title>文檔的標(biāo)題</title>
      </head>
       <body>
            文檔的內(nèi)容......
       </body>
     </html>                  

定義和用法
<!DOCTYPE> 聲明必須是 HTML 文檔的第一行煞檩，位于 <html> 標(biāo)簽之前。
<!DOCTYPE> 聲明不是 HTML 標(biāo)簽栅贴；它是指示 web 瀏覽器關(guān)于頁面使用哪個 HTML 版本進(jìn)行編寫的指令斟湃。
在 HTML 4.01 中，<!DOCTYPE> 聲明引用 DTD檐薯，因為 HTML 4.01 基于 SGML凝赛。DTD 規(guī)定了標(biāo)記語言的規(guī)則，這樣瀏覽器才能正確地呈現(xiàn)內(nèi)容。
HTML5 不基于 SGML墓猎，所以不需要引用 DTD捆昏。

1.8 HTML<style>標(biāo)簽

實例:

<html>
<head>
<style type="text/css">
h1 {color:red}
p {color:blue}</style>
</head>
<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>

定義和用法

<style> 標(biāo)簽用于為 HTML 文檔定義樣式信息。
在 style 中陶衅，您可以規(guī)定在瀏覽器中如何呈現(xiàn) HTML 文檔屡立。
type 屬性是必需的，定義 style 元素的內(nèi)容搀军。唯一可能的值是 "text/css"膨俐。
style 元素位于 head 部分中。

擴展補充：有三種CSS的樣式需要我們注意罩句。

CSS樣式分為：內(nèi)聯(lián)式css樣式焚刺、嵌入式css樣式、外部式css樣式门烂。
對CSS三種樣式定義及其實例：
1.內(nèi)聯(lián)式css樣式乳愉。
內(nèi)聯(lián)式css樣式表就是把css代碼直接寫在現(xiàn)有的HTML標(biāo)簽中，如下面代碼：

<p style="color:red">這里文字是紅色屯远。</p>

css樣式代碼要寫在style=""雙引號中蔓姚，如果有多條css樣式代碼設(shè)置可以寫在一起，中間用分號隔開（英文狀態(tài)下;）慨丐。
2.嵌入式css樣式坡脐。
嵌入式css樣式，就是可以把css樣式代碼寫在標(biāo)簽之間房揭。如下面代碼實現(xiàn)把三個標(biāo)簽中的文字設(shè)置為紅色：

<style type="text/css">span{color:red;}</style>

嵌入式css樣式必須寫在之間备闲，并且一般情況下嵌入式css樣式寫在之間。
3.外部式css樣式捅暴。
外部式css樣式(也可稱為外聯(lián)式)就是把css代碼寫一個單獨的外部文件中恬砂，這個css樣式文件以“.css”為擴展名（也可以為調(diào)用其他網(wǎng)站CSS）。

<link href="style.css" rel="stylesheet" type="text/css" />

4.注意事項：①css樣式文件名稱以有意義的英文字母命名蓬痒，如 main.css泻骤。 ②rel=”stylesheet” type=”text/css” 是固定寫法不可修改。 ③標(biāo)簽位置一般寫在標(biāo)簽之內(nèi)梧奢。

1.9 HTML <link> 標(biāo)簽

實例：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>

定義和用法

<link> 標(biāo)簽定義文檔與外部資源的關(guān)系瞪讼。
<link> 標(biāo)簽最常見的用途是鏈接樣式表。

2.1 HTML語義化

學(xué)習(xí)這些HTML標(biāo)簽粹断，我們應(yīng)考慮如何讓HTML標(biāo)簽語義化。什么是語義化嫡霞？
首先請注意瓶埋，下面只是我個人的簡單理解：其實簡單說來語義化就是讓機器可以讀懂內(nèi)容。就比如一臺機器人想要聽懂人類說的話，我們會有兩個方法养筒。第一個是讓機器人本身能夠提高讀取人類語言的能力曾撤；第二個是讓人類改變對機器人說的話，變得簡單易懂一點晕粪。那兩個方法比較起來肯定是第二種方法最簡單挤悉。那么HTML語義化就是這個道理，HTML語言能改變的讓計算機更加容易讀懂巫湘。
想要更加專業(yè)的了解這個問題装悲，可以看看大牛們專業(yè)的解釋：
https://www.zhihu.com/question/20455165

2.2 HTML<b>標(biāo)簽和<strong>標(biāo)簽的區(qū)別

在HTML4.01中:

<b>是視覺要素,表示無意義的加粗，表現(xiàn)樣式為 { font-weight: bolder }尚氛，僅僅表示「這里應(yīng)該用粗體顯示」诀诊。

<strong>是表達(dá)要素,表示強調(diào)文本。

在HTML5中：

< strong > 表示html頁面上的強調(diào)阅嘶。

<b>表示在普通文章中僅從文體上突出的不包含任何額外的重要性的一段文本属瓣。例如：文檔概要中的關(guān)鍵字，評論中的產(chǎn)品名讯柔。

2.3 HTML<iframe>標(biāo)簽

定義和用法

iframe 元素會創(chuàng)建包含另外一個文檔的內(nèi)聯(lián)框架（即行內(nèi)框架）抡蛙。

提示：您可以把需要的文本放置在 <iframe> 和 </iframe> 之間，這樣就可以應(yīng)對無法理解 iframe 的瀏覽器魂迄。

實例:

   <!doctype html>

   <html>

   <head>

          <meta charset="UTF-8">

          <title>test-html</title>

          <style type="text/css">

                /*.a{text-align:left;}*/

          </style>

   </head>

   <body>

          <iframe src="[http://baidu.com](http://baidu.com)" width="100%" height="500" frameborder="0">   </iframe>                                          

    <script>

     document.write("Hello World!")

  </script>

   </body>

   </html>

2.4 HTML<form>標(biāo)簽

定義和用法

<form> 標(biāo)簽用于為用戶輸入創(chuàng)建 HTML 表單粗截。

表單能夠包含 input 元素，比如文本字段极祸、復(fù)選框慈格、單選框、提交按鈕等等遥金。

表單還可以包含 menus浴捆、textarea、fieldset稿械、legend 和label 元素选泻。

表單用于向服務(wù)器傳輸數(shù)據(jù)。

提示和注釋

注釋：form 元素是塊級元素美莫，其前后會產(chǎn)生折行页眯。

實例：

 <!DOCTYPE html>

 <html>

  <body>

           <form action="/demo/demo_form.asp">

                First name:<br>

                   <input type="text" name="firstname" value="Mickey">

                   <br>

                    Last name:<br>

               <input type="text" name="lastname" value="Mouse">

                      <br><br>

                           <input type="submit" value="Submit">

                    </form>

      <p>如果您點擊提交，表單數(shù)據(jù)會被發(fā)送到名為 demo_form.asp 的頁面厢呵。</p>

 </body>

 </html>

2.5 HTML<script>標(biāo)簽

實例:
在 HTML 頁面中插入一段 JavaScript:

<script type="text/javascript">
document.write("Hello World!")

</script>

定義和用法
<script> 標(biāo)簽用于定義客戶端腳本窝撵，比如 JavaScript。
script 元素既可以包含腳本語句襟铭，也可以通過 src 屬性指向外部腳本文件碌奉。
必需的 type 屬性規(guī)定腳本的 MIME 類型短曾。
JavaScript 的常見應(yīng)用時圖像操作、表單驗證以及動態(tài)內(nèi)容更新赐劣。
提示和注釋：
注釋：假如此元素內(nèi)部的代碼沒有位于某個函數(shù)中嫉拐，那么這些代碼會在頁面被加載時被立即執(zhí)行。<frameset> 標(biāo)簽之后的腳本會被忽略魁兼。

2.6 HTML <frameset> 標(biāo)簽

實例:
簡單的三框架頁面：

<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
<frame src="frame_c.htm" /></frameset>
</html>

定義和用法
frameset 元素可定義一個框架集婉徘。它被用來組織多個窗口（框架）。每個框架存有獨立的文檔咐汞。在其最簡單的應(yīng)用中盖呼，frameset 元素僅僅會規(guī)定在框架集中存在多少列或多少行。您必須使用 cols 或 rows 屬性碉考。
提示和注釋：
注釋：如果您希望驗證某個包含框架的頁面塌计，請確保 DTD 被設(shè)置為 "Frameset DTD"。
重要事項：您不能與 <frameset></frameset> 標(biāo)簽一起使用 <body></body> 標(biāo)簽侯谁。不過锌仅，如果您需要為不支持框架的瀏覽器添加一個 <noframes> 標(biāo)簽，請務(wù)必將此標(biāo)簽放置在 <body></body> 標(biāo)簽中墙贱！

2.7 HTML 注釋

注釋標(biāo)簽 用于在 HTML 插入注釋
HTML 注釋標(biāo)簽
您能夠通過如下語法向 HTML 源代碼添加注釋：
實例

image.png

注釋：在開始標(biāo)簽中有一個驚嘆號热芹，但是結(jié)束標(biāo)簽中沒有。
瀏覽器不會顯示注釋惨撇，但是能夠幫助記錄您的 HTML 文檔伊脓。
您可以利用注釋在 HTML 中放置通知和提醒信息。
注釋對于 HTML 糾錯也大有幫助魁衙，因為您可以一次注釋一行 HTML 代碼报腔，以搜索錯誤：
實例

image.png

條件注釋
您也許會在 HTML 中偶爾發(fā)現(xiàn)條件注釋：

image.png

條件注釋定義只有 Internet Explorer 執(zhí)行的 HTML 標(biāo)簽。
軟件程序標(biāo)簽
各種 HTML 軟件程序也能夠生成 HTML 注釋剖淀。
例如 標(biāo)簽會被包圍在由 FrontPage 和 Expression Web 創(chuàng)建的 HTML 注釋中纯蛾。
作為一項規(guī)則，這些標(biāo)簽的存在纵隔，有助于對創(chuàng)建這些標(biāo)簽的軟件的支持翻诉。

2.8 HTML <code> 標(biāo)簽

定義和用法

<code> 標(biāo)簽用于表示計算機源代碼或者其他機器可以閱讀的文本內(nèi)容。

軟件代碼的編寫者已經(jīng)習(xí)慣了編寫源代碼時文本表示的特殊樣式捌刮。<code> 標(biāo)簽就是為他們設(shè)計的碰煌。包含在該標(biāo)簽內(nèi)的文本將用等寬、類似電傳打字機樣式的字體（Courier）顯示出來绅作，對于大多數(shù)程序員和 W3School 的用戶來說芦圾，這應(yīng)該是十分熟悉的。

只應(yīng)該在表示計算機程序源代碼或者其他機器可以閱讀的文本內(nèi)容上使用 <code> 標(biāo)簽俄认。雖然 <code> 標(biāo)簽通常只是把文本變成等寬字體个少，但它暗示著這段文本是源程序代碼碍脏。將來的瀏覽器有可能會加入其他顯示效果。例如稍算，程序員的瀏覽器可能會尋找 <code> 片段，并執(zhí)行某些額外的文本格式化處理役拴，如循環(huán)和條件判斷語句的特殊縮進(jìn)等糊探。

提示和注釋

提示：如果只是希望使用等寬字體的效果，請使用 <tt> 標(biāo)簽河闰】破剑或者，如果想要在嚴(yán)格限制為等寬字體格式的文本中顯示編程代碼姜性，請使用 <pre> 標(biāo)簽瞪慧。

2.9 HTML <ul> 標(biāo)簽

實例
無序 HTML 列表：

<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>

定義和用法
<ul> 標(biāo)簽定義無序列表。

3.1 HTML <ol> 標(biāo)簽

實例
有序 HTML 列表：

<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>

定義和用法
<ol> 標(biāo)簽定義有序列表部念。

3.2 郵件的樣式：

1.郵件使用table+css布局

2.郵件主要部分在body內(nèi)部弃酌，所以樣式一定要寫成內(nèi)嵌的，不能在head標(biāo)簽中寫style儡炼，也不能外聯(lián)妓湘。

3.3 什么是SEO？SEO有什么注意點乌询？怎么做SEO榜贴？

SEO（Search Engine Optimization）:漢譯為搜索引擎優(yōu)化。搜索引擎優(yōu)化是一種利用搜索引擎的搜索規(guī)則來提高目前網(wǎng)站在有關(guān)搜索引擎內(nèi)的自然排名的方式妹田。

SEO優(yōu)化步驟：
1唬党、 關(guān)鍵詞分析（也叫關(guān)鍵詞定位） 這是進(jìn)行SEO優(yōu)化最重要的一環(huán)，關(guān)鍵詞分析包括：關(guān)鍵詞關(guān)注量分析鬼佣、競爭對手分析驶拱、關(guān)鍵詞與網(wǎng)站相關(guān)性分析、關(guān)鍵詞布置沮趣、關(guān)鍵詞排名預(yù)測屯烦。
2、 網(wǎng)站架構(gòu)分析 網(wǎng)站結(jié)構(gòu)符合搜索引擎的爬蟲喜好則有利于SEO優(yōu)化房铭。網(wǎng)站架構(gòu)分析包括：剔除網(wǎng)站架構(gòu)不良設(shè)計驻龟、實現(xiàn)樹狀目錄結(jié)構(gòu)、網(wǎng)站導(dǎo)航與鏈接優(yōu)化缸匪。
3翁狐、 網(wǎng)站目錄和頁面優(yōu)化 SEO不止是讓網(wǎng)站首頁在搜索引擎有好的排名，更重要的是讓網(wǎng)站的每個頁面都帶來流量凌蔬。
4露懒、內(nèi)容發(fā)布和鏈接布置 搜索引擎喜歡有規(guī)律的網(wǎng)站內(nèi)容更新闯冷，所以合理安排網(wǎng)站內(nèi)容發(fā)布日程是SEO優(yōu)化的重要技巧之一。鏈接布置則把整個網(wǎng)站有機地串聯(lián)起來懈词，讓搜索引擎明白每個網(wǎng)頁的重要性和關(guān)鍵詞蛇耀，實施的參考是第一點的關(guān)鍵詞布置。友情鏈接戰(zhàn)役也是這個時候展開坎弯。
5纺涤、與搜索引擎對話 向各大搜索引擎登陸入口提交尚未收錄站點。在搜索引擎看SEO的效果抠忘，通過site:你的域名撩炊，知道站點的收錄和更新情況。通過domain:你的域名或者link:你的域名崎脉，知道站點的反向鏈接情況拧咳。更好的實現(xiàn)與搜索引擎對話，建議采用Google網(wǎng)站管理員工具囚灼。
6骆膝、建立網(wǎng)站地圖SiteMap 根據(jù)自己的網(wǎng)站結(jié)構(gòu)，制作網(wǎng)站地圖啦撮，讓你的網(wǎng)站對搜索引擎更加友好化谭网。讓搜索引擎能過SiteMap就可以訪問整個站點上的所有網(wǎng)頁和欄目。
7赃春、高質(zhì)量的友情鏈接 建立高質(zhì)量的友情鏈接愉择，對于SEO優(yōu)化來說，可以提高網(wǎng)站PR值以及網(wǎng)站的更新率织中，都是非常關(guān)鍵性的問題估脆。
8相寇、網(wǎng)站流量分析 網(wǎng)站流量分析從SEO結(jié)果上指導(dǎo)下一步的SEO策略粱挡，同時對網(wǎng)站的用戶體驗優(yōu)化也有指導(dǎo)意義衬衬。流量分析工具，建議采用Google流量分析刁笙。

3.4 ajax與form的區(qū)別是什么?

1破花、共同點: 都是客戶端瀏覽器給后臺發(fā)送數(shù)據(jù)的手段。
2疲吸、不同點：
2.1 ajax頁面不刷新座每，用戶是無感知的，體驗更好摘悴。
2.2 form頁面需要刷新峭梳，體驗不好。 現(xiàn)在一般都是ajax蹂喻。

3.5 爬蟲

1葱椭、網(wǎng)絡(luò)爬蟲是一種自動獲取網(wǎng)頁內(nèi)容的程序捂寿，是搜索引擎的重要組成部分。
2孵运、網(wǎng)絡(luò)爬蟲為搜索引擎從萬維網(wǎng)下載網(wǎng)頁秦陋。一般分為傳統(tǒng)爬蟲和聚焦爬蟲。
3治笨、傳統(tǒng)爬蟲從一個或若干初始網(wǎng)頁的URI開始踱侣，獲得初始網(wǎng)頁上的URI，在抓取網(wǎng)頁的過程中大磺，不斷從當(dāng)前網(wǎng)頁上抽取新的URI放入隊列，直到滿足系統(tǒng)的一定停止條件探膊。通俗的講杠愧，也就是通過源碼解析來獲得想要的內(nèi)容。

3.6 Emmet

Emmet的前身是Zen Coding逞壁，Zen Coding是一種快速編寫HTML和CSS編碼的工具流济。Zen Coding由兩個核心組件組成：一個縮寫擴展器（縮寫為像CSS一樣的選擇器）和上下文無關(guān)的HTML標(biāo)簽對匹配器。
Emmet是一款編輯器插件腌闯，支持多種編輯器支持绳瘟。在前端開發(fā)中，Emmet 使用縮寫語法快速編寫 HTML姿骏、CSS 以及實現(xiàn)其他的功能糖声，極大的提高前端開發(fā)效率。
Emmet的下載地址在這：http://emmet.io/download/
想要了解更詳細(xì)的Emmet分瘦，建議看下面大牛的博客：https://segmentfault.com/a/1190000007812543

結(jié)束

對HTML的學(xué)習(xí)今天就結(jié)束了蘸泻，接下來一段時間我還是會發(fā)布學(xué)習(xí)HTML的文章，以后有什么心得體會都會發(fā)布嘲玫，和大家分享也一起學(xué)習(xí)進(jìn)步悦施。