2021年改善網(wǎng)站設(shè)計(jì)的12個(gè)技巧

時(shí)間：2023-09-08 17:18:01 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-09-08 17:18:01 來(lái)源：網(wǎng)站運(yùn)營(yíng)

2021年改善網(wǎng)站設(shè)計(jì)的12個(gè)技巧：




在登陸您網(wǎng)站的五秒鐘內(nèi)，訪(fǎng)問(wèn)者可以確定您的公司做什么嗎？用戶(hù)是否可以根據(jù)需要輕松導(dǎo)航到各欄目？您的定價(jià)布局易于理解嗎？您的網(wǎng)站跳出率低嗎？

如果您發(fā)現(xiàn)自己對(duì)這些問(wèn)題的回答是“否”，那么可能是時(shí)候認(rèn)真考慮一下您設(shè)計(jì)和優(yōu)化網(wǎng)站的方式了。

網(wǎng)站的設(shè)計(jì)能夠融入您網(wǎng)站的用戶(hù)體驗(yàn)，功能并適當(dāng)?shù)匮a(bǔ)充您的內(nèi)容，才能真正出類(lèi)拔萃。

忽略這些事情可能非常容易，認(rèn)為這些更新是網(wǎng)站優(yōu)先事項(xiàng)上您所不擔(dān)心的事情，但是成功的網(wǎng)站既需要高質(zhì)量?jī)?nèi)容，又需要出色的用戶(hù)體驗(yàn)才能保持平衡。

您想要做的最后一件事是花時(shí)間在資訊中心或服務(wù)頁(yè)面上寫(xiě)一些令人驚奇的內(nèi)容，只是因?yàn)樵O(shè)計(jì)缺陷，導(dǎo)航問(wèn)題，混亂的布局或錯(cuò)過(guò)的轉(zhuǎn)換機(jī)會(huì)而使它不被注意。

但是網(wǎng)站用戶(hù)體驗(yàn)的影響因素很多，要想弄清要解決的最重要的事情，要理解其中的全部?jī)?nèi)容可能是一個(gè)挑戰(zhàn)。

那么，您需要了解什么才能開(kāi)始改進(jìn)您的網(wǎng)頁(yè)設(shè)計(jì)？

為了回答這個(gè)問(wèn)題，這里有12個(gè)網(wǎng)站設(shè)計(jì)技巧，以確保您在正確的方向上進(jìn)行改版并確保您不會(huì)拒絕訪(fǎng)問(wèn)者。

1.有一個(gè)計(jì)劃

既然您已經(jīng)認(rèn)識(shí)到您的站點(diǎn)可能需要進(jìn)行一些改進(jìn)，那么現(xiàn)在該倒退一步，并制定一個(gè)計(jì)劃來(lái)詳細(xì)說(shuō)明如何解決這些問(wèn)題。

從繪制您的客戶(hù)旅程開(kāi)始，從有人第一次訪(fǎng)問(wèn)您的網(wǎng)站到成為客戶(hù)的那一刻。

執(zhí)行此操作時(shí)，請(qǐng)考慮他們將要查看哪些頁(yè)面，它們將要閱讀哪些內(nèi)容以及它們將轉(zhuǎn)換成什么樣的報(bào)價(jià)。了解這一點(diǎn)將幫助您設(shè)計(jì)一個(gè)真正獲取潛在客戶(hù)的網(wǎng)站。

如果您正在努力獲取這些數(shù)據(jù)，或者缺少可以使研究變得更容易的CRM系統(tǒng)，則可以隨時(shí)采訪(fǎng)您的客戶(hù)。利用15-30分鐘的時(shí)間問(wèn)他們幾個(gè)問(wèn)題（您甚至可以用100元的星巴克禮品卡補(bǔ)償他們）。與盡可能多的人溝通，但不必費(fèi)力。

然后，使用這些數(shù)據(jù)來(lái)制定您的策略。這將幫助您確定網(wǎng)站的關(guān)鍵接觸點(diǎn)或用戶(hù)與之交互的區(qū)域。

在這些接觸點(diǎn)中，您應(yīng)該能夠繪制出每個(gè)接觸點(diǎn)需要喚起用戶(hù)的情感，思想，目標(biāo)，痛點(diǎn)和機(jī)會(huì)。

