電子發(fā)燒友App
我認(rèn)為網(wǎng)頁的優(yōu)化應(yīng)該是由兩個(gè)方面組成的：1.技術(shù)優(yōu)化，2.人文優(yōu)化（這個(gè)分類只是我總結(jié)的，沒有人給出過具體定義）。技術(shù)優(yōu)化指的是代碼的優(yōu)化、目錄結(jié)構(gòu)的優(yōu)化和針對(duì)搜索引擎的優(yōu)化等等針對(duì)技術(shù)方面的優(yōu)化工作，一般都是看不見摸不著的但是會(huì)給用戶帶來不少方便也會(huì)給網(wǎng)站帶來更大的效益，技術(shù)優(yōu)化有一定的模式而且需要優(yōu)化的東西也比較固定相對(duì)簡單一些只是時(shí)間問題；人文優(yōu)化指的是交互性優(yōu)化、易用性優(yōu)化等等針對(duì)用戶使用方面的優(yōu)化工作，這一部分是網(wǎng)站用戶看得見摸的著的東西，人文優(yōu)化是最花經(jīng)歷最困難的因?yàn)槲覀円聹y(cè)使用者的心理。下面我就分別對(duì)這兩個(gè)方面進(jìn)行解釋。
1．技術(shù)優(yōu)化：
技術(shù)優(yōu)化主要分為代碼優(yōu)化、目錄結(jié)構(gòu)優(yōu)化和針對(duì)搜索引擎的優(yōu)化三個(gè)部分。這一部分的優(yōu)化工作主要是由網(wǎng)站開發(fā)人員測(cè)試提出方案完成的，而且有一定的規(guī)則，所以相對(duì)要簡單一些只是時(shí)間問題。
?。?）代碼優(yōu)化：
代碼優(yōu)化主要解決的問題就是頁面瀏覽速度和適應(yīng)性的問題。文字和圖片是構(gòu)成頁面的兩個(gè)主要因素，所以我們的優(yōu)化也要從文字和圖片開始。文字我們?cè)谥谱黜撁娴臅r(shí)候基本上都是定義好的一般使用宋體和12px，隨著代碼的標(biāo)準(zhǔn)化字體的樣式大小等等的指定應(yīng)該使用css樣式表來完成，而現(xiàn)在被廣泛應(yīng)用的< h1>< /h1>、< font size=×× color=××>< /font>等等標(biāo)簽都是不標(biāo)準(zhǔn)的，也會(huì)慢慢被css取代，現(xiàn)在很多大型的網(wǎng)站包括各個(gè)門戶網(wǎng)站像是這樣不標(biāo)準(zhǔn)的問題還是廣泛存在幾乎每個(gè)頁面都會(huì)有，所以css樣式表是我們?cè)趦?yōu)化過程中應(yīng)該注意檢查的問題（其實(shí)這個(gè)問題應(yīng)該是在頁面制作的時(shí)候就解決的）。
圖片問題主要存在size過大的問題，在這里我們把圖片的優(yōu)化歸在代碼優(yōu)化一部分一起介紹而不另分一類，是因?yàn)閳D片優(yōu)化與代碼內(nèi)容優(yōu)化的目的是一樣的。網(wǎng)頁中一般應(yīng)用兩種格式的圖片jpeg和gif，這兩種圖片的應(yīng)用很多人把握的并不是很好，jpeg適用于顏色比較多、構(gòu)成比較復(fù)雜的圖片（比如一些照片、漸變顏色等等），gif適用于顏色比較少、構(gòu)成比較簡單的圖片（比如網(wǎng)站的logo、大的色塊構(gòu)成的圖片等等）。Gif圖片尤其要注意導(dǎo)出的時(shí)候選擇顏色數(shù)目這樣也會(huì)達(dá)到很好的減小尺寸的效果。對(duì)于一些比較大的圖片我們還可以將它切割成比較小的圖片進(jìn)行拼接這樣也可以提高網(wǎng)頁的下載速度。
減小網(wǎng)頁size提高網(wǎng)頁下載速度還有一種簡易的方法就是使用一些網(wǎng)頁減肥的小工具，我們可以去下載一些這樣的工具他們可以使你的網(wǎng)頁縮小20％～50％達(dá)到事半功倍的效果。
表格是頁面最重要的排版方式，在瀏覽器讀取網(wǎng)頁代碼的時(shí)候，必須讀完一個(gè)完整的table才會(huì)顯示出來， 如果一個(gè)大的table里邊含有很多小的table那么瀏覽器會(huì)在讀完整個(gè)大的table才將整個(gè)的內(nèi)容顯示出來。我們?cè)跒g覽一些頁面的時(shí)候經(jīng)常會(huì)出現(xiàn)頁面半天才會(huì)顯示出來，最后是在等不及了按了“停止”按鈕，頁面一下子顯示出來了，這就是在一些小的table外邊嵌套了一個(gè)大的table，而小table已經(jīng)讀完了就是還沒讀完整個(gè)的table瀏覽器不會(huì)顯示，這樣會(huì)大大減慢頁面瀏覽速度。因此我們要盡量減少表格層次，盡量避免將一些小的表格嵌套在大的表格中間。
還應(yīng)該注意的是在使用dreamweaver制作網(wǎng)頁的時(shí)候經(jīng)常會(huì)出現(xiàn)很多垃圾代碼，注意檢查刪除一些沒有用的代碼。網(wǎng)頁的適應(yīng)性就是在不同系統(tǒng)、不同瀏覽器和不同分辨率的適應(yīng)能力。要注意的是分辨率，應(yīng)該最低照顧到800×600的用戶（分辨率800×600的顯示尺寸780×428、分辨率1024×768的顯示尺寸1007×600），所以頁面最寬不要超過780，一定不要讓用戶橫向拖頁面。
?。?）目錄結(jié)構(gòu)優(yōu)化：
現(xiàn)在很多網(wǎng)站都將所有的頁面零散的放在同一個(gè)文件夾下而沒有分類，這樣做雖然可以但是會(huì)對(duì)以后的維護(hù)等工作帶來很大的麻煩。我建議應(yīng)該是建立一個(gè)大文件夾，里邊包括各個(gè)頻道的文件夾、網(wǎng)頁頁面圖片文件夾、網(wǎng)頁內(nèi)容圖片文件夾等等一個(gè)一個(gè)的單獨(dú)類別的文件夾，使得在維護(hù)時(shí)候可以方便的找到每一個(gè)頁面的具體位置。
?。?）針對(duì)搜索引擎的優(yōu)化：
搜索引擎優(yōu)化是很多人都知道的一種優(yōu)化項(xiàng)目，也是完整的優(yōu)化工作必不可少的一個(gè)步驟。 “關(guān)鍵字”在搜索引擎這個(gè)話題里是一個(gè)核心的字眼，幾乎所有的針對(duì)搜索引擎優(yōu)化問題都是圍繞著“關(guān)鍵字”展開的。有很多人盲目的追求在網(wǎng)頁中處處體現(xiàn)關(guān)鍵字，覺得這樣就會(huì)更容易被搜索引擎搜到，其實(shí)這樣做并不一定合適。比如前一陣子流行過的“鬼影秘笈”，方法就是用和網(wǎng)頁背景相同的顏色在頁面中隱藏了很多關(guān)鍵字，很多人現(xiàn)在還在用這個(gè)方法，但是隨著搜索引擎功能越來越強(qiáng)大這個(gè)方法已經(jīng)不那么好用了，甚至?xí)鸬椒醋饔谩?這種做法會(huì)被搜索引擎懲罰，有專門的舉報(bào)系統(tǒng))
“關(guān)鍵字”的體現(xiàn)要合理，比如我們可以制作一個(gè)“網(wǎng)站導(dǎo)航”的頁面，網(wǎng)站導(dǎo)航頁面會(huì)淋漓盡致的體現(xiàn)各個(gè)關(guān)鍵字，這個(gè)頁面不但方便用戶使用也會(huì)更容易的被搜索引擎找到起到事半功倍的作用。隨著搜索引擎都有了圖片搜索功能，網(wǎng)頁里邊的圖片也是體現(xiàn)關(guān)鍵詞的好地方，在頁面里邊加入圖片后千萬別忘記給圖片起一個(gè)“名字”（如：< IMG SRC="http://ttokpm.com/images/chaijie_default.png" WIDTH="100" HEIGHT="100" BORDER=0 ALT="圖片名稱">）我們給圖片的名稱就可以是關(guān)鍵字。域名里邊含有關(guān)鍵字也很重要，但是不宜過多，一般一個(gè)或者兩個(gè)最重要的就可以了，如果過多就會(huì)影響網(wǎng)站在搜索引擎的排名而且不方便用戶記憶。子頁面的名稱也是一樣，現(xiàn)在很多網(wǎng)站的子頁面名稱就是關(guān)鍵字的堆砌，其實(shí)這樣會(huì)降低每個(gè)關(guān)鍵詞的出現(xiàn)機(jī)率，結(jié)果每個(gè)關(guān)鍵詞都被打了折扣甚至被忽略適得其反。在子頁面的命名上也有很大的學(xué)問，幾個(gè)關(guān)鍵詞構(gòu)成了子頁面的名稱，但是這幾個(gè)關(guān)鍵詞用什么連接呢？如果用分隔符斷開關(guān)鍵字那么搜索引擎不會(huì)認(rèn)為他們是一個(gè)一個(gè)的詞而會(huì)當(dāng)他們是一個(gè)詞處理，但是有的分隔符搜索引擎同樣認(rèn)不出來，比如“_”和“-”在google里邊下劃線“_”就不被接受，所以建議大家使用“-”和空格（空格碼：％20），一般所有的搜索引擎都會(huì)接受。千萬不要用中文給頁面命名，頁面名稱、圖片名稱等等都要用英文字母（如：“首頁.html”或者“圖片.gif”一定要寫成“index.htm”“image.gif” 等等）。
現(xiàn)在很多網(wǎng)頁雖然很好看但是并不實(shí)用，我們就拿現(xiàn)在很流行的跳轉(zhuǎn)頁面來說吧！現(xiàn)在很多企業(yè)網(wǎng)站都流行做一個(gè)跳轉(zhuǎn)頁面，或者是一段動(dòng)感的flash或者是一張漂亮的圖片，他們認(rèn)為這樣很漂亮特別能夠體現(xiàn)公司的形象，其實(shí)他們并不知道這樣做非常影響搜索引擎搜索你的網(wǎng)站。(搜索引擎無法通過FLASH找到你真正的內(nèi)容頁)
人文優(yōu)化主要是交互、易用性和網(wǎng)站表現(xiàn)的優(yōu)化。
我曾經(jīng)看過一本書是美國著名的優(yōu)化大師斯蒂夫.克魯格寫的，他推崇的效果優(yōu)化第一原則就是“別讓我動(dòng)腦”。也許這個(gè)概念看上去好像一點(diǎn)頭緒沒有，我第一次接觸這句話的時(shí)候也是有點(diǎn)暈，如果想要做到這一點(diǎn)那可是非常困難的?！皠e讓我動(dòng)腦”這個(gè)概念在不同的人身上有著不一樣的概念，這就回到了上邊所說的“人文優(yōu)化是最花經(jīng)歷最困難的因?yàn)槲覀円聹y(cè)使用者的心理”這句話。
人和人是不一樣的，每個(gè)人會(huì)因?yàn)樯畹牡赜虿煌兄幕町悾蛘咭驗(yàn)槭艿降慕逃?jīng)歷不同有著理解問題的差異，或者是個(gè)人觀點(diǎn)和習(xí)慣的不同等等有著各種各樣的差異，我們要讓所有人都能夠理解我們的網(wǎng)站能夠方便的使用網(wǎng)站達(dá)到他想要達(dá)到的目的這簡直是太難了，而人文優(yōu)化要做的就是要把這些差異變?yōu)榻y(tǒng)一。
各個(gè)網(wǎng)站都會(huì)有不同的目的，有電子商務(wù)網(wǎng)站、企業(yè)的展示網(wǎng)站、個(gè)人站點(diǎn)等等。現(xiàn)在我們就以最最需要進(jìn)行人文優(yōu)化的電子商務(wù)類型網(wǎng)站為例研究人文優(yōu)化的大概過程。
電子商務(wù)網(wǎng)站這個(gè)概念很明確，就是要體現(xiàn)商務(wù)，可以是網(wǎng)上購物的、可以是在線票務(wù)的、可以是網(wǎng)上的交易平臺(tái)，總之就是讓用戶在網(wǎng)絡(luò)上實(shí)現(xiàn)商務(wù)目的?，F(xiàn)在電子商務(wù)網(wǎng)站大體會(huì)有兩個(gè)部分B2B（商家對(duì)商家）、B2C（商家對(duì)普通零散用戶）。
B2C是電子商務(wù)網(wǎng)站設(shè)計(jì)的最高境界，如果能夠做出成功的B2C網(wǎng)站那么別的什么企業(yè)展示網(wǎng)站或者B2B的商務(wù)網(wǎng)站等等就都不算什么了，原因也很簡單，就是因?yàn)樯线吽徇^的人和人的差異。電子商務(wù)網(wǎng)站有一個(gè)很重要的指標(biāo)就是“轉(zhuǎn)化率”（也就是上網(wǎng)瀏覽網(wǎng)頁的瀏覽者轉(zhuǎn)變?yōu)轭櫩偷谋嚷剩＿@個(gè)概念也就是我們衡量一個(gè)電子商務(wù)網(wǎng)站是否成功的重要指標(biāo)，他也在優(yōu)化過程中占有重要地位。
介紹完電子商務(wù)的一些相關(guān)概念我們言歸正傳，當(dāng)我們要對(duì)網(wǎng)站進(jìn)行優(yōu)化的時(shí)候，我們很快的就完成技術(shù)優(yōu)化，因?yàn)榧夹g(shù)優(yōu)化有特定的步驟需要優(yōu)化的項(xiàng)目也比較固定而且有據(jù)可依。但是很多人不知道人文優(yōu)化該如何入手，其實(shí)也很簡單那就是“試用”。
一般試用會(huì)分為兩個(gè)部分：首先我們會(huì)自己試用一下對(duì)網(wǎng)站有一個(gè)大概的了解，然后我們需要找一些普通用戶進(jìn)行試用，在普通用戶試用過程中我們不會(huì)給予任何提示只需要默默的觀察他們的操作步驟記錄每一個(gè)步驟的操作過程和所用時(shí)間了解他們的一些想法。在“試用”以后我們就可以根據(jù)測(cè)試的結(jié)果分析出需要修改的部分。切記在試用過程中我們千萬不能給被測(cè)試的用戶任何提示盡量不要打擾他們。
說回上邊提到的“別讓我動(dòng)腦”這個(gè)概念，其實(shí)這句話就表達(dá)了一個(gè)意思就是“簡單”，使用簡單是一個(gè)電子商務(wù)網(wǎng)站成功的基礎(chǔ)。“簡單”宗旨我們需要貫穿整個(gè)網(wǎng)站的每一個(gè)部分。下邊我們按照“試用”流程分析一下在優(yōu)化過程中需要注意的問題。從登陸這個(gè)網(wǎng)站開始，我們是不是能夠清楚的看到這個(gè)網(wǎng)站叫什么名字？是干什么的？那里是產(chǎn)品的目錄？那里是導(dǎo)航菜單？那里是今天的重點(diǎn)推薦產(chǎn)品？那里是折扣產(chǎn)品專區(qū)？這一連串的問號(hào)是針對(duì)電子商務(wù)網(wǎng)站而言的，如果對(duì)于別的網(wǎng)站我們會(huì)考慮別的因素，比如針對(duì)一個(gè)新聞頁面而言，我們就會(huì)考慮那里是今天的頭條新聞？我要看昨天晚上中國隊(duì)足球賽的比分和圖片在那里？等等。這種測(cè)試并沒有特定的規(guī)范，任何動(dòng)作都是隨機(jī)的都是我們突發(fā)的動(dòng)作，所以這樣的測(cè)試不能像是那種商場或者專賣店等等地方的測(cè)試一樣給我們一個(gè)很長的表格讓我們?nèi)ギ媽?duì)勾畫杈子。一切測(cè)試做的都要非常自然，只有這樣我們才可以真正了解到用戶在使用過程中遇到的困難。
我們有的時(shí)候也可以給被測(cè)試人一個(gè)題目讓他去完成，比如：讓他去網(wǎng)站上買一張最新的大片DVD，或者然他們?nèi)ゲ檎乙粋€(gè)最新的消息甚至是一條一個(gè)月以前的消息。整個(gè)測(cè)試都要在和諧的環(huán)境下進(jìn)行，不要讓參與測(cè)試的人感到緊張，那樣會(huì)大大降低測(cè)試結(jié)果的正確性。測(cè)試還需要根據(jù)經(jīng)費(fèi)、網(wǎng)站規(guī)模等等情況制訂不同的方案。
下面是一個(gè)用戶瀏覽一個(gè)網(wǎng)站的過程圖，這張圖有助于我們了解用戶瀏覽網(wǎng)站的整個(gè)過程。我們可以根據(jù)這張圖列出的步驟細(xì)心觀察測(cè)試時(shí)候用戶在網(wǎng)站上完成一個(gè)工作時(shí)候在每一個(gè)步驟里所用的時(shí)間、都做了些什么，并記錄下來認(rèn)真分析這些數(shù)據(jù)，這些數(shù)據(jù)也是我們優(yōu)化動(dòng)作的依據(jù)。
通常我們優(yōu)化的重點(diǎn)都會(huì)集中在導(dǎo)航菜單、產(chǎn)品目錄、站內(nèi)搜索、頁面布局、購買流程等等。下邊我要舉一些小例子分析一下現(xiàn)在很多網(wǎng)站所犯的錯(cuò)誤，我們?nèi)绾芜M(jìn)行優(yōu)化。
我們先看一個(gè)大多數(shù)網(wǎng)站都會(huì)犯下的文字錯(cuò)誤，文字是構(gòu)成網(wǎng)頁的最重要的元素之一，我們文字可以用文字的顏色、大小和位置來區(qū)分他們的重要性，分為標(biāo)題、內(nèi)容等等。有很多網(wǎng)站的首頁進(jìn)去我們一眼看到的是黑壓壓的一片文字，馬上我們會(huì)對(duì)這個(gè)網(wǎng)站都沒有好感。這就是我們國內(nèi)很多網(wǎng)站都有的錯(cuò)誤，網(wǎng)站會(huì)因不同的目的有不同的設(shè)計(jì)方向，很多企業(yè)的領(lǐng)導(dǎo)者并不懂得設(shè)計(jì)，他們會(huì)去參考一些別人的網(wǎng)站來對(duì)設(shè)計(jì)者提出自己網(wǎng)站的設(shè)計(jì)要求和想法，這樣就會(huì)造成不管什么方向的網(wǎng)站感覺都一樣，從而失去了自己的主題。比如現(xiàn)在我們?nèi)ヒ恍┢髽I(yè)的網(wǎng)站，上去之后沒看到這個(gè)企業(yè)是干什么的，第一眼就是大片的企業(yè)新聞，這樣的大片新聞感覺企業(yè)網(wǎng)站變成了新聞網(wǎng)站。
有人說了那我們把企業(yè)介紹放在首頁吧，這樣一上網(wǎng)站的首頁人家就看見我們公司是做什么的了。看上去真是好主意，但是我們應(yīng)該明確一點(diǎn)用戶是在“瀏覽網(wǎng)頁”而不是在“閱讀網(wǎng)頁”，這樣大片的文字根本不會(huì)有人有興趣看，用戶只會(huì)對(duì)自己感興趣的東西進(jìn)行閱讀，其它基本上都是瀏覽。
我們可以作一個(gè)簡單的試驗(yàn)，現(xiàn)在你可以遞給你身邊的一個(gè)人一張報(bào)紙，讓他們看報(bào)紙，細(xì)心觀察一下他們?cè)趺纯磮?bào)紙，每一個(gè)人都會(huì)整個(gè)把報(bào)紙翻一下，起碼他會(huì)看完一整版的標(biāo)題然后開始閱讀一個(gè)文章。絕對(duì)沒有人會(huì)拿起報(bào)紙從左上角或者右下角開始一個(gè)字一個(gè)字的閱讀報(bào)紙。網(wǎng)站的好處就是在于“鏈接”，我們可以充分的利用鏈接引導(dǎo)用戶閱讀他們感興趣的東西，或者引導(dǎo)他們閱讀我們希望他看見的東西。我們現(xiàn)在就可以去優(yōu)化一下以前的網(wǎng)站了，去掉首頁大片的文字，根據(jù)需要改成鏈接。
還有一個(gè)各個(gè)商業(yè)網(wǎng)站都會(huì)犯下的錯(cuò)誤，就是在讓客戶填寫注冊(cè)信息的時(shí)候需要必填的欄目太多。很多上網(wǎng)的人都有這樣的經(jīng)歷，現(xiàn)在大多說商務(wù)網(wǎng)站都會(huì)有注冊(cè)一欄，如果注冊(cè)成為會(huì)員就會(huì)有什么什么樣的服務(wù)，很好我們進(jìn)去注冊(cè)一下吧。點(diǎn)擊注冊(cè)按鈕，打開頁面，好家伙怎么要天那么多條，還都是畫著紅色星號(hào)的必填！算了還是不注冊(cè)了！一下子這個(gè)網(wǎng)站會(huì)因?yàn)樽?cè)少了很多顧客。有的人沒被嚇跑堅(jiān)持填寫，好吧開始填寫了用戶名、密碼、確認(rèn)密碼……“身份證號(hào)碼”？“手機(jī)號(hào)碼”？一下子我們停住了，不填這些可以么？但是畫著紅色星號(hào)，算了我不想讓別人知道這些信息，我也走吧，看看別的網(wǎng)站有沒有同樣的服務(wù)而且需要的信息少一點(diǎn)，盡管別的網(wǎng)站服務(wù)不好而且不如這個(gè)網(wǎng)站有名氣。這就是很多人上網(wǎng)的經(jīng)歷，很多網(wǎng)站的擁有者急于求成，想馬上控制到客戶的資料，他們會(huì)覺得這樣就會(huì)占到市場的先機(jī)。其實(shí)他們錯(cuò)了，想一下我們先讓用戶都來使用我們的網(wǎng)站慢慢的他們覺得我們這里很安全而且服務(wù)很好就會(huì)有人想得到更多的服務(wù)，他們自然而然的就會(huì)注冊(cè)這些信息了。但是我們?cè)谟脩暨€沒有了解這個(gè)網(wǎng)站的時(shí)候就把他們嚇跑了我們就會(huì)徹底的失去這部分用戶的，這樣給網(wǎng)站和企業(yè)帶來的損失要遠(yuǎn)遠(yuǎn)大于那些不管怎么都會(huì)注冊(cè)的用戶帶來的利益要大。所以當(dāng)我們?cè)趦?yōu)化過程中看到網(wǎng)站的注冊(cè)過程中有這些欄目的時(shí)候我們要建議他們把必填改為自愿填寫，而且在一些關(guān)鍵頁面里邊添加一些關(guān)于注冊(cè)客戶和普通客戶會(huì)享受不同待遇的提示，這樣會(huì)起到事半功倍的作用。
我們已經(jīng)介紹了兩個(gè)關(guān)于人文優(yōu)化的例子，由于這樣的例子很多我們也不一一列舉，要在實(shí)際的工作中去總結(jié)。并不是最好看的網(wǎng)頁就是最好的網(wǎng)頁，實(shí)用性要比藝術(shù)性更重要。
上邊這些優(yōu)化的問題適用于我們對(duì)一個(gè)已有的網(wǎng)站進(jìn)行優(yōu)化，如果我們要重新做一個(gè)新的網(wǎng)站，最好在初期就考慮一些這樣的問題，畢竟做任何事事先考慮要比事后彌補(bǔ)強(qiáng)的多。這些緊緊是我自己的一些經(jīng)驗(yàn)總結(jié)和大家分享，文章還有很多不足之處，希望大家多多提點(diǎn)！我的QQ：250596 以后多多交流！希望大家都能夠做出最棒的網(wǎng)站，提高中國網(wǎng)站設(shè)計(jì)制作行業(yè)在世界的地位！
工商網(wǎng)監(jiān)
評(píng)論