我們的 4 個最喜歡的提示,使您的網站更加移動友好
歡迎來到移動優化戰略系列,我們在行動裝置上分享所有功能! 這是該系列的第2部分。
第 1 部份: 贏得行動閱讀器競賽的 5 種可靠方法
幾乎每個移動網站都有某種導航。
在大多數情況下,它是通過縮小桌面網站並使其響應而創建的。但是,僅僅因為您的導航內置於回應式設計中,並不意味著它適合移動,並且針對移動 SEO 進行了優化。
例如,多級功能表可能會為桌面使用者提供積極的用戶體驗,但它們對移動網站來說卻是一種過度的殺傷,因為它們會使螢幕變得混亂,並會使訪問者感到困惑。
其核心是,移動導航應該是簡單、直觀和緊湊的 —-在有限的可用空間下,它不應該佔據太多的螢幕。此外,它應該允許訪問者快速找到他們想要的,沒有麻煩。
考慮到這一點,讓你的大腦進入齒輪,並使用這4個提示,使訪問者愛上你的移動網站:
1. 使用卡格線
因為行動使用者今天 快速搜尋資訊, 發佈者 應採用回應式佈局,使用卡網格滿足使用者期望。
卡網格正在推動移動導航遠離文本的牆壁組合在一起,走向有意義的資訊摘錄,聚合成一個連貫的體驗。
卡片可以包括文本描述、圖像或兩者,以平衡美觀性和良好的網站可用性。
說明:《衛報》提供最新的新聞故事 其移動存取者 使用一副卡片。通過文本連結佔用螢幕的微薄部分,可以實現相同的導航,但卡網格提供了全新的交互級別,而不僅僅是導航。還有什麼更好的方式在移動友好型網站上顯示所有最好的內容,而不是使用美觀的拋光形狀?
2. 使用搜尋列時
根據 MoovWeb的研究,搜索欄比移動上的搜索圖示更頻繁,56% 的移動網站具有公開的搜索欄。此外,搜索欄在暴露時可獲取的點擊數比摺疊的點擊數多 75%。
您應該透過在易於存取的位置放置搜尋欄來方便行動存取者搜索您的網站。最好是,您希望在導航功能表的頂部設置搜索欄,以便訪問者來到您的網站搜索特定資訊,他們可以快速找到它。
混搭接收了大量的流量 通過社交分享.該流量的很大一部分由 移動存取者 誰來的網站尋找具體的資訊。為了確保他們能夠輕鬆找到內容,Mashable 在螢幕右上角提供了搜索功能。Mashable 的搜尋功能很容易發現 - 確保您的搜尋功能也好!
3. 包括行動友好型共享按鈕
這似乎相當明顯;畢竟 65% 的數位媒體 在行動裝置上消費,以及大量的社交共用 發生在小螢幕上 以及。使 Facebook 共用, WhatsApp 共用,和其他社交媒體共用輕鬆為讀者,考慮添加 共用按鈕 到您的移動友好網站 - 這是一個萬無一失的方式吸引訪問者!要讓更多讀者關注我們的社交媒體配置檔,請安裝 Facebook 追蹤按鈕 或 Facebook Messenger 跟隨按鈕.
它不需要太多的努力 - 共用按鈕(與 分享按鈕 )像我們的是易於安裝,高度可定製,最重要的是,移動友好。
請記住:您的目標是實現流暢、直觀的導航,以增強訪客的體驗。與我們的 社交共用按鈕 您可以定製它們,使其在所有行動裝置上無縫運行。
只需選擇您的社交頻道,選擇對齊方式,選擇按鈕的大小,然後插入行動號召。此外,您可以請求移動預覽,以查看按鈕是否與您的導航很好地集成 - 稍作調整應允許您實現和諧。
4. 使導航觸控直觀
你知道一般的手指需要 約 44 像素 精確的水龍頭?
在行動裝置上,訪問者將使用更大、更笨拙的手指來導航螢幕,而不是尖尖的桌面箭頭。因此,您的導航應引導他們的觸摸,使其易於發現元素 - 使您的連結和按鈕明顯,並包含大量的空白。
將觸摸反饋納入移動友好型導航中也是一個好主意。反饋可以是字體更改、進度條、顏色閃爍或其他細微提示。此反饋可幫助用戶確信自己選擇了正確的專案。
採取 移動網站 例如,BBC新聞。當訪問者點擊導航欄中的專案時,該項會下劃下劃線。這有助於訪問者知道他們選擇了什麼選項,並讓他們有信心選擇正確的專案。您還將看到大量的空白和元素,邀請遊客的觸摸。總體而言,在移動螢幕最小化的環境中,導航在幫助人們找到正確答案方面做得很好。
隨著行動裝置占 Web 總流量的增加,因此對於 發佈者 以確保他們的網站不僅移動友好,而且移動直觀。
通過一些調整和增強的搜索功能,您將能夠吸引、參與和滿足使用者群中與內容進行即時交互的部分,同時通過共用按鈕最大化品牌曝光率。