回答這些問(wèn)題將幫助您指導(dǎo)設(shè)計(jì)。他們的圖像是否將以您想要的方式最有效地解決這些領(lǐng)域？特定的調(diào)色板呢？在您的客戶(hù)旅程上入門(mén)，將有助于創(chuàng)建這些問(wèn)題的答案，并更好地加強(qiáng)您的設(shè)計(jì)。

2.消除干擾元素

網(wǎng)站上的某些元素會(huì)損害您試圖傳達(dá)的價(jià)值和信息。復(fù)雜的動(dòng)畫(huà)，內(nèi)容太長(zhǎng)以及“粗暴的”網(wǎng)站圖像都會(huì)對(duì)用戶(hù)造成干擾。

對(duì)于只有八秒鐘的關(guān)注時(shí)間的受眾，您需要充分說(shuō)明用戶(hù)在他們正在查看的頁(yè)面上將學(xué)到什么，并且您的設(shè)計(jì)不得因此而受到干擾。

這首先要確保您具有一致的品牌準(zhǔn)則，然后才能付諸實(shí)踐。

這應(yīng)該詳細(xì)說(shuō)明您的字體樣式，顏色，圖像，圖標(biāo)和徽標(biāo)用法。沒(méi)有這個(gè)，品牌在設(shè)計(jì)頁(yè)面時(shí)很容易掙扎。您可能會(huì)開(kāi)始看到使用的任意顏色以及使用的各種字體樣式和大小，這反過(guò)來(lái)可能分散您的消息的注意力，或給試圖進(jìn)行轉(zhuǎn)換的人們?cè)斐梢曈X(jué)混亂。

避免過(guò)多的頁(yè)面動(dòng)畫(huà)或交互也很重要。如果您滾動(dòng)瀏覽頁(yè)面，并且看到每個(gè)按鈕都有跳動(dòng)或每個(gè)圖標(biāo)部分都有各自的動(dòng)畫(huà)，則可能會(huì)感到不知所措，使他們無(wú)法閱讀頁(yè)面上的內(nèi)容。

在查看一個(gè)站點(diǎn)時(shí)，我們注意到的第一件事是顏色。 一方面，使用它們的方式使用戶(hù)難以決定他們的眼睛應(yīng)該去哪里。它應(yīng)該是兩個(gè)紅色按鈕之一嗎？好吧，還是導(dǎo)航的頂部？

您需要弄清楚用戶(hù)到達(dá)頁(yè)面時(shí)希望其注意力轉(zhuǎn)移到哪里，以及自然需要遵循的順序。當(dāng)前的這種顏色布置在實(shí)現(xiàn)此目的時(shí)產(chǎn)生干擾。

其次，有些網(wǎng)站區(qū)域的間距不一致。如果增加了文本周?chē)萜鞯膶挾龋瑒t可以很容易地將其固定。 在標(biāo)題下方的灰色部分，它們以一個(gè)按鈕（上下文不多）開(kāi)頭，并感覺(jué)被夾在圖像頂部。作為用戶(hù)，我想知道它是否應(yīng)該在下面留有空間，或者是否應(yīng)該直接與圖像相關(guān)。網(wǎng)站是否加載錯(cuò)誤？這種內(nèi)部辯論引起混亂。

讓我們看一個(gè)提供更好的用戶(hù)體驗(yàn)并遵守品牌準(zhǔn)則的頁(yè)面。







在我們的上方，有IT領(lǐng)域的一家公司Communication Square。乍看之下，該網(wǎng)站使用的外觀更加簡(jiǎn)潔，色彩更醒目，空白更多。

在顏色方面，我們喜歡Communication Square有兩種按鈕顏色，一種用于優(yōu)先級(jí)較低的頂部或漏斗中的操作（藍(lán)色），另一種用于漏斗底部的操作（橙色）。結(jié)果，我立即注視著橙色，這是他們希望我采取的更重要的措施。

它們的字體也更具凝聚力，看起來(lái)只有一個(gè)字體家族，以淺，中或粗體使用。這樣可以創(chuàng)建均勻性并使所有內(nèi)容都能很好地協(xié)同工作。

總體而言，幻燈大圖幾乎沒(méi)有分散注意力的空間?；脽舸髨D本身并不太詳細(xì)，并用白色覆蓋層遮蓋，這使內(nèi)容脫穎而出，而不是消失在圖像中。

此類(lèi)詳細(xì)信息確實(shí)有助于改善您的整體網(wǎng)站體驗(yàn)，并幫助您的用戶(hù)更好地了解您想要他們做的事情，從而減少混亂。

3.添加社會(huì)證明

