一個強大的用戶體驗(UX)在你的網(wǎng)絡(luò)營銷成功是有幫助的。增加參與成果轉(zhuǎn)化為增加,轉(zhuǎn)化為更大的收入。

在本文中,我們將具體分析影響的程度的設(shè)計原則為用戶web頁面執(zhí)行,。

頁面的目標

是不夠的,那你說你想要一個優(yōu)秀的網(wǎng)站有良好的用戶體驗,。看到用戶體驗和用戶界面之間的區(qū)別在這里,。定義你的游客是非常重要的,你的業(yè)務(wù)應(yīng)該實現(xiàn)從web頁面,。它應(yīng)該明白你的目標和觀眾的目標可能不同,。訪問者的目標是尋找信息或下載的電子書,而你的目標可能包括增加接觸,形成充填量或下載,。關(guān)鍵是要平衡,為用戶創(chuàng)造一個雙贏的局面,您的業(yè)務(wù),。你的目標應(yīng)該幫助你建立如下:

• 目標受眾是誰?
• 如何制定有效的內(nèi)容嗎?
• 如何組織這個網(wǎng)站?
• 如何衡量網(wǎng)站的有效性?

為了理解營銷人員的視力是非常重要的關(guān)鍵團隊成員設(shè)計團隊在討論在線目標在一個組織,。

用戶映射旅程

User-journey映射是一個視覺或圖形表示的整個故事從用戶的第一觸點與你的組織,建立一個透視圖在你的服務(wù)或產(chǎn)品或品牌,通過各種媒介,與他們溝通。這個過程在本質(zhì)上是非常的敘述,需要一種基于文本的方法來描述客戶體驗的細微差別,。

故事從客戶的角度來看,而且為重視用戶的期望和業(yè)務(wù)需求之間的重要的十字路口,。這里有你需要的要點包括在用戶映射旅程

• 視覺的旅程。
• 了解現(xiàn)有的網(wǎng)站用戶行為的分析,。
• 理解交互元素,這將幫助他們實現(xiàn)他們的目標,。

視覺層次結(jié)構(gòu)

來源:http://edgemm.com

上面的圖片清楚地定義了視覺層次結(jié)構(gòu)的目的。視覺層次覆蓋幾乎所有設(shè)計的注意事項;但是它會給您的web頁面的重要元素重要性要吸引用戶的注意力,。一個健壯的視覺層次也組織類似的元素和組織成有意義的模式與觀眾進行一個有效的溝通過程,。一個設(shè)計師如何創(chuàng)造良好的視覺層次?嗯,他們只需要尋找,在他們的庫存!這里是關(guān)鍵組件:

• 大小:使用大小作為體系的工具是一個偉大的方式來指導他們網(wǎng)頁的關(guān)鍵部件。
• 顏色:顏色是一個很好的組織者,也注入個性,。大膽和對比色將需求的關(guān)注,。
• 對比:當觀眾看到的網(wǎng)頁是一個偏離,他們想知道更多關(guān)于它。你可以區(qū)分頁面的一個重要組成部分的核心內(nèi)容與對比色的幫助頁面,。
• 距離:在一個web頁面,如果有多個部分如何放置相關(guān)對象的部分就是定義了一個良好的距離,。這顯然有助于將類似的內(nèi)容。
• 密度和空格:當你網(wǎng)頁的填充部分人口,它看起來不利的用戶體驗,。同樣,保持太多的元素之間的空間會打破鏈接,。所以,需要被放置和分離的元素空格區(qū)分哪些元素是相關(guān)的,哪些不是。

f模式掃描

視覺符號文本標題等部分,高亮幫助用戶走捷徑而掃描通過web頁面和他們不需要閱讀一切,。當他們沒有發(fā)現(xiàn)這些信號,它們幫助自己,。用戶創(chuàng)建他們一會掃描網(wǎng)頁,如果他們想?yún)⑴c。根據(jù)這項研究由尼爾森諾曼集團,這種掃描行為的模式形成字母“f”的形狀

來源:季風咨詢

如果你想確保你的用戶的注意力被吸引到web頁面的最重要元素(號角,表格,圖片,視頻),強烈建議遵循F模式,并將相應(yīng)的元素,。

響應(yīng)設(shè)計

響應(yīng)設(shè)計就像一個拼圖!響應(yīng)頁面的網(wǎng)頁設(shè)計需要運動的各種元素,改變了最初的設(shè)計,。組織元素適應(yīng)可能是一個巨大的挑戰(zhàn)與反應(yīng)設(shè)計更大的頁面和它們的元素將不得不收縮適合在狹窄的平臺手機或平板電腦。我們已經(jīng)列出了一些重要的注意事項如下:

• 考慮一個移動先行”戰(zhàn)略,。
• 包括一個漢堡可折疊菜單(或相似的)多個項目,。
• 優(yōu)化圖像的所有類型的設(shè)備(臺式機、智能手機,、平板電腦),。
• 為移動設(shè)備優(yōu)化的內(nèi)容作為桌面的內(nèi)容會占據(jù)太多空間。
• 檢查加載速度一旦頁面是生活和檢查某些設(shè)計組件是否減少加載速度,。
• 實現(xiàn)谷歌的AMP(加速移動頁),旨在優(yōu)化手機內(nèi)容加載時間,。

號角

號角在提高你的網(wǎng)站轉(zhuǎn)換起著至關(guān)重要的作用。單一的文字-動作被授權(quán)與責任來吸引注意力,后來被點擊。這兩個因素對高投資回報率將比賽你的網(wǎng)站,。那么,文字-動作的關(guān)鍵原則,設(shè)計師需要考慮嗎?

• 大小:決定文字-動作的大小,確保它被注意到在web頁面上的其他元素,。如果下面的文字-動作按鈕應(yīng)放置形式,大小應(yīng)該等于字段的形式。
• 文本:如果營銷人員決定在各個頁面的文本部分,他們應(yīng)該與設(shè)計師溝通,。這將幫助他們在決定理想的大小,。
• 顏色:色發(fā)揮70%的作用在吸引觀眾的注意力。確保它從其余的部分智能使用的顏色,。
• 按鈕形狀:如果有不同的部分和較小的對象在一個網(wǎng)頁,你瀟灑地如何定義一個按鈕用雕刻的形狀是很重要的。確保形狀從其余的對象,。
• A / B測試:文字-動作的最佳實踐來衡量有效性是通過創(chuàng)建不同變體的色彩,文字,和字體,。監(jiān)控哪些cta更成功。在HubMonks我們插入CTA HubSpot的因為我們所有HubSpot的營銷工具的web開發(fā)項目,以便客戶能夠測量按鈕的性能,。

形式

形式和高級形式之間存在著巨大的差異,提高用戶體驗,。甚至形式有各種設(shè)計原則,幫助用戶了解其層次結(jié)構(gòu),幫助設(shè)計師包括與所有重要領(lǐng)域的利用更少的空間。

• 標簽對齊幫助用戶識別字段與相應(yīng)的標簽,。同軸度還消耗更少的空間,最終促進form-fills心理因素,。
• 占位符文本是一個偉大的創(chuàng)新形式,其中用戶可以看到里面的標簽場消失一旦用戶將光標在盒子上。

認知負荷

在網(wǎng)頁設(shè)計中認知負荷是指思維過程的一個人給他們從事買方的旅程,。認知負荷理論是有區(qū)別的兩種類型的用戶體驗:

• 內(nèi)在認知負荷:它指的是最小的使用副本,這樣用戶不會阻礙從web頁面上完成特定的任務(wù),。
• 有密切關(guān)系的認知負荷:它指的是努力致力于處理信息以及用戶如何理解信息的模式由精神組織類別的信息和任何關(guān)系。

?？怂苟?/span>

來源:我的網(wǎng)站審計

設(shè)計師可以解釋本法的市場營銷人員,這樣用戶不會被太多的信息或選擇,。希克斯定律告訴我們,一個人的時間做出決定的數(shù)量取決于他或她的選擇,。看到更多的心理學的原則.

交互設(shè)計

來源:colossom.com

交互設(shè)計致力于創(chuàng)造引人入勝的接口與預(yù)測用戶行為,。至關(guān)重要的是了解用戶和技術(shù)交流。這里有一些問題,你應(yīng)該考慮在設(shè)計最好的交互:

• 用戶如何互動?網(wǎng)站的哪些部分將與鼠標,用戶互動的手指,還是筆?
• 線索將方便用戶進行交互?顏色,、大小,、形狀、文本將區(qū)分對象和幫助用戶理解這些交互點,。
• 一次是分成七項的信息嗎?用戶傾向于只保留五九”項目在他們的短期記憶,。
• 是網(wǎng)站的各個部分分化的幫助下棱角嗎?元素,如菜單需要區(qū)分這些設(shè)計上的考慮。此外,他們形成一個邊界,手指或鼠標不能超越邊界,。

結(jié)論

用戶體驗的整個概念是圍繞目標用戶有一個清晰的理解,他們的需求,他們的價值觀,、能力和其局限性。