如何優化您的網站移動體驗以實現轉化
已發表: 2020-12-30五十一歲半。
這是通過移動設備上網的在線用戶的百分比。 有了這些可能性,您企業的大量潛在客戶很可能會通過 480 像素的屏幕來找您。 如果您未對網站的移動版本進行格式化、精簡信息,或者根本沒有移動版本,那麼您就錯失了轉換網站一半訪問者的機會。
您可能認為針對移動設備進行優化需要付出與構建另一個完全獨立的網站一樣多的努力。 但事實是,有很多簡單的方法可以讓您的網站更適合移動設備。 以下是創建可轉換網站的移動版本的一些提示和技巧。
極品飛車
速度是構建移動網站最重要的組成部分——這不僅僅是因為用戶會離開加載時間超過三秒的網站。 加載緩慢的網站跳出率較高,這意味著用戶不會按應有的時間參與內容,並且不太可能訪問您網站上的其他頁面(如聯繫頁面或結帳頁面)。
理想情況下,您希望您的網站在 2-3 秒或更短時間內加載。 有很多方法可以加速您的網站,但讓我們堅持那些會給它帶來最大提升的方法:
1.壓縮資源密集型文件
- 圖像對於設計來說是必不可少的,但將它們置於未壓縮狀態會大大降低您的網站速度。 有很多插件可以在後端壓縮圖像,或者您可以採用老派方法,在上傳之前在照片編輯器中將圖像壓縮到更易於管理的大小——這兩種方法都可以。 目標是在不犧牲它們在頁面上的顯示質量的情況下,使圖像和視頻佔用盡可能少的空間。
- 使用頁面構建器時很容易忽略 HTML、CSS 和 JavaScript 代碼。 但是這些文件通常包含冗餘行或空白行,從而降低您的站點速度。 我們建議使用 WP Rocket 之類的插件,只需單擊一下按鈕即可縮小這些文件。 或者,您可以自己檢查代碼。 看到任何空行了嗎? 刪除這些行不會影響網站的整體外觀,而且有助於消除一些臃腫,從而提高網站的性能。
2.考慮使用加速移動頁面(AMP)
AMP 都是關於速度和使信息易於讀者消化的。 AMP 插件最初是由谷歌開發的,目的是在訪問移動網站時為用戶提供更好的體驗。 網頁的 AMP 版本本質上是原始網頁的精簡 HTML 版本。 結果? 一個閃電般快速的網頁,具有更高的轉換概率。
響應式設計
如果您使用 WordPress 設計網站,您很可能已經安裝了一個主題來控制您網站的外觀。 不幸的是,並非所有主題都是平等的。
一些主題的不足之處之一是缺乏響應式設計。 響應式設計以適合各種屏幕尺寸的最佳方式組織信息和設計元素。 內置此功能的主題令人驚奇的是,它會自動發生,CSS 屬性內置在主題樣式表本身中。
如果您選擇具有內置響應式設計的主題,則針對移動設備優化您的網站會容易得多。 如果您當前的主題沒有此功能,這個包含14 個適合移動設備的 WordPress 主題的列表是開始尋找具有此功能的主題的好地方。
觸摸和可用性
訪問您的移動網站的用戶將通過拇指觸摸來瀏覽每個頁面。 提出這一點似乎很愚蠢,但牢記這一點將有助於您設計更好的移動網站。
- 拇指區:一篇關於我們如何握住我們的小工具的文章將拇指區稱為拇指可以更準確地掃過屏幕的區域。 在智能手機上觸及頁面的最頂部和最底部區域是最不舒適的。 作為網頁設計師,我們應該將轉換元素(我們希望他們觸摸的項目)放在用戶最容易操作的區域。
- “點擊”交互:使用移動設備時,用戶可以做兩件事:滑動以向下滾動頁面,輕輕點擊以與元素互動。 懸停時沒有動畫或顏色變化來讓用戶知道某些東西是可點擊的。 因為我們失去了那個元素,我們必須用其他方式來彌補它。 如果頁面上的某些內容是可點擊的,則它需要看起來更像移動設備上的按鈕。 或者,您可以在看起來不可點擊的項目下方添加按鈕,以指導用戶如何前進。
彈出窗口
在手機上訪問網站時,您是否遇到過無法點擊退出的彈出窗口? 要么“x”太小,要么稍微超出視野,無法點擊。 這些是移動網站上彈出窗口的常見問題。
解決方案很簡單:如果您在移動網站上使用彈出窗口,請花時間格式化並測試它們。 同樣的原則也適用於表單和按鈕。 移動設備上的所有彈出窗口的大小都必須適當。 您最不想要的是讓有意轉換的用戶被您的網站阻止這樣做。
保持內容簡單
1.提供清晰的路徑
在網站的桌面版上,通常會在標題中看到一個菜單,其中顯示每個關鍵頁面的鏈接。 移動用戶通常通過單擊彈出菜單的切換按鈕來獲得該選項。 這是確保訪問者能夠在重要主頁之間快速導航的一種方法,但作為網頁設計師,我們還有其他方法可以將他們引導到我們希望他們訪問的頁面——可轉換的頁面。
例如,許多電子商務網站在菜單旁邊放置一個購物車圖標。 這將購物車放在前面和中間,方便用戶查找和結帳。 銷售服務的網站可以使用聯繫按鈕。 這不僅進一步推進了將用戶轉化為客戶的目標,而且還有助於實現用戶的目標,因為它可以讓用戶輕鬆找到他們正在尋找的內容。
2. 以重要的事情為主導
目標是從您的網站產生轉化——在創建移動版本時請記住這一點。 這是一個較小的區域,因此不要將主要空間浪費在通常不會產生轉化的信息或頁面上。
在桌面站點上,您可以在不犧牲美觀的情況下輕鬆地容納三列有價值的信息。 在移動網站上,您很可能僅限於一列或兩列佈局。 有些用戶永遠不會一直向下滾動頁面。 這就是為什麼必須在頂部輕鬆訪問號召性用語 (CTA) 和用戶採取行動的機會。
3. 不要剝離網站
以鼓勵採取行動的信息為先並不意味著應該刪除其他所有內容。 網頁設計師有時很想完全剝離他們網站的移動版本,只留下桌面版本可用的一小部分信息。 這是個錯誤。 2019 年 7 月,谷歌宣布移動優先索引,這意味著谷歌在確定搜索結果排名時將首先查看您網站的移動版本。
2021 年 3 月是谷歌將移動優先索引作為所有網站標準的日期。 如果您在移動網站上留下重要信息,您可能會犧牲整體 SEO 策略。
那麼,如何在設計可讀性強、適合移動設備的網站的同時包含這些信息呢? 答案很簡單:重組。 將該信息移到其他不在首頁和中心的頁面,添加鏈接和按鈕,以便用戶仍然可以到達那裡,如果需要,甚至可以壓縮桌面版本。 只是不要在沒有穿外套的情況下將您網站的移動版本留在寒冷的室外。
不要失去一半的轉化
移動設備的使用量已經超過了桌面設備的使用量,並且每年都在持續增長。 確保您吸引潛在客戶業務的最佳方式是確保您的移動網站使流程變得簡單。
還記得我們之前提到的 51.5% 的用戶嗎? 好吧,他們還在外面。 問題是,你會藉此機會讓他們皈依嗎?