如果您在天貓或京東上時(shí)像大多數(shù)人一樣購(gòu)物，那么您很可能會(huì)偏愛(ài)那些寫(xiě)有四到五星級(jí)評(píng)論的產(chǎn)品。

通過(guò)查看這些評(píng)論，我們獲得了對(duì)產(chǎn)品的信任，相信它會(huì)按承諾執(zhí)行我們需要做的事情，這反過(guò)來(lái)又促使我們購(gòu)買(mǎi)它。

同樣的效果適用于您的產(chǎn)品或服務(wù)以及網(wǎng)站。如果用戶(hù)從真實(shí)的人那里看到有影響力的推薦，則研究表明，您的潛在客戶(hù)購(gòu)買(mǎi)產(chǎn)品的可能性要高58％。

但是，您的推薦信息在外觀上應(yīng)該如何看待，以便他們?cè)诳吹接脩?hù)時(shí)能與用戶(hù)建立有效的信任關(guān)系？

好吧，您可以采取一些策略。但是首先，您需要考慮想要哪種格式的證明書(shū)，文本或視頻。從歷史上看，視頻推薦是最好的。這是因?yàn)榻橘|(zhì)自然可以使用戶(hù)的注意力保持更長(zhǎng)的時(shí)間，并且還可以建立更牢固的人際關(guān)系，從而能夠聽(tīng)到聲音并看到真實(shí)人的面孔。

您還可以選擇文本推薦信息，但是，如果正確設(shè)計(jì)和合并，它仍將有助于建立與用戶(hù)的信任。

Upland Adestra是英國(guó)的企業(yè)電子郵件和營(yíng)銷(xiāo)自動(dòng)化軟件公司。他們?cè)趥€(gè)人鑒定頁(yè)上有四個(gè)視頻，每個(gè)視頻都包含在各自的部分中。







Upland并沒(méi)有將所有視頻隨意地放置在一起，而是將它們分開(kāi)，并在它們的旁邊加上標(biāo)題和句子，詳細(xì)說(shuō)明了結(jié)果或客戶(hù)與他們合作所獲得的收益?，F(xiàn)在，用戶(hù)可以了解他們將在視頻中聽(tīng)到的內(nèi)容。

我們喜歡一些視頻如何顯示某人講話(huà)的縮略圖，從而從視覺(jué)上使用戶(hù)放心，他們可能會(huì)從客戶(hù)那里聽(tīng)到自己的聲音，而不是觀看基于文本的視頻。

如果您還沒(méi)有像Upland這樣的客戶(hù)推薦視頻，那么您可能會(huì)找到一個(gè)案例研究頁(yè)面，您可以在其中詳細(xì)討論為幫助客戶(hù)所做的一切。

Zenefits在其網(wǎng)站上做了出色的工作。







每張卡都設(shè)計(jì)有圖像，以展示該公司的成員，這比他們使用圖庫(kù)照片或僅使用徽標(biāo)的圖片更值得信賴(lài)。

而且由于他們有五頁(yè)方案內(nèi)容，因此他們?cè)陧?yè)面頂部添加了一個(gè)過(guò)濾器，該過(guò)濾器使用戶(hù)可以細(xì)分要尋找的行業(yè)或解決方案類(lèi)型?，F(xiàn)在，用戶(hù)可以更快地找到他們想要的案例研究類(lèi)型。







最后，如果您的站點(diǎn)僅包含文本證明而沒(méi)有案例研究，則在設(shè)計(jì)它們時(shí)需要注意一些方面。

例如，您不能僅將一組文字推薦和一個(gè)名稱(chēng)放在一處。這些將不太可能被視為事實(shí)，因?yàn)檫@會(huì)讓用戶(hù)懷疑他們?cè)谑裁垂竟ぷ?，他們的職稱(chēng)是什么，以及該人的形像（以視覺(jué)方式確認(rèn)該人可能是真實(shí)的）。

在Drift網(wǎng)站上查看此推薦部分。







在他們的情況下，他們使用推特評(píng)論，但您可以輕松地使用不使用Twitter feed的內(nèi)容來(lái)補(bǔ)充此布局。

無(wú)論它們來(lái)自Twitter，本部分都可以使您完成很多事情。第一，由于采用了興趣樣式，因此可以立即查看大量評(píng)論。

其次，推薦信息中包含照片和人物/公司名稱(chēng)，從而使評(píng)論更加合法。

