如何為wordpress創(chuàng)建個(gè)性十足且用戶友好的404頁
來源:解決方案AiWeTalk的空間 2012-01-07
404頁面不僅僅是為了給網(wǎng)站用戶指出問題所在,你還需要為他們提供一個(gè)可行的解決方案。
在wordpress的默認(rèn)主題kubrick中,404頁面做得既簡單又難看,相信你的也不會太好。本文將手把手教你制作出一個(gè)優(yōu)秀的404頁面。
其實(shí),一個(gè)好404頁在設(shè)計(jì)上并不復(fù)雜,目的是幫助網(wǎng)站用戶找到他們想要的信息,并繼續(xù)瀏覽你的網(wǎng)站。廢話不多說了,我們開始吧!
假設(shè)你是網(wǎng)站的訪問者。
假設(shè)你自己是網(wǎng)站的用戶,到達(dá)了404頁面,肯定是因?yàn)槟阆M业絼e的什么信息,否則不可能來到這里。所以,有幾件事情你絕對不能做:
第一,認(rèn)為人們很可能是點(diǎn)擊網(wǎng)站的某處鏈接才到達(dá)的404錯(cuò)誤頁。如果真是如此,誰該為此事負(fù)責(zé)?他們?不,是你-站長。
第二,要讓404頁的設(shè)計(jì)樣式與網(wǎng)站上的其它頁面保持一致。有些站長喜歡別出心裁,不考慮用戶的接受能力。例如,有位站長將此頁設(shè)計(jì)成了常見的windows藍(lán)屏,結(jié)果卻不太好,人們紛紛逃離他的網(wǎng)站。
第三,如果你打算開個(gè)玩笑,就像上面提到的藍(lán)屏設(shè)計(jì),最好保證每個(gè)人都能接受它。
讓我們來設(shè)計(jì)一個(gè)完美的404錯(cuò)誤頁
Ok,既然知道了不要做什么,你也需要知道用戶到你的網(wǎng)站是想尋找一些特定的內(nèi)容,通常他們是跟隨某個(gè)鏈接來到這里的,F(xiàn)在,作為站長的你,需要提供各種方法幫助他們達(dá)到目的。
讓我們看看一些非常棒的404實(shí)例頁吧:
在上面幾個(gè)404頁中, conversion rate experts網(wǎng)站的設(shè)計(jì)我最喜歡,同時(shí)它也激發(fā)了我的靈感。
它提供了4個(gè)選項(xiàng)去幫助用戶:
1、重新搜索
2、檢查是否存在鏈接拼寫錯(cuò)誤。
3、在網(wǎng)站地圖里查找。
4、返回到網(wǎng)站首頁。
apple官網(wǎng)直接將網(wǎng)站地圖呈現(xiàn)給用戶,這個(gè)思路也很不錯(cuò)。你可以根據(jù)喜好來選擇其中一個(gè)。
我建議你選用conversion rate experts的404解決方案,而且設(shè)計(jì)上也很容易實(shí)現(xiàn),我就不一一贅述了。這里,我還要增加一項(xiàng):顯示與用戶輸入的url網(wǎng)址相關(guān)的一些網(wǎng)頁的列表。為了實(shí)現(xiàn)這個(gè)功能,我們得研究分析下這個(gè)url地址,看看能否發(fā)現(xiàn)點(diǎn)什么:
一個(gè)404錯(cuò)誤頁能為人們提供什么有用的數(shù)據(jù)?
許多站長會認(rèn)為404頁是個(gè)死角。其實(shí)不然,它能提供許多有用的數(shù)據(jù)可以幫助你了解網(wǎng)站用戶的搜索意圖。讓我們研究下url地址:域名/后面的所有的字符會提示你用戶想要找什么。
令人高興的是,wordpress系統(tǒng)存儲了這個(gè)信息,你可以通過變量$wp_query->query_vars['name']找到它。這個(gè)wp_query類函數(shù)存貯的是經(jīng)過一系列處理后的規(guī)范化的網(wǎng)址,我們可以利用這些信息來構(gòu)建你的404頁面。
首先,讓我們檢查下是否存在與$wp_query->query_vars['name']變量中的頁面名稱直接匹配的頁面。
$s = $wp_query->query_vars['name'];$s = preg_replace("/(.*)-(html|htm|php|asp|aspx)$/","$1",$s);$posts = query_posts( array( 'post_type' => 'any', 'name' => $s) );如果上述語句沒有輸出結(jié)果,你需要使用str_replace()函數(shù)將$s字符串中的“-”用空格去掉,再進(jìn)行一次搜索。當(dāng)我們再次利用$s變量時(shí),要把它放在if語句的外面以檢查之前的查詢是否有結(jié)果產(chǎn)生。
$s = str_replace("-"," ",$s);if (count($posts) == 0) {$posts = query_posts(array( array('post_type' => 'any', 'name' => $s) );}現(xiàn)在,我們得到了一些輸出結(jié)果,它們是一些與用戶之前輸入的網(wǎng)址相關(guān)的日志,至少,我們認(rèn)為是相關(guān)的,用下面的語句將其以列表的形式顯示出來:
if (count($posts) > 0) {echo "<p>Were you looking for <strong>one of the following</strong> postsor pages?</p>";echo "<ul>";foreach ($posts as $post) {echo '<li>';echo '<a href="'.get_permalink($post->ID).'">'.$post->post_title.'</a>';echo '</li>';}echo "</ul>";}
如果你覺得這么做實(shí)在太麻煩,可以安裝插件smart 404。它實(shí)現(xiàn)的功能與上面介紹的差不多。
現(xiàn)在一個(gè)非常棒的404頁就制作完成了,注意如果滿足條件的日志太多,你不必一一把它們顯示出來,選取一部分即可。另外,404錯(cuò)誤還提供了一個(gè)有用信息就是the referrer(用戶來路):如果,有人與你網(wǎng)站做了一個(gè)錯(cuò)誤的網(wǎng)頁鏈接,或者鏈接到了一個(gè)不再存在的頁面。所以,你需要做的最后一件事就是:
避免404頁面的出現(xiàn)
使用google analytics有個(gè)好處就是能查看the referrer信息,這樣你能發(fā)現(xiàn)網(wǎng)站用戶的來路。它可以幫助你將url指向合適的網(wǎng)頁,也能發(fā)現(xiàn)那些與你網(wǎng)站做了錯(cuò)誤鏈接的網(wǎng)站,以便及時(shí)通知站長們修正鏈接地址。
另一個(gè)不錯(cuò)的跟蹤網(wǎng)站404錯(cuò)誤的方法就是使用google站長工具。在“診斷-抓取錯(cuò)誤”菜單中,google會將你網(wǎng)站中可能的產(chǎn)生404錯(cuò)誤的地方逐一地標(biāo)示出來:
本文由reidrightsolutions.com網(wǎng)絡(luò)推廣整理
我的評論
登錄賬號: | 密碼: | 快速注冊 | 找回密碼 |