打造移動(dòng)網(wǎng)站友好用戶(hù)體驗(yàn)的12個(gè)技巧

2022-08-11    分類(lèi)： 網(wǎng)站建設(shè)

要知道，一個(gè)網(wǎng)站可以在移動(dòng)設(shè)備上瀏覽并不代表著這個(gè)網(wǎng)站在移動(dòng)設(shè)備上瀏覽的用戶(hù)體驗(yàn)是友好的。想了解如何讓您的移動(dòng)客戶(hù)擁有滿(mǎn)意的瀏覽體驗(yàn)，請(qǐng)遵循移動(dòng)專(zhuān)家、網(wǎng)頁(yè)設(shè)計(jì)與開(kāi)發(fā)專(zhuān)業(yè)人士的以下建議。
comScore統(tǒng)計(jì)顯示，截至2013年12月，有1.56億美國(guó)人擁有智能手機(jī)，比2013年9月份增長(zhǎng)了3％以上。預(yù)計(jì)這一數(shù)字將繼續(xù)增長(zhǎng)。事實(shí)上，eMarketer預(yù)測(cè)到2014年底，全球?qū)⒂?7.5億人經(jīng)常使用智能手機(jī)。
而且這數(shù)百萬(wàn)智能手機(jī)用戶(hù)不僅僅是使用移動(dòng)設(shè)備撥打電話(huà)、發(fā)送電子郵件和短信。他們還在使用他們的移動(dòng)設(shè)備連接社交網(wǎng)絡(luò)、上網(wǎng)瀏覽新聞和信息、購(gòu)物和下單。因此，如果您的網(wǎng)站或電子商務(wù)網(wǎng)站未針對(duì)移動(dòng)端流量進(jìn)行優(yōu)化，您可能會(huì)失去潛在的客戶(hù)和銷(xiāo)售線(xiàn)索。
為了找出“移動(dòng)端優(yōu)化”的真正要領(lǐng)，CIO.com詢(xún)問(wèn)了幾十名移動(dòng)網(wǎng)頁(yè)設(shè)計(jì)師和移動(dòng)網(wǎng)頁(yè)開(kāi)發(fā)專(zhuān)家。 以下是創(chuàng)建移動(dòng)友好網(wǎng)站的十二個(gè)技巧。
1.響應(yīng)式網(wǎng)站
物業(yè)管理軟件開(kāi)發(fā)商LandlordStation首席執(zhí)行官Copley Broer說(shuō)：“如果要使用響應(yīng)式的技術(shù)框架，目前的確有一些框架可供我們選擇，我們使用Bootstrap，這些框架基本上是通過(guò)比較簡(jiǎn)單的方法來(lái)布置網(wǎng)格中的元素，然后根據(jù)不同的屏幕尺寸調(diào)整該網(wǎng)格，使得大型監(jiān)視器上的元素與iPad（或智能手機(jī)）上的元素相同，“Broer 說(shuō)，“Bootstrap框架是開(kāi)源代碼（且免費(fèi)），有據(jù)可查，且易于實(shí)現(xiàn)。”
RITTA（一家廣告與營(yíng)銷(xiāo)機(jī)構(gòu)）的 COO Kevin Janosz補(bǔ)充說(shuō)：“響應(yīng)式是Web開(kāi)發(fā)的一種更統(tǒng)一的方法，無(wú)論用戶(hù)是通過(guò)桌面，平板還是智能手機(jī)訪問(wèn)網(wǎng)站，您都可以為用戶(hù)創(chuàng)建相似的優(yōu)質(zhì)瀏覽體驗(yàn)。
Janosz說(shuō)：“除了能夠在不同設(shè)備之間提供更好的用戶(hù)體驗(yàn)之外，它還整合了您的網(wǎng)站，因此您不需要單獨(dú)的移動(dòng)網(wǎng)址，它具有SEO優(yōu)勢(shì)，而且管理起來(lái)也容易一些。”
2.確保使用一根手指即可完成所有操作
EliteSEM（搜索引擎營(yíng)銷(xiāo)公司）營(yíng)銷(xiāo)總監(jiān)Marc Weisinger說(shuō)：“確保您的網(wǎng)站完全可以通過(guò)一個(gè)手指操作，并且不需要使用縮放動(dòng)作。”
“用戶(hù)能夠通過(guò)單手操作即可完成對(duì)整個(gè)網(wǎng)站的訪問(wèn)，這是任何移動(dòng)網(wǎng)站最重要的標(biāo)準(zhǔn)之一，此外，如果您發(fā)現(xiàn)必須進(jìn)行縮放，那么說(shuō)明您的網(wǎng)站可能文本字號(hào)太小或者與瀏覽設(shè)備無(wú)法很好的匹配，”Weisinger說(shuō)。
訪問(wèn)移動(dòng)網(wǎng)站的大多數(shù)用戶(hù)使用的是觸摸屏設(shè)備，因此要確保按鈕和菜單導(dǎo)航足夠大，即使是胖手指操作起來(lái)依然是游刃有余，“Hire Space（網(wǎng)站租用空間）CTO Dean Hume說(shuō)。 “友好體驗(yàn)的移動(dòng)端網(wǎng)站通常會(huì)使用CSS（媒體查詢(xún)media queries）來(lái)調(diào)整屏幕大小，而不考慮手指可能會(huì)導(dǎo)致的錯(cuò)誤點(diǎn)擊。”
同樣，“在設(shè)計(jì)移動(dòng)端界面時(shí)，您應(yīng)該使您的目標(biāo)范圍足夠大，以便輕松選擇，”Lyons咨詢(xún)集團(tuán)執(zhí)行創(chuàng)意總監(jiān)Mark Rattin說(shuō)。 “大多數(shù)成年人的平均食指是15到20毫米，對(duì)應(yīng)的是45到57像素，我們的‘經(jīng)驗(yàn)法則’（雙關(guān)語(yǔ)）是為選擇區(qū)域提供至少45個(gè)像素的按鈕或點(diǎn)擊元素，”他說(shuō)。 “這樣可以輕松選擇屏幕上的目標(biāo)，并從用戶(hù)體驗(yàn)中消除許多意外點(diǎn)擊。”
3.保持簡(jiǎn)約設(shè)計(jì)
“做一個(gè)簡(jiǎn)約設(shè)計(jì)和聚焦的版本需要花很多時(shí)間,“應(yīng)用設(shè)計(jì)和開(kāi)發(fā)公司Caxy Interactive的創(chuàng)始人兼CEO Michael LaVista指出,“記住，您只有幾秒鐘的時(shí)間來(lái)向用戶(hù)展示您是什么樣的公司。對(duì)于任何網(wǎng)站設(shè)計(jì)來(lái)說(shuō)都是這樣，尤其是在為較小設(shè)備進(jìn)行設(shè)計(jì)時(shí)注意這一點(diǎn)是很重要的。”
太多的通知消息和過(guò)多花哨的修飾（如圖形、文字、視頻）可能會(huì)阻礙該網(wǎng)站加載的速度，并分散您要傳達(dá)的主要信息。 Hume建議：“如果您想在網(wǎng)站中添加圖片，盡量提供字節(jié)較小的圖片，這樣可以減少用戶(hù)在等待頁(yè)面加載時(shí)所用的時(shí)間。”
4.保持內(nèi)容短小精致
“人們有時(shí)候常常會(huì)著迷于自己所撰寫(xiě)的內(nèi)容，一不留神就成了長(zhǎng)篇大論，網(wǎng)站小編自然也不例外，長(zhǎng)篇幅的文章會(huì)增加用戶(hù)的翻頁(yè)次數(shù)，對(duì)于移動(dòng)端的挑戰(zhàn)尤甚，” Broer說(shuō)，因此“我們需要花點(diǎn)功夫來(lái)琢磨如何用更精簡(jiǎn)的語(yǔ)言來(lái)表達(dá)相同的內(nèi)容。”
“內(nèi)容篇幅要有所節(jié)制，”電話(huà)服務(wù)提供商N(yùn)extiva的營(yíng)銷(xiāo)副總裁Yaniv Masjedi指出， “智能手機(jī)上的屏幕比臺(tái)式機(jī)上的屏幕小得多，所以盡量減少移動(dòng)網(wǎng)站上的文字?jǐn)?shù)量。移動(dòng)用戶(hù)習(xí)慣于快速向下滑動(dòng)瀏覽，所以只需包含必要的文字，抓住讀者的注意力即可。”
5.好的icon圖標(biāo)勝過(guò)千言萬(wàn)語(yǔ)
“為了避免您的網(wǎng)站看起來(lái)很混亂，請(qǐng)使用常規(guī)移動(dòng)icon圖標(biāo)，而不是通過(guò)文字來(lái)進(jìn)行通話(huà)咨詢(xún)、社交聯(lián)絡(luò)、尋找菜單等操作。”數(shù)字創(chuàng)意機(jī)構(gòu)FiddleflyCEO James Ramsey表示,“使用這些符號(hào)可以幫助用戶(hù)了解該網(wǎng)站是針對(duì)移動(dòng)設(shè)備的。”
6.通過(guò)為移動(dòng)設(shè)備配置優(yōu)化過(guò)的圖像來(lái)達(dá)到更快的訪問(wèn)速度
網(wǎng)絡(luò)設(shè)計(jì)機(jī)構(gòu)New Haircut CEO JayMelone指出：“移動(dòng)網(wǎng)絡(luò)比FiOS（光纖服務(wù)）和有線(xiàn)電視之類(lèi)的服務(wù)網(wǎng)絡(luò)要慢得多，特別是美國(guó)在LTE速度方面排名倒數(shù)第二，平均徘徊在6.5Mbps左右。
“所以一定要把PC端網(wǎng)站上存在的繁重的媒體文件（比如視頻）去掉。” Melone說(shuō)，“使用媒體查詢(xún)將PC端網(wǎng)站的圖像像素重新調(diào)整為較低分辨率版本，并考慮使用獨(dú)立JavaScript替換大型JavaScript庫(kù)（如jQuery Mobile）。
“移動(dòng)設(shè)備上的分辨率和寬高比變化范圍還是比較大的（范圍從240 x 320到2560 x 1440及以上不等）。”網(wǎng)絡(luò)和移動(dòng)應(yīng)用的圖像管理解決方案Cloudinary CEO Itai Lahan說(shuō)。
“還要考慮，在3G網(wǎng)絡(luò)下運(yùn)行的移動(dòng)設(shè)備在下載速度方面仍然相當(dāng)落后，而且許多移動(dòng)用戶(hù)都支付寬帶使用費(fèi)，所有這些都意味著，調(diào)整圖像大小，并使其適應(yīng)具體的設(shè)備分辨率和寬高比是至關(guān)重要的，“Lahan說(shuō)。 “這可以節(jié)省大量的帶寬，大大減少了移動(dòng)網(wǎng)頁(yè)的加載時(shí)間，同時(shí)大大提高了訪問(wèn)者的瀏覽體驗(yàn)。”
7.不要過(guò)度使用Java
Hume說(shuō)：“盡可能避免在您的移動(dòng)網(wǎng)站上使用過(guò)多的JavaScript代碼，因?yàn)樗诓煌臑g覽器和設(shè)備上運(yùn)行效果不同。 ”他說(shuō)，“即使是同一款手機(jī)的不同型號(hào)，在JavaScript方面也可能會(huì)有很大差異。“ “這并不是說(shuō)您不應(yīng)該使用JavaScript，而是說(shuō)應(yīng)該謹(jǐn)慎對(duì)待，并且要記住，它可能會(huì)影響到移動(dòng)端網(wǎng)站的性能和用戶(hù)體驗(yàn)。”
8.讓您的電話(huà)號(hào)碼、地址和聯(lián)系方式易于查找
Engage（一家全方位服務(wù)的設(shè)計(jì)和開(kāi)發(fā)公司）的創(chuàng)意總監(jiān)AnthonyOverkamp說(shuō)：“請(qǐng)記住您的網(wǎng)站在移動(dòng)設(shè)備上的使用環(huán)境。
Overkamp表示：“通常情況下，當(dāng)用戶(hù)正在尋找商店?duì)I業(yè)時(shí)間，聯(lián)系人或預(yù)訂電話(huà)號(hào)碼，或者是某企業(yè)距離最近的位置時(shí)，用戶(hù)越容易訪問(wèn)該信息并采取行動(dòng)，用戶(hù)體驗(yàn)就越好。
9.視頻該加還得加，但需精心布置
Invodo（視頻戰(zhàn)略和內(nèi)容提供商）營(yíng)銷(xiāo)副總裁Russ Somers表示：“視頻是任何移動(dòng)網(wǎng)站的絕對(duì)必需品。 這是因?yàn)槭褂靡苿?dòng)設(shè)備的消費(fèi)者比使用筆記本電腦/臺(tái)式機(jī)的用戶(hù)觀看視頻的可能性高三倍。”
也就是說(shuō)，“使用能夠提供完善移動(dòng)體驗(yàn)的視頻技術(shù)，您的移動(dòng)視頻播放器應(yīng)該運(yùn)行HTML5并確保它可以在大多數(shù)移動(dòng)設(shè)備上播放，”Somers建議， “此外，使用輕量級(jí)的視頻播放器（不消耗付費(fèi)的帶寬和處理資源），這樣您就可以顯著提高頁(yè)面加載時(shí)間，并為用戶(hù)提供更好的整體體驗(yàn)。”
10.確保表單是為移動(dòng)端而設(shè)計(jì)的
LucidFusion（網(wǎng)站設(shè)計(jì)和品牌公司）CEO Zubin Mowlavi表示：“要求用戶(hù)提供最少的必要信息，以便后續(xù)與潛在客戶(hù)聯(lián)絡(luò)。”
Mowlavi說(shuō)：“盡可能地減少表單字段的數(shù)量和大小，并利用移動(dòng)設(shè)備內(nèi)置的技術(shù)優(yōu)化可用性。例如，GPS通常是可以獲得用戶(hù)的城市和郵編的，如果您可以預(yù)先填寫(xiě)，就不需要再讓用戶(hù)填寫(xiě)他們所在的城市和郵編了。
11.考慮地理位置
“對(duì)移動(dòng)設(shè)備的一些功能如地理定位加以利用。 ” TheLevel （網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)機(jī)構(gòu)）的創(chuàng)始合伙人兼CEO Michael Read說(shuō)，“企業(yè)可以使用地理定位來(lái)引導(dǎo)用戶(hù)，允許訪客查看距離最近的商店中某商品是否有貨、提供有針對(duì)性的促銷(xiāo)活動(dòng)、以當(dāng)?shù)刎泿判问教峁┰诰€(xiàn)購(gòu)買(mǎi)價(jià)格，并連接到諸如Yelp等社區(qū)。
12.環(huán)境兼容性測(cè)試，確保您的內(nèi)容可以在不同的設(shè)備、平臺(tái)和操作系統(tǒng)上正確查看
“不要忘了要通過(guò)操作系統(tǒng)測(cè)試移動(dòng)端用戶(hù)體驗(yàn)，通過(guò)可用性測(cè)試來(lái)提高整體網(wǎng)站的用戶(hù)體驗(yàn)。” SMITH（數(shù)字體驗(yàn)機(jī)構(gòu)）的電子商務(wù)戰(zhàn)略副總裁Debbie Carkner說(shuō)，“推薦一些大家普遍使用的移動(dòng)測(cè)試工具包括Solidifyapp，UXRecorder，POP和delight.io。

網(wǎng)頁(yè)標(biāo)題：打造移動(dòng)網(wǎng)站友好用戶(hù)體驗(yàn)的12個(gè)技巧
轉(zhuǎn)載來(lái)源：http://www.bm7419.com/news45/188645.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供做網(wǎng)站、電子商務(wù)、python、Google、外貿(mào)建站、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)公司