如果要在您的網(wǎng)站上加入推薦信息，那么在您的主頁(yè)，服務(wù)頁(yè)或?qū)Ш街芯蛻?yīng)包含的專(zhuān)用客戶(hù)推薦信息。對(duì)于正在了解您的公司并考慮購(gòu)買(mǎi)的人們，這些頁(yè)面中的每一個(gè)都是最佳的接觸點(diǎn)。

只要是真實(shí)的推薦，推薦就可以在您成為客戶(hù)之前改善您網(wǎng)站的體驗(yàn)并贏得潛在客戶(hù)的信任。

4.實(shí)施號(hào)召性用語(yǔ)

一旦訪(fǎng)問(wèn)者登陸您的網(wǎng)站（可能通過(guò)主頁(yè)），您就需要引導(dǎo)他們?cè)L問(wèn)網(wǎng)站上的位置，以幫助他們進(jìn)行轉(zhuǎn)化。人們很懶惰，所以對(duì)他們來(lái)說(shuō)很容易。為他們指明正確的方向，這樣他們就不必為找到想要的東西而費(fèi)勁。

考慮到這一點(diǎn)，改善網(wǎng)頁(yè)設(shè)計(jì)的最佳方法之一是在導(dǎo)航的右上角，需要采取措施的部分以及網(wǎng)站頁(yè)面的底部等區(qū)域使用策略性的號(hào)召性用語(yǔ)。

但是不要忘了您的買(mǎi)家旅程。在您的網(wǎng)站上要做的一件簡(jiǎn)單的事情是，無(wú)論用戶(hù)身在何處，都可以通過(guò)最底層的渠道號(hào)召性用語(yǔ)（BOFU）來(lái)淹沒(méi)用戶(hù)，但如果有人不愿意購(gòu)買(mǎi)，那么他們很可能不會(huì)采取任何措施。完全沒(méi)有

相反，您應(yīng)該根據(jù)他們正在查看的頁(yè)面與您的用戶(hù)見(jiàn)面。

例如，如果他們?cè)诰W(wǎng)站上，了解用于構(gòu)建自定義壁櫥的材料，則此人更有可能仍在自我教育并意識(shí)到自己的問(wèn)題。與其給他們一個(gè)“聯(lián)系我們”號(hào)召性用語(yǔ)，不如給他們看一個(gè)有關(guān)定制壁櫥建筑材料的綜合指南。他們將更可能轉(zhuǎn)換，因?yàn)檫@是當(dāng)前的擔(dān)憂(yōu)。

看看一個(gè)現(xiàn)實(shí)的例子。

標(biāo)題為“建設(shè)一個(gè)企業(yè)網(wǎng)站需要多少錢(qián)呢？”。接觸本文的讀者可能會(huì)考慮改版網(wǎng)站，并試圖確定這是否對(duì)他們而言是最佳決定。因此，只有向他們展示一個(gè)號(hào)召性用語(yǔ)來(lái)幫助他們了解更多信息才有意義。

我們提供給他們的報(bào)價(jià)是改版您的網(wǎng)站的最終指南，希望他們可以在一個(gè)地方找到幾乎所有所需內(nèi)容的答案。







這些類(lèi)型的優(yōu)惠還具有與用戶(hù)建立信任的好處。如果通過(guò)這些工作來(lái)教育他們，他們將開(kāi)始把您的公司視為思想領(lǐng)袖，使他們對(duì)研究您的服務(wù)感到更加自在。

5.使用正確的庫(kù)存圖片

我們始終建議您在網(wǎng)站上使用原始攝影作品，但是，如果這不是一種選擇，則可以使用一些技巧來(lái)幫助選擇正確類(lèi)型的照片。

盡管庫(kù)存照片可以節(jié)省您生成自己的圖像的時(shí)間，但許多網(wǎng)站上的圖像還是陳詞濫調(diào)。您還會(huì)發(fā)現(xiàn)許多其他網(wǎng)站可能都在展示相同的圖像，這當(dāng)然對(duì)您的信譽(yù)沒(méi)有幫助。

用戶(hù)將潛意識(shí)地質(zhì)疑您的圖片，從而減少信任并增加轉(zhuǎn)換過(guò)程中的難度。

因此，選擇庫(kù)存照片時(shí)，請(qǐng)盡量遠(yuǎn)離這些俗氣的圖像。這些照片是人們過(guò)度夸張的笑容，集體看著相機(jī)的照片，穿著華服的高管，一群人在空中跳躍的照片。

