超碰人人人人人,亚洲AV午夜福利精品一区二区,亚洲欧美综合区丁香五月1区,日韩欧美亚洲系列
400 186 1886
OA教程
經(jīng)驗(yàn)分享
安裝指引
工作流
ERP教程
經(jīng)驗(yàn)分享
銷售管理
采購(gòu)管理
生產(chǎn)管理
倉(cāng)庫(kù)管理
工程管理
品質(zhì)管理
財(cái)務(wù)管理
模切知識(shí)交流
經(jīng)驗(yàn)分享
技術(shù)文檔
PMS教程
CRM教程
開發(fā)文檔
其他文檔
MIS教程
MAS教程
EBR教程
企業(yè)管理
微信好文
讀書沙龍
無題
網(wǎng)站管理員
9個(gè)Web設(shè)計(jì)中常見的可用性錯(cuò)誤
當(dāng)前位置:
點(diǎn)晴教程
→
知識(shí)管理交流
→
『 技術(shù)文檔交流 』
admin
2010年4月27日 2:28
本文熱度 9851
[p]現(xiàn)在,比較牛的設(shè)計(jì)師和開發(fā)者都認(rèn)識(shí)到了可用性在他們工作中的重要性??捎眯院玫木W(wǎng)站會(huì)極大地提高用戶體驗(yàn),并且好的用戶體驗(yàn)會(huì)讓用戶更加快樂。用聰明的設(shè)計(jì)決策取悅并滿足您的訪客,而不是阻撓和激怒他們。[/p]
[p][/p]
[p]下面是[b]9個(gè)網(wǎng)站經(jīng)常面臨的可用性問題[/b] ,以及對(duì)于這些問題的推薦解決方案。 您可能還對(duì)下面的文章感興趣:[/p]
[ul]
[li][url=http://smashingmagazine.com/2007/09/27/10-usability-nightmares-you-should-be-aware-of/]10 usability nightmaters that you should avoid[/url][/li]
[li][url=http://smashingmagazine.com/2007/10/09/30-usability-issues-to-be-aware-of/]30 usability issues to be aware of[/url][/li]
[li][url=http://smashingmagazine.com/2009/01/19/12-useful-techniques-for-good-user-interface-design-in-web-applications/]12 useful techniques for good interface design[/url][/li]
[li][url=http://smashingmagazine.com/2009/01/12/10-useful-web-application-interface-techniques/]10 useful web application interface techniques[/url][/li][/ul]
1. 太小的鏈接點(diǎn)擊區(qū)域
[p]設(shè)置超文本鏈接的目的是被點(diǎn)擊,確保它們很容易點(diǎn)擊才有意義。下面的示例中的鏈接實(shí)在是太小了;點(diǎn)擊它們的難度太高。 這些是 評(píng)論中的鏈接,hacker news 是一個(gè)社會(huì)新聞的網(wǎng)站。 (點(diǎn)擊區(qū)域用紅色突出顯示) :[/p]
[p][url=http://news.ycombinator.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p]下面例子中包含相同的界面元素,鏈接的評(píng)論,但是這個(gè)例子中有一個(gè)很大的可點(diǎn)擊區(qū)域:[/p]
[p][url=http://newspond.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://newspond.com/]newspond[/url]comments link.[/i][/p]
[p]為什么我們需要一個(gè)更大的點(diǎn)擊區(qū)域? 很簡(jiǎn)單。 因?yàn)槲覀円苿?dòng)鼠標(biāo)并不是很準(zhǔn)確。 [b]一個(gè)大號(hào)的點(diǎn)擊區(qū)域使鼠標(biāo)光標(biāo)懸停在鏈接上更容易[/b]。如何能有一個(gè)大號(hào)的點(diǎn)擊區(qū)域呢?我們可以使整個(gè)鏈接更大,或者使用css “padding”屬性增加鏈接周圍的空間。 代碼如下:[/p]
[p]
example site
[/p]
[p]為了使例子簡(jiǎn)單點(diǎn),這個(gè)css樣式直接寫在代碼里了,但在現(xiàn)實(shí)生活中您可能是在您的css文件中添加一個(gè)樣式,給這個(gè)鏈接一個(gè)class或者是一個(gè)id,然后指向它。[/p]
[p]在37signals上,你可以閱讀到更多關(guān)于填充鏈接以更適用于鼠標(biāo)點(diǎn)擊的文章,的文章棉衣鏈接的目標(biāo) 。文章認(rèn)為,填充為用戶提供了 “舒適的感覺。真的非常容易點(diǎn)擊鏈接。感覺鏈接就像是在配合你工作不是和你對(duì)著**。 ”[/p]
2. 錯(cuò)誤使用的分頁
[p]分頁指把內(nèi)容分為幾頁。如果需要顯示一個(gè)很長(zhǎng)的內(nèi)容列表,這是網(wǎng)站上常用的方式;例如,商店中的產(chǎn)品或是相冊(cè)中的照片。因?yàn)檫@種目的使用分頁是有意義的,因?yàn)閇b]太多的項(xiàng)目[/b]顯示在一個(gè)頁面上將會(huì)使網(wǎng)頁下載和處理[b]速度變慢[/b]。[/p]
[p][url=http://feedmyapp.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://feedmyapp.com/]feedmyapp[/url]以正確的方式使用分頁:把其海量的應(yīng)用服務(wù)列表以合適的量顯示。[/i][/p]
[p]但是現(xiàn)在還有人用另一種方式在web上使用分頁。 .內(nèi)容網(wǎng)頁上,比如博客的一篇文章,有時(shí)也會(huì)分成若干頁。 為什么這樣做? 有什么好處么?不太可能是文章實(shí)在太長(zhǎng)了,因此需要分頁; 在大多數(shù)情況下, 這樣做是用來提高頁面瀏覽量的。因?yàn)楹芏嗖┛秃碗s志通過廣告獲得收入,獲得更多的頁面瀏覽量(即單獨(dú)網(wǎng)頁的加載數(shù)量)來提高他們的瀏覽統(tǒng)計(jì)數(shù)據(jù),使他們能夠在每個(gè)廣告上獲利更多。[/p]
[p][url=http://wired.com/techbiz/startups/multimedia/2008/02/gallery_google_logos][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://wired.com/techbiz/startups/multimedia/2008/02/gallery_google_logos]wired 上的文章《google的logo》[/url] 分為8頁,非常難以閱讀。[/i][/p]
[p]雖然這可能看起來像是一種簡(jiǎn)單的方法,讓您可以從廣告中擠壓出更多的錢,但它也帶來了兩個(gè)主要的問題。[/p]
[p]首先,這樣做真的,真的非常討厭。 閱讀一篇文章不得不加載好幾頁一點(diǎn)也不好玩。 您給您的訪客設(shè)置了一個(gè)[b]完全沒有必要的障礙[/b]。[/p]
[p]第二個(gè)原因是seo(搜索引擎優(yōu)化) 。 搜索引擎使用您網(wǎng)頁上的內(nèi)容理解它是關(guān)于什么的,然后相應(yīng)地進(jìn)行索引。 如果內(nèi)容分成若干頁,內(nèi)容就被稀釋了,每個(gè)頁面[b]更難理解[/b]并且其中和主題相關(guān)的[b]關(guān)鍵字也更少[/b]了 。 這可能會(huì)對(duì)文章在搜索引擎中的排名產(chǎn)生不利影響。[/p]
3. 重復(fù)的網(wǎng)頁標(biāo)題
[p]每個(gè)網(wǎng)頁上的標(biāo)題都是非常重要的。網(wǎng)頁標(biāo)題就是html代碼區(qū)段中我們寫在[b]
標(biāo)記里面[/b]文本。 有時(shí),人們?cè)诰帉懰麄兙W(wǎng)站模板時(shí)設(shè)定一個(gè)通用名稱——例如其網(wǎng)站的名字——然后在整個(gè)網(wǎng)站反復(fù)使用相同的名稱。 這樣做是錯(cuò)誤的,因?yàn)闉槊總€(gè)頁面設(shè)置單獨(dú)的標(biāo)題有幾個(gè)關(guān)鍵的好處。[/p]
[p]第一個(gè)好處是,一個(gè)[b]好的標(biāo)題能向您的訪客傳達(dá)很多信息[/b],解釋這個(gè)頁面的內(nèi)容是什么。人們可以迅速知道他們是否在正確的地方。請(qǐng)記住,標(biāo)題不僅僅顯示在瀏覽器窗口頂部,它也顯示在搜索引擎結(jié)果頁上 。 當(dāng)人們?cè)趃oogle的時(shí)候看到一個(gè)[b]搜索結(jié)果列表[/b],他們會(huì)去閱讀那些網(wǎng)頁標(biāo)題來了解每個(gè)網(wǎng)頁的內(nèi)容。僅僅因?yàn)檫@個(gè),你也應(yīng)該花一些時(shí)間來優(yōu)化你的網(wǎng)頁標(biāo)題。[/p]
[p]第二個(gè)好處是seo。 搜索引擎需要不同的信息來為一次特定的查詢排序搜索結(jié)果。 網(wǎng)頁標(biāo)題是重要的信息之一,它們用來衡量[b]您的網(wǎng)頁與一個(gè)特定的搜索關(guān)鍵字的相關(guān)程度[/b]。這并不意味著你應(yīng)該在標(biāo)題里添加許多關(guān)鍵字——這與第一個(gè)好處相矛盾——但你應(yīng)確保每個(gè)標(biāo)題簡(jiǎn)明扼要地介紹了網(wǎng)頁的內(nèi)容,其中包括幾個(gè)你覺得人們會(huì)用來搜索這篇文章的關(guān)鍵字。 下面是一個(gè)好網(wǎng)頁標(biāo)題的例子。這是一個(gè)smashing magazine網(wǎng)頁標(biāo)題在safari中瀏覽的樣子:[/p]
[p][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/p]
[p]例子里,我們可以看到文章標(biāo)題,類別和文章的網(wǎng)站名稱。 把網(wǎng)站名稱放在最后,更強(qiáng)調(diào)的是[b]網(wǎng)頁本身的內(nèi)容 [/b],而不是網(wǎng)站的品牌。 下面是標(biāo)記中html代碼的樣子:[/p]
vintage and blues wordpress themes | freebies | smashing magazine
[p]google搜索結(jié)果中這個(gè)頁面的樣子:[/p]
[p][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/p]
4. 內(nèi)容難以掃描
[p]為了確保您的網(wǎng)站易用性,您不僅需要有一個(gè)好的設(shè)計(jì),你還需要[b]良好的copy[/b](文案)。 copy(文案)是一個(gè)術(shù)語,用來描述網(wǎng)站上所有的文本內(nèi)容。 是的,好的設(shè)計(jì)能引導(dǎo)您的訪客瀏覽您的網(wǎng)站,將其注意力集中在重要的事情上,幫助他們理解信息塊,但訪客仍然需要閱讀文字來處理信息。這意味著copy是你整體網(wǎng)站設(shè)計(jì)中的一個(gè)[b]重要組成部分[/b]。[/p]
[p]在你能寫出一份好的文案之前,你需要了解人們實(shí)際上如何瀏覽你的網(wǎng)站。不要以為你的訪客會(huì)從頭到尾閱讀所有的文字。 那樣當(dāng)然很好,但是不幸的是,根本事實(shí)不是這樣滴。 人們被web上的信息狂轟亂炸,而且我們中的大部分人在盡力去消化那些信息。這就導(dǎo)致非常瘋狂的瀏覽行為:[b]我們從一塊內(nèi)容跳躍到另一塊,從一個(gè)網(wǎng)站網(wǎng)站跳到下一個(gè)。[/b]人們往往不能從頭到尾閱讀一個(gè)網(wǎng)站;他們從最先吸引他們注意力的那一塊內(nèi)容開始,然后移動(dòng)到下一個(gè)捕獲他們興趣的地方。 這個(gè)模式看起來有點(diǎn)像這樣:[/p]
[p][url=http://basecamphq.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i]the [url=http://basecamphq.com/]basecamp[/url] 的到達(dá)頁面。[/i][/p]
[p]紅圈表示訪客目光聚焦的區(qū)域,數(shù)字表示他們看那些元素的順序。用戶的視線在頁面上的興趣點(diǎn)之間跳躍,想要充分利用這種混亂的瀏覽模式,你需要用一種特定的方法組織你的文案。下面是幾個(gè)重點(diǎn):[/p]
[ul]
[li]設(shè)置幾個(gè)“關(guān)注點(diǎn)”(points of focus)。這些部分吸引訪客的注意力,你可以用[b]粗體,高對(duì)比度的顏色和較大的字體[/b]來實(shí)現(xiàn)這個(gè)目的。你也可以使用圖片,例如[b]圖標(biāo),把圖標(biāo)放在文字旁邊[/b],給這區(qū)域帶來更多的視覺吸引力。[/li]
[li]每個(gè)“關(guān)注點(diǎn)”應(yīng)該伴隨一個(gè)描述性的標(biāo)題。在進(jìn)一步閱讀文案之前,訪客可以了解到一點(diǎn)內(nèi)容概要。不要做“標(biāo)題黨”,[b]標(biāo)題應(yīng)該簡(jiǎn)單明了[/b]。人們希望迅速獲得信息,藏著掖著只會(huì)惹惱他們。[/li]
[li]任何文字都應(yīng)該簡(jiǎn)短并容易消化。只提供要點(diǎn),把其余的都刪去。在大多數(shù)情況下,文案撰寫者想補(bǔ)充說明觀點(diǎn)的文字只是增加了網(wǎng)站的負(fù)載。人們將只閱讀小塊小塊的文字,并且忽視大段的文章。[b]把你的文案刪減到不能再減的地步吧。[/b][/li][/ul]
[p][url=http://openoffice.org/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i]“為什么你應(yīng)該使用的[/i][i] openoffice[/i][i];;; ”網(wǎng)頁肯定可以改進(jìn)。除了頂部的大橫幅之外沒有設(shè)置明確“關(guān)注點(diǎn)”;并且,文案聚在一起成了一個(gè)大疙瘩,閱讀起來相當(dāng)困難。[/i][/p]
[p][url=http://culturedcode.com/things/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://culturedcode.com/things/]things[/url] 軟件的功能頁,每個(gè)功能都是一小段文字,包含一個(gè)自己的圖標(biāo)和標(biāo)題。這使得這個(gè)列表非常容易被掃描。為了使文案給人印象更深,列出實(shí)際的好處,而不是功能的名字。[/i][/p]
5.沒有辦法取得聯(lián)系
[p]如果你想建立一個(gè)成功的社區(qū),用戶參與是非常重要的,并且如果你想建立一個(gè)成功的網(wǎng)站或是社會(huì)網(wǎng)絡(luò)軟件,社區(qū)是非常重要的。此外,[b]如果你想擁有忠實(shí)的用戶,用戶參與同樣很重要[/b]。迅速回答用戶提出的疑問,修復(fù)他們遇到的問題并不僅僅意味著你有很好的客戶服務(wù)——[b]這意味這你在乎他們[/b],并且你的用戶和訪客會(huì)很欣賞這一點(diǎn)。[/p]
[p]但是很多網(wǎng)站依舊沒有給訪客一個(gè)方便渠道和公司取得聯(lián)系。一些網(wǎng)站甚至沒有email地址或是聯(lián)系方式。[/p]
[p][url=http://cocacola.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p]當(dāng)你點(diǎn)擊可口可樂[url=http://cocacola.com/]coca-cola[/url]網(wǎng)站上的“聯(lián)系我們”鏈接。顯示出來的頁面,沒有電子郵件,沒有電話號(hào)碼。大部分的鏈接指向“常見問題”;反饋表需要您的地址和年齡,還有500個(gè)字符的限制;“提交一個(gè)想法”的表單有兩頁那么長(zhǎng),還包含一大堆條款??磥砜煽诳蓸氛娴牟幌肽闩c他們聯(lián)系。[/p]
[p]當(dāng)然,把你的email地址放到網(wǎng)站上可能會(huì)吸引大量的垃圾郵件,這里有幾個(gè)解決辦法。[/p]
[p][url=http://hivelogic.com/enkoder]enkoder[/url] 是我最喜歡的把email放到web上的解決方案。enkoder是一個(gè)軟件,有兩個(gè)版本,一個(gè)是基于mac平臺(tái)的,一個(gè)是免費(fèi)的網(wǎng)絡(luò)應(yīng)用。它可以[b]加密你提交的任何email地址[/b],生成一串亂七八糟的javascript代碼,你可以把它放在你的頁面上。當(dāng)網(wǎng)頁加載這段代碼的時(shí)候,你的電子郵件地址就會(huì)奇跡般地出現(xiàn),還是一個(gè)[b]可點(diǎn)擊的鏈接[/b]。抓取email地址的爬蟲機(jī)器人不能讀取你的地址,起碼計(jì)劃是這樣的。[/p]
[p]你還可以用“聯(lián)系表單”(contact forms)來避免在網(wǎng)頁上顯示你的email的問題,但是你仍舊會(huì)收到一些垃圾郵件,除非你使用一個(gè)有效的captchas,或是其他垃圾郵件保護(hù)機(jī)制。請(qǐng)記住,像captchas這樣的東西是[b]用戶交互的障礙[/b],并且可能會(huì)降低用戶體驗(yàn)。[/p]
[p]論壇救援。在線論壇是一個(gè)很好的溝通渠道,是一個(gè)不錯(cuò)的和用戶聯(lián)系替代方案。一個(gè)公開的論壇比一個(gè)簡(jiǎn)單的“聯(lián)系表單”或email更好,因?yàn)槟愕挠脩粼谡搲蟍b]可以相互幫助[/b]。即使你不親自回應(yīng)用戶,其他的用戶可能幫助那個(gè)人,解決他的問題。[/p]
[p][url=http://getsatisfaction.com/]getsatisfaction[/url] 是一個(gè)web應(yīng)用程序,它就像一個(gè)論壇,用戶可以在板塊里張貼自己的問題和反饋,用戶或是團(tuán)隊(duì)成員都可以回復(fù)。用戶可以添加評(píng)論闡述自己的問題。無論你選擇getsatisfaction的托管解決方案或是運(yùn)行你自己的留言板,這樣雙向的溝通渠道是一個(gè)與用戶保持聯(lián)系的優(yōu)秀方法。[/p]
[p][url=http://getsatisfaction.com/apple][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i]the [url=http://getsatisfaction.com/apple]getsatisfaction forum for apple[/url].[/i][/p]
6. 沒有辦法搜索
[p]大部分人到達(dá)一個(gè)頁面會(huì)立即開始尋找搜索框。也許他們知道自己在尋找什么,并且不想花時(shí)間學(xué)習(xí)這個(gè)網(wǎng)站的導(dǎo)航結(jié)構(gòu)。jakob nielsen 管這些人叫“搜索優(yōu)勢(shì)用戶”。[/p]
[p]我們的可用性研究顯示,超過一半的用戶是“搜索優(yōu)勢(shì)”的,大約五分之一的用戶是“鏈接優(yōu)勢(shì)”的,其余則呈現(xiàn)出混合行為?!八阉鲀?yōu)勢(shì)”用戶通常進(jìn)入一個(gè)網(wǎng)站時(shí)直奔搜索按鈕,他們對(duì)在網(wǎng)站上逛逛沒有興趣;他們是“任務(wù)中心”的,而且想要盡可能快地找到明確的信息。 [url=http://useit.com/alertbox/9707b.html]jakob nielsen[/url][/p]
[p]無論您運(yùn)營(yíng)的是在線商店還是blog,你都需要搜索框。人們會(huì)來尋找一個(gè)特定的產(chǎn)品,或是一篇他們記得的文章,他們想要用一個(gè)快速搜索找到它。好消息是,如果你還沒有在你的網(wǎng)站上設(shè)置搜索,這件事其實(shí)很簡(jiǎn)單。[/p]
[p]你不必自己寫一個(gè)搜索功能,[b]google和yahoo這些搜索引擎已經(jīng)索引了你網(wǎng)站的大部分頁面(如果不是全部的話)[/b],因此,所有你需要做的就是選擇一個(gè),然后把搜索框嵌入到你的網(wǎng)站里。[/p]
[p]下面是yahoo的:[/p]
[p]為了讓它運(yùn)轉(zhuǎn)起來,[b]你需要做的只是把“hidden”字段的值改成你網(wǎng)站的域名[/b]。這將把google或是yahoo的搜索查詢范圍限制在你的網(wǎng)站內(nèi)部。你可能還想要修改下提交按鈕上的文字,說些你想說的……[/p]
7. 太多的功能需要注冊(cè)
[p]你的網(wǎng)站可能有些內(nèi)容或者功能要求訪客注冊(cè)才能使用。這很好,但是小心有多少內(nèi)容被藏在了注冊(cè)流程后面。深度交互的web應(yīng)用,例如email,文檔編輯和項(xiàng)目管理,其100%的功能都只有注冊(cè)用戶才能使用。其他網(wǎng)站,例如社會(huì)化新聞網(wǎng)站,不要這么做。我可以瀏覽[url=http://digg.com/]digg[/url]和[url=http://reddit.com/]reddit[/url]上所有的故事而不用登錄;[b]用戶沒必要顯示出自己的身份才能享受這些功能[/b]。[/p]
[p]當(dāng)你實(shí)現(xiàn)一個(gè)登錄限制的時(shí)候,小心不要把那些不需要用戶身份認(rèn)證的功能也鎖起來。一些blog需要人們注冊(cè)之后才能發(fā)布評(píng)論。當(dāng)然這將大大減少垃圾郵件,[b]但也同時(shí)大大減低了評(píng)論數(shù)。[/b][/p]
[p]你在網(wǎng)站上設(shè)置的限制會(huì)影響用戶的參與行為,消除那些限制,比如注冊(cè)什么的,幾乎肯定會(huì)增加用戶的參與程度。事實(shí)上,[b]一旦用戶開始使用你的網(wǎng)站,他們將更可能注冊(cè)賬號(hào),因?yàn)樗麄兤鋵?shí)已經(jīng)參與進(jìn)來了[/b]。[/p]
[p][url=http://getsatisfaction.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p]the [url=http://getsatisfaction.com/]getsatisfaction[/url];;; 的交互界面允許你填入你關(guān)于一家公司或是一個(gè)產(chǎn)品的評(píng)論,然后點(diǎn)擊“發(fā)布”按鈕。之后你看到的卻不是你發(fā)布的評(píng)論信息,而是一個(gè)“登錄或是注冊(cè)”的提示。這很扯,用戶可能已經(jīng)被打擊到了……[/p]
[p][url=http://pixlr.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][url=http://pixlr.com/]pixlr[/url]是一個(gè)在線圖片編輯應(yīng)用,這是pixlr的到達(dá)頁面,上面有一個(gè)鏈接名為“jump in n’ get started!”,點(diǎn)擊后會(huì)打開應(yīng)用。沒有試用,沒有注冊(cè);你現(xiàn)在就可以開始試用這個(gè)應(yīng)用了。[/p]
[p][url=http://posterous.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][url=http://posterous.com/]posterous[/url],一個(gè)博客托管網(wǎng)絡(luò),使用甚至不要求注冊(cè)。只是發(fā)送一封包含你的文章的email,你的blog就創(chuàng)建好了。[/p]
8. 老的永久鏈接指向“不存在”
[p]永久鏈接(permalink)指一個(gè)鏈接固定指向一個(gè)頁面,不會(huì)被改變;例如,指向一篇博客文章的鏈接,就像你現(xiàn)在正在讀的。[b]問題出現(xiàn)了,當(dāng)網(wǎng)站轉(zhuǎn)移到另外一個(gè)域,或者結(jié)構(gòu)重組了。[/b]那些指向現(xiàn)有頁面的老永久鏈接可能就斷掉了,除非你做了點(diǎn)什么。有種東西叫做301重定向。 301重定向是存在你服務(wù)其上的幾個(gè)指令,它可以把訪客重定向到恰當(dāng)?shù)捻撁嫠匾?,如果誰用老鏈接訪問你的網(wǎng)站,他們將不會(huì)看到一個(gè)404錯(cuò)誤頁:[b]301重定向會(huì)把他們轉(zhuǎn)向正確的地方[/b],只要你設(shè)置正確。數(shù)字“301”制定重定向的類型:permanent。[/p]
[p][url=http://fryewiles.com/404][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://fryewiles.com/404]frye / wiles[/url] 404 error.[/i][/p]
[p]有各種不同的辦法做301重定向。他們是如何實(shí)現(xiàn)部分取決于你使用的web服務(wù)器。這里介紹一下301重定向的基本操作,基于目前最流行的web服務(wù)器,apache。[/p]
[p]下面的代碼應(yīng)該在一個(gè)名為“[b].htaccess[/b]”的文件里,這個(gè)文件應(yīng)該在你網(wǎng)站的根目錄下。是的,文件以一個(gè)英文逗號(hào)開始。這意味這是一個(gè)系統(tǒng)文件,標(biāo)準(zhǔn)文件瀏覽器會(huì)默認(rèn)隱藏這種文件。因此,如果你不能用你的文件瀏覽器或者ftp客戶端看到它,去把你的 “display invisble files”選項(xiàng)勾選上。用你的編輯器創(chuàng)建或者(如果文件已經(jīng)在那里了)編輯這個(gè)文件。每當(dāng)訪客到達(dá)你的網(wǎng)站上,這個(gè)文件中的重定向規(guī)則將會(huì)被應(yīng)用。[/p]
[p]下面是些簡(jiǎn)單的301重定向代碼:[/p]rewriteengine on
redirect 301 /oldpage.html /newpage.html
[p]這些代碼相當(dāng)簡(jiǎn)單明了。如果誰想試著進(jìn)入 “yoursite.com/oldpage.html,” ,他們會(huì)立刻被重定向到“yoursite.com/newpage.html.” 。頂部的“rewriteengine on”是設(shè)置mod_rewrite引擎為開啟狀態(tài)(默認(rèn)是關(guān)閉的)。這就是處理重定向的引擎。[/p]
9. 老長(zhǎng)老長(zhǎng)的注冊(cè)表單
[p]注冊(cè)表單是一砣障礙物。因?yàn)樘顚懕韱魏苜M(fèi)勁,并且很無聊。[b]人們不得不投入時(shí)間和精力去注冊(cè)[/b],之后還得投入更多的時(shí)間和精力去記住他們的用戶名和密碼![/p]
[p]我們可以降低這種阻礙,通過盡可能縮短注冊(cè)表單??紤]到所有情況,注冊(cè)系統(tǒng)的目的僅僅是能夠識(shí)別每一個(gè)用戶,所以,偉義的要求就是一個(gè)獨(dú)特的標(biāo)識(shí)(如用戶名或是email地址),還有一個(gè)密碼。[b]如果你不需要更多信息,就不要問了。讓表單盡可能短。[/b][/p]
[p][url=http://readoz.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][url=http://readoz.com/]readoz[/url]的注冊(cè)表單可長(zhǎng)了。仔細(xì)研究下,我們發(fā)現(xiàn),一半以上的字段都是可選的。[b]如果這些是可選的,也就是并不真正需要的。[/b]這種形式可能會(huì)讓用戶看一眼就跑了。只顯示那些人們注冊(cè)時(shí)必需填寫的,其余的可以以后再說。[/p]
[p][url=http://tumblr.com/][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://tumblr.com/]tumblr[/url][/i](已經(jīng)被墻了)有一個(gè)最短的注冊(cè)表單。只有三塊,電子郵件,密碼,你新blog的地址。[/p]
[p][url=http://basecamphq.com/signup][img]http://bbon.cn/wp-content/themes/wpink//images/grey.gif[/img][/url][/p]
[p][i][url=http://basecamphq.com/signup]basecamp[/url] 的注冊(cè)頁用了一個(gè)聰明的伎倆。頁面上除了去首頁的鏈接沒有其他任何網(wǎng)頁導(dǎo)航。這樣可以使用戶集中在注冊(cè)過程中,不會(huì)受到任何干擾離開頁面。[/i][/p]
少過腦子
[p]可用性就是使工具更加容易使用。[b]少讓用戶過腦子,少讓用戶受挫折[/b]。一個(gè)網(wǎng)站應(yīng)該完成所有的工作,呈現(xiàn)給訪客的只是那些他們尋找的東西??捎眯赃€包括[b]人們使用你的網(wǎng)站時(shí)的體驗(yàn)[/b],因此,關(guān)注細(xì)節(jié),在實(shí)現(xiàn)頁面的呈現(xiàn)和感覺的時(shí)候。[/p]
[p]好的,如果你有些對(duì)這篇文章的想法,或是遇到了任何其他的可用性問題,寫在下面的回復(fù)部分告訴我吧~[/p]
[p]原文鏈接:[url=http://smashingmagazine.com/2009/02/18/9-common-usability-blunders/]http://smashingmagazine.com/2009/02/18/9-common-usability-blunders/[/url][/p]
[p]翻譯:[url=http://iamsure.org/archives/86]web設(shè)計(jì)中9個(gè)常見的可用性錯(cuò)誤[譯][/url][/p]
[p][b]關(guān)于作者[/b][/p]
[p]dmitry fadeyev 是 [url=http://usabilitypost.com/]usability post[/url] blog的創(chuàng)始人, 您可以在那里閱讀他關(guān)于好設(shè)計(jì)和可用性的想法。 在twitter上follow dmitry: [url=http://twitter.com/usabilitypost]@usabilitypost[/url].[/p]
[p][b]關(guān)于譯者[/b][/p]
[p]iamsure 是一個(gè)搞產(chǎn)品設(shè)計(jì)的人, 他的blog是[url=http://iamsure.org/]iamsure[/url],他有時(shí)候在上邊寫點(diǎn)有的沒的。 同樣,也在twitter上follow iamsure: [url=http://twitter.com/moresure]@iamsure[/url][/p]
[p][url=http://bbon.cn/2009/03/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af.html]http://bbon.cn/2009/03/9%e4%b8%aaweb%e8%ae%be%e8%ae%a1%e4%b8%ad%e5%b8%b8%e8%a7%81%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e9%94%99%e8%af%af.html[/url][/p]
該文章在 2010/4/27 2:28:32 編輯過
關(guān)鍵字查詢
web
錯(cuò)誤
設(shè)計(jì)
相關(guān)文章
正在查詢...
Copyright 2010-2025
ClickSun
All Rights Reserved