您是什么時(shí)候在現(xiàn)實(shí)生活中見(jiàn)過(guò)這種情況的人？

而是尋找在光線(xiàn)充足的環(huán)境中描繪逼真的場(chǎng)景的照片。這可能是辦公室里的人們?cè)谏虅?wù)休閑服裝的會(huì)議桌上，在筆記本電腦上打字的人的肩膀鏡頭，在白板上畫(huà)畫(huà)的人在開(kāi)放的房間里談話(huà)。這些是其他人將開(kāi)始認(rèn)可為合適的場(chǎng)景。在真實(shí)的環(huán)境中而不是在工作室中尋找真實(shí)的圖像。

因此，不要像這樣使用照片：







由于上述原因而感到不切實(shí)際，請(qǐng)嘗試使用以下照片：







找到喜歡的照片后，應(yīng)通過(guò)TinEye將其運(yùn)行，以了解多少人在其網(wǎng)站上使用該照片。如果數(shù)量是數(shù)千，那么最好使用更不常見(jiàn)的照片。

這將有助于為您的品牌帶來(lái)更多真實(shí)感，并確保圖像與您的身份和內(nèi)容的解釋相符。

如果您發(fā)現(xiàn)自己在網(wǎng)站上獲取更多逼真的照片時(shí)遇到麻煩，還可以聯(lián)系浪知潮，以獲得一些很棒的圖庫(kù)網(wǎng)站建議。

更加注意您的攝影將有助于更好地代表您的品牌以及您希望別人如何看待它。

6.有組織的導(dǎo)航

在設(shè)計(jì)網(wǎng)站時(shí)，導(dǎo)航是關(guān)鍵。本質(zhì)上，它是顯示用戶(hù)可以訪(fǎng)問(wèn)的核心地點(diǎn)的地圖。用戶(hù)可以通過(guò)這種方式輕松地更深入地研究您的服務(wù)，產(chǎn)品等領(lǐng)域。

沒(méi)有比導(dǎo)航界面混亂的網(wǎng)站更糟糕的了。糟糕的設(shè)計(jì)實(shí)踐（例如，過(guò)度使用導(dǎo)航，使用模糊或混亂的超文本以及缺乏組織）可能會(huì)使訪(fǎng)問(wèn)者很難找到他們想要去的地方。

如果用戶(hù)找不到所需的內(nèi)容，則沒(méi)有理由留在您的網(wǎng)站上。相反，他們一定會(huì)退出并找到可以提供更好用戶(hù)體驗(yàn)的競(jìng)爭(zhēng)對(duì)手。

在改善網(wǎng)站的導(dǎo)航時(shí)，重要的是要確保訪(fǎng)問(wèn)者可以輕松找到他們想要的東西。這將包括簡(jiǎn)化的內(nèi)容，導(dǎo)航層次結(jié)構(gòu)和響應(yīng)式設(shè)計(jì)，因此體驗(yàn)不會(huì)在移動(dòng)設(shè)備上發(fā)生巨大變化。

以Zendesk的導(dǎo)航為例，其中包含您想在其網(wǎng)站上訪(fǎng)問(wèn)的最重要的信息。產(chǎn)品，定價(jià)（這是必須的），服務(wù)和資源。







每個(gè)導(dǎo)航項(xiàng)都有足夠的空間，因此很清楚分隔的位置。

在某些情況下，如上圖所示，菜單項(xiàng)甚至將具有描述性行，以為該頁(yè)面的目的提供更多上下文。懸停效果還使用戶(hù)清楚這些鏈接是鏈接，它們將導(dǎo)致他們轉(zhuǎn)到另一個(gè)頁(yè)面。

只需單擊一下，用戶(hù)即可輕松到達(dá)這些地方，因此請(qǐng)確保您正在制定類(lèi)似的策略（而不會(huì)使導(dǎo)航超載）。

像這樣的干凈且有條理的導(dǎo)航使用戶(hù)知道您希望它們?cè)谀木W(wǎng)站上移動(dòng)時(shí)很輕松，并且沒(méi)有什么可隱藏的。因此，您的用戶(hù)在會(huì)話(huà)期間更有可能訪(fǎng)問(wèn)更多頁(yè)面，從而增加了他們?cè)谀木W(wǎng)站上花費(fèi)的時(shí)間。

7.讓您的訪(fǎng)問(wèn)者在您的主頁(yè)上滾動(dòng)

曾經(jīng)有一段時(shí)間，我們對(duì)于使我們的網(wǎng)站頁(yè)面（尤其是您的首頁(yè)）過(guò)長(zhǎng)感到不適。這是出于對(duì)用戶(hù)不會(huì)滾動(dòng)的擔(dān)心，因此它迫使人們嘗試將可能的內(nèi)容塞入與用戶(hù)一起查看其網(wǎng)站的最常見(jiàn)的屏幕尺寸。

但是那些日子早已一去不復(fù)返了。在尼爾森·諾曼集團(tuán)（Nielsen Norman Group）于2018年進(jìn)行的一項(xiàng)研究中，網(wǎng)站頁(yè)面上74％的觀看時(shí)間是花在前兩個(gè)屏幕上的，水平方向最大為2160px。因此，無(wú)需擔(dān)心會(huì)創(chuàng)造出更強(qiáng)大的非常規(guī)體驗(yàn)。

利用您的首頁(yè)來(lái)發(fā)揮自己的優(yōu)勢(shì)。 一個(gè)好的經(jīng)驗(yàn)法則是包括三到五個(gè)部分，以幫助將新用戶(hù)和經(jīng)常性用戶(hù)引導(dǎo)到您網(wǎng)站的關(guān)鍵區(qū)域。

這些部分應(yīng)該是什么？此列表可能會(huì)永遠(yuǎn)存在，但是一些更關(guān)鍵的元素的快速列表包括：

• 價(jià)值主張
• 介紹視頻
• 服務(wù)概述
• 產(chǎn)品特點(diǎn)
• 關(guān)于貴公司
• 感言
• 案例研究/成功案例
• 內(nèi)容

Zenefits在這些點(diǎn)上做得很好。







主頁(yè)提供了一種體驗(yàn)，可帶您簡(jiǎn)要了解該工具，其平臺(tái)的功能，推薦和以演示為目的的號(hào)召性用語(yǔ)。

到頁(yè)面結(jié)尾，用戶(hù)對(duì)Zenefits可以為他們做些什么以及客戶(hù)如何喜歡使用該平臺(tái)有了一個(gè)全面的想法。

8.不要害怕空白

空白是必不可少的設(shè)計(jì)元素，可幫助您分解頁(yè)面并提高可讀性?？瞻卓臻g也稱(chēng)為“負(fù)空間”，是指頁(yè)面上元素為空且缺少內(nèi)容或視覺(jué)項(xiàng)的區(qū)域。

空白在網(wǎng)站元素的設(shè)計(jì)過(guò)程和定位中也起著重要作用。雖然更多的空白可以指示哪些部分是分開(kāi)的并引導(dǎo)眼睛，但是更少的空白可以指示哪些元素由于其鄰近而應(yīng)該相互關(guān)聯(lián)。

Vidyard一直在此方面做得很好。它們的各個(gè)部分總是大方地分開(kāi)，因此它們很好地適合您的視窗，而不會(huì)受到上面或下面任何部分的過(guò)多擁擠。







這使用戶(hù)可以逐個(gè)關(guān)注網(wǎng)站頁(yè)面的每個(gè)部分，并立即讓他們知道每個(gè)部分的開(kāi)始和結(jié)束位置。這可以幫助引導(dǎo)用戶(hù)注意重要信息，例如號(hào)召性用語(yǔ)或價(jià)值主張。

9.必須進(jìn)行移動(dòng)優(yōu)化

這些天來(lái)，至關(guān)重要的是，您需要花一些時(shí)間來(lái)優(yōu)化移動(dòng)網(wǎng)站。

如果您還不知道，則有80％的互聯(lián)網(wǎng)用戶(hù)擁有智能手機(jī)，“ Google表示61％的用戶(hù)不太可能返回訪(fǎng)問(wèn)困難的移動(dòng)網(wǎng)站，而有40％的用戶(hù)訪(fǎng)問(wèn)競(jìng)爭(zhēng)對(duì)手的網(wǎng)站。”

如果我是你，我會(huì)有點(diǎn)擔(dān)心。

但這不只是視覺(jué)響應(yīng)。量身定制網(wǎng)站以滿(mǎn)足訪(fǎng)問(wèn)者的需求是必要的。問(wèn)問(wèn)自己，為什么有人會(huì)通過(guò)移動(dòng)設(shè)備訪(fǎng)問(wèn)我的網(wǎng)站？他們會(huì)尋找什么？我的經(jīng)驗(yàn)?zāi)壳笆欠裨试S他們輕松地完成這些事情？

以Chili的網(wǎng)站為例，您可以清楚地看到臺(tái)式機(jī)和移動(dòng)網(wǎng)站的相似之處。因此，當(dāng)用戶(hù)隨著時(shí)間的推移在兩個(gè)訂單之間來(lái)回切換時(shí)，兩者之間的相似之處使使用者變得很熟悉。

他們還可以輕松地在其網(wǎng)站上進(jìn)行核心任務(wù)，即點(diǎn)菜。所需的按鈕始終顯示在移動(dòng)網(wǎng)站上的屏幕上，因此您可以在準(zhǔn)備就緒時(shí)進(jìn)行訂購(gòu)，而不必進(jìn)入一個(gè)完全不同的頁(yè)面。

10.輕松找到定價(jià)

告訴我您是否熟悉這種情況。

您當(dāng)前正在在線(xiàn)尋找新的SaaS產(chǎn)品來(lái)解決您遇到的問(wèn)題。對(duì)于這個(gè)故事，我們假設(shè)一個(gè)項(xiàng)目管理工具。

您花了一個(gè)小時(shí)來(lái)在兩個(gè)軟件中進(jìn)行選擇，并認(rèn)為您終于找到了一個(gè)看起來(lái)不錯(cuò)的軟件。考慮到這一點(diǎn)，您現(xiàn)在嘗試查找價(jià)格。

因此，您僅單擊定價(jià)頁(yè)面即可到達(dá)看起來(lái)像這樣的頁(yè)面：







在這一點(diǎn)上，您可能有點(diǎn)沮喪。您甚至可能想知道這是否太昂貴了。他們到底想隱藏什么？為什么需要打電話(huà)問(wèn)？

因此，現(xiàn)在您決定離開(kāi)網(wǎng)站，看看競(jìng)爭(zhēng)對(duì)手。

如果您的網(wǎng)站遵循類(lèi)似的模式，或更糟糕的是根本沒(méi)有定價(jià)頁(yè)面，那么您將按照相同的心態(tài)找到用戶(hù)。

我們無(wú)法強(qiáng)調(diào)您的網(wǎng)站上包括定價(jià)在內(nèi)的重要性?？梢允乖L(fǎng)問(wèn)者能夠完成購(gòu)買(mǎi)選擇，從而防止您的銷(xiāo)售團(tuán)隊(duì)將時(shí)間浪費(fèi)在不匹配的人上。

您可能會(huì)擔(dān)心競(jìng)爭(zhēng)對(duì)手會(huì)試圖了解您的價(jià)格，或者定價(jià)太過(guò)復(fù)雜而無(wú)法在您的網(wǎng)站上顯示，但實(shí)際上，您應(yīng)該更多地?fù)?dān)心如何正確地向潛在客戶(hù)宣傳定價(jià)的原由和您能提供的價(jià)值。

如果某人只是在尋找最便宜的價(jià)格，無(wú)論如何他們可能都不適合您?？紤]到這一點(diǎn)，讓我們看一個(gè)確實(shí)使定價(jià)在其網(wǎng)站上脫穎而出的網(wǎng)站。Trello使用戶(hù)極其容易地確定出最適合他們的價(jià)格等級(jí)以及將給用戶(hù)帶來(lái)的價(jià)格。







定價(jià)表具有每個(gè)層下面的功能，因此比較每個(gè)層就像從左到右閱讀一樣簡(jiǎn)單。最后一層使用的綠色按鈕還有助于吸引人們注意那些更理想的選擇。

11.創(chuàng)造自我選擇的體驗(yàn)

很多人在線(xiàn)購(gòu)物時(shí)都會(huì)有“選擇困難癥”，當(dāng)客戶(hù)找到可以幫助自我選擇正確事物的工具時(shí)，那會(huì)有多高興呢！

這些稱(chēng)為自我選擇工具的工具會(huì)帶給用戶(hù)一系列問(wèn)題，以得出特定類(lèi)型的結(jié)果。這些結(jié)果可以是定制的報(bào)價(jià)，產(chǎn)品，也可以是對(duì)非常高級(jí)的問(wèn)題的答案（例如，“我的性格類(lèi)型是什么？”）。

這樣的工具可以使人們非常容易地了解最適合他們的產(chǎn)品或服務(wù)，而無(wú)需瀏覽您的網(wǎng)站來(lái)找到答案。

我最喜歡的看似簡(jiǎn)單的工具是網(wǎng)站某些項(xiàng)目下方的Amazon產(chǎn)品推薦選擇器。每當(dāng)您豎起大拇指或拒絕顯示的任何內(nèi)容時(shí)，該工具都會(huì)立即更改供稿中顯示的其他產(chǎn)品，認(rèn)為它更接近您要尋找的產(chǎn)品。













使用詳細(xì)的圖標(biāo)，用戶(hù)可以選擇最適合自己情況的選項(xiàng)，從而為他們提供最佳產(chǎn)品。這為用戶(hù)節(jié)省了無(wú)數(shù)小時(shí)搜索網(wǎng)站的時(shí)間，也省去了致電銷(xiāo)售代表的麻煩。

同樣，您越快獲得潛在客戶(hù)對(duì)他們正在尋找的東西的興趣，他們就可能會(huì)更快地購(gòu)買(mǎi)它。

盡管這可能是以后的項(xiàng)目，但它是一個(gè)有價(jià)值的工具，最終將幫助您的公司與競(jìng)爭(zhēng)對(duì)手區(qū)分開(kāi)來(lái)，并在您的業(yè)務(wù)領(lǐng)域提供獨(dú)特的體驗(yàn)。

12.測(cè)試并迭代

您的網(wǎng)站必須是公司不斷發(fā)展的一部分，而不是一成不變的?？赡芸倳?huì)有改進(jìn)的余地。改善網(wǎng)站的某些區(qū)域可以幫助改善轉(zhuǎn)化率，頁(yè)面停留時(shí)間和每個(gè)會(huì)話(huà)的頁(yè)面數(shù)，但是要知道哪種解決方案可能對(duì)改善網(wǎng)站最有效。

這是運(yùn)行A / B測(cè)試的地方。采用頁(yè)面的兩個(gè)變體進(jìn)行相互測(cè)試可以揭示某些區(qū)域是否為您的用戶(hù)造成了問(wèn)題。

在某些情況下，您的網(wǎng)頁(yè)可能效果不錯(cuò)，但是包含過(guò)時(shí)的信息。對(duì)頁(yè)面進(jìn)行A / B測(cè)試可以顯示頁(yè)面內(nèi)容對(duì)會(huì)話(huà)時(shí)長(zhǎng)或轉(zhuǎn)換的影響。

在其他情況下，您可能希望查看設(shè)計(jì)更新是否會(huì)影響頁(yè)面的性能。簡(jiǎn)單的更改（例如按鈕顏色，標(biāo)題或精煉文本）可能會(huì)在轉(zhuǎn)換率方面產(chǎn)生令人難以置信的差異。

話(huà)雖如此，除了采取“一勞永逸”的方法外，尤其是如果您不知道要更改什么，您可以使用工具為它們創(chuàng)建A / B測(cè)試，多變量測(cè)試，甚至設(shè)置熱圖以查看用戶(hù)的操作。

每個(gè)測(cè)試可以揭示各種數(shù)據(jù)，這些數(shù)據(jù)可以識(shí)別用戶(hù)為什么以特定方式與頁(yè)面進(jìn)行交互。

從這里開(kāi)始，我將每周或每?jī)芍鼙O(jiān)視這些測(cè)試和工具，以查看您所做的更改如何影響頁(yè)面性能。如果事情朝著錯(cuò)誤的方向發(fā)展，經(jīng)常檢查可以使您早日調(diào)整，而不是晚于調(diào)整。

我們建議您采用諸如Lucky Orange或Hotjar之類(lèi)的用于熱映射的工具，以及A / B測(cè)試工具（如VWO，Omniconvert或A / B Delicious）。

重要要點(diǎn)

花時(shí)間在網(wǎng)站上實(shí)施這些技巧可以帶來(lái)巨大的變化，可以幫助改善網(wǎng)站的性能，體驗(yàn)和客戶(hù)轉(zhuǎn)換率，但是一旦您掌握了這些技巧，您可能會(huì)認(rèn)為更應(yīng)該對(duì)您的網(wǎng)站進(jìn)行大范圍改版。

盡管網(wǎng)站改版是一個(gè)比較繁瑣的項(xiàng)目，但您并不孤單。因此，無(wú)論您不確定要改版網(wǎng)站還是應(yīng)該做的。這樣，當(dāng)需要進(jìn)行網(wǎng)站改版時(shí)，您將對(duì)需要做的事情更有信心。