無線端頁面設(shè)計“三大雷區(qū)”
以前大家習(xí)慣用電腦PC淘寶,現(xiàn)在人們習(xí)慣用手機淘寶,因為無時無刻都能淘!所以手機端頁面設(shè)計也是很重要的。
手機端頁面的設(shè)計有許多的規(guī)范,大到涉及整個頁面的排版呈現(xiàn)方式,小到一個icon的尺寸大小,這都關(guān)系到視覺頁面的美觀程度以及用戶體驗設(shè)計。所以應(yīng)該積極主動去分析深入了解并研究出可行的解決方案,同樣的,無線端頁面設(shè)計存在許多雷區(qū)陷阱,這個需要設(shè)計師去避免出現(xiàn)錯誤的。?一、無線端視覺規(guī)范?(一)、無線端頁面尺寸規(guī)范隨意縮放?無線端頁面一般來說是延續(xù)pc端來進行更改調(diào)整的,所以很多小伙伴直接在pc端的基礎(chǔ)上直接進行收縮,然后變形,大部分操作就會失效,這樣的話就會影響到無線端文字的可讀性以及整個視覺畫面的布局,造成整個視覺布局的不協(xié)調(diào)性。?(二)、解決方法:?針對無線端與pc端存在的差異,首先應(yīng)該不能直接在pc端的原基礎(chǔ)上進行修改,而是應(yīng)該對無線端的頁面進行“再設(shè)計”,針對手機端的規(guī)范尺寸進行適配,比如:應(yīng)該調(diào)整按鈕大小,以更加適合無線端用戶的視覺可讀習(xí)慣、文字大小,一般18px的字號是剛好可以清楚的程度,而24px是比較舒服的一個狀態(tài),30px是用于想到重點突出的大標題,不過一般在頁面中出現(xiàn)頻率不高,因為如果一味用大標題字體的話,盡管可讀性比較好,但是頁面也需要加長,用戶會沒有耐心。?類似這些頁面的無線端就是進行過“再設(shè)計”的:?二、無線端頁面呈現(xiàn)內(nèi)容?(一)、pc端內(nèi)容信息量大,一字不漏照搬到無線端(本文原創(chuàng)作者:大麥電商)?由于pc端的頁面尺寸比無線端大很多,所以pc端承載的信息內(nèi)容相對比較全面,但無線端尺寸相對小很多,如果把所有pc端的內(nèi)容原封不動地搬到無線端的話,就會顯得擁擠不堪,導(dǎo)致整個頁面布局看起來太過于糟亂,重點信息不能夠很好地展示。?(二)、解決方法:?手機端尺寸相對手機端很小,所以讓頁面看起來簡單有層次是比較重要的,這個點對于手機端頁面布局是很重要的,因為沒有對比就沒有重點,不能每個都是重點,每個都想突出,這樣反而沒有重點了,其實現(xiàn)在簡潔風(fēng)是很多大牌只要的營銷手段,可能是因為蘋果簡潔風(fēng)當下比較盛行,看起來比較有高級感,但是并不適合所有的頁面,因為類似一些食品類還有一些促銷類頁面,需要重點突出信息部分,這個事根據(jù)自身品牌店鋪定位來決定的。??三、用戶體驗(一)、按照pc端的用戶體驗操作習(xí)慣延續(xù)到無線端頁面上首先pc端一般用戶習(xí)慣是點擊鼠標左右滑動瀏覽banner圖或者向上下滑動鼠標瀏覽頁面,而無線端一般用戶的操作習(xí)慣是一直向上下移動瀏覽頁面,而且操作環(huán)境的選擇也會有所區(qū)別,在PC端上,點擊店鋪內(nèi)容的方式更加直接,用戶只需要通過鼠標來操作,而在無線端,直接用手指和屏幕之間直接接觸,很多人會直接把pc端的頁面展示方式直接搬到無線端上, 但是現(xiàn)在手機端以輪播的形式展示的點擊率越來越低了,很多重點信息內(nèi)容都在banner圖上展示,這樣就會造成店鋪點擊率降低。?(二)、解決方法:因為目前無線端的店鋪比重占據(jù)了很大的一部分,所以還是要注重?zé)o線端的用戶體驗設(shè)計,首先應(yīng)該積極主動引導(dǎo)用戶行為,所以不是很有必要的話盡量避免以輪播圖的形式展現(xiàn),因為用戶已經(jīng)習(xí)慣了上下的瀏覽操作習(xí)慣,所以一般都不會主動左右滑動。類似這些很好的無線端用戶體驗設(shè)計:?總結(jié):對于無線端頁面的設(shè)計,用戶體驗是非常重要的,盡管現(xiàn)在無線店鋪設(shè)計是處于弱勢,一般都是直接照搬pc端的頁面,但是從現(xiàn)在電商的發(fā)展趨勢來說,無線端的用戶越來越多,所以相信大家很越來越重視無線端頁面的設(shè)計,設(shè)計師也要深入去學(xué)習(xí)無線端的設(shè)計規(guī)范、理念等。
? ? ? 能夠幫助大家提升店鋪流量,是57淘寶論壇網(wǎng)小編的職責(zé)啦。想了解更多資訊,請關(guān)注57淘寶論壇網(wǎng)!
手機端頁面的設(shè)計有許多的規(guī)范,大到涉及整個頁面的排版呈現(xiàn)方式,小到一個icon的尺寸大小,這都關(guān)系到視覺頁面的美觀程度以及用戶體驗設(shè)計。所以應(yīng)該積極主動去分析深入了解并研究出可行的解決方案,同樣的,無線端頁面設(shè)計存在許多雷區(qū)陷阱,這個需要設(shè)計師去避免出現(xiàn)錯誤的。?一、無線端視覺規(guī)范?(一)、無線端頁面尺寸規(guī)范隨意縮放?無線端頁面一般來說是延續(xù)pc端來進行更改調(diào)整的,所以很多小伙伴直接在pc端的基礎(chǔ)上直接進行收縮,然后變形,大部分操作就會失效,這樣的話就會影響到無線端文字的可讀性以及整個視覺畫面的布局,造成整個視覺布局的不協(xié)調(diào)性。?(二)、解決方法:?針對無線端與pc端存在的差異,首先應(yīng)該不能直接在pc端的原基礎(chǔ)上進行修改,而是應(yīng)該對無線端的頁面進行“再設(shè)計”,針對手機端的規(guī)范尺寸進行適配,比如:應(yīng)該調(diào)整按鈕大小,以更加適合無線端用戶的視覺可讀習(xí)慣、文字大小,一般18px的字號是剛好可以清楚的程度,而24px是比較舒服的一個狀態(tài),30px是用于想到重點突出的大標題,不過一般在頁面中出現(xiàn)頻率不高,因為如果一味用大標題字體的話,盡管可讀性比較好,但是頁面也需要加長,用戶會沒有耐心。?類似這些頁面的無線端就是進行過“再設(shè)計”的:?二、無線端頁面呈現(xiàn)內(nèi)容?(一)、pc端內(nèi)容信息量大,一字不漏照搬到無線端(本文原創(chuàng)作者:大麥電商)?由于pc端的頁面尺寸比無線端大很多,所以pc端承載的信息內(nèi)容相對比較全面,但無線端尺寸相對小很多,如果把所有pc端的內(nèi)容原封不動地搬到無線端的話,就會顯得擁擠不堪,導(dǎo)致整個頁面布局看起來太過于糟亂,重點信息不能夠很好地展示。?(二)、解決方法:?手機端尺寸相對手機端很小,所以讓頁面看起來簡單有層次是比較重要的,這個點對于手機端頁面布局是很重要的,因為沒有對比就沒有重點,不能每個都是重點,每個都想突出,這樣反而沒有重點了,其實現(xiàn)在簡潔風(fēng)是很多大牌只要的營銷手段,可能是因為蘋果簡潔風(fēng)當下比較盛行,看起來比較有高級感,但是并不適合所有的頁面,因為類似一些食品類還有一些促銷類頁面,需要重點突出信息部分,這個事根據(jù)自身品牌店鋪定位來決定的。??三、用戶體驗(一)、按照pc端的用戶體驗操作習(xí)慣延續(xù)到無線端頁面上首先pc端一般用戶習(xí)慣是點擊鼠標左右滑動瀏覽banner圖或者向上下滑動鼠標瀏覽頁面,而無線端一般用戶的操作習(xí)慣是一直向上下移動瀏覽頁面,而且操作環(huán)境的選擇也會有所區(qū)別,在PC端上,點擊店鋪內(nèi)容的方式更加直接,用戶只需要通過鼠標來操作,而在無線端,直接用手指和屏幕之間直接接觸,很多人會直接把pc端的頁面展示方式直接搬到無線端上, 但是現(xiàn)在手機端以輪播的形式展示的點擊率越來越低了,很多重點信息內(nèi)容都在banner圖上展示,這樣就會造成店鋪點擊率降低。?(二)、解決方法:因為目前無線端的店鋪比重占據(jù)了很大的一部分,所以還是要注重?zé)o線端的用戶體驗設(shè)計,首先應(yīng)該積極主動引導(dǎo)用戶行為,所以不是很有必要的話盡量避免以輪播圖的形式展現(xiàn),因為用戶已經(jīng)習(xí)慣了上下的瀏覽操作習(xí)慣,所以一般都不會主動左右滑動。類似這些很好的無線端用戶體驗設(shè)計:?總結(jié):對于無線端頁面的設(shè)計,用戶體驗是非常重要的,盡管現(xiàn)在無線店鋪設(shè)計是處于弱勢,一般都是直接照搬pc端的頁面,但是從現(xiàn)在電商的發(fā)展趨勢來說,無線端的用戶越來越多,所以相信大家很越來越重視無線端頁面的設(shè)計,設(shè)計師也要深入去學(xué)習(xí)無線端的設(shè)計規(guī)范、理念等。
? ? ? 能夠幫助大家提升店鋪流量,是57淘寶論壇網(wǎng)小編的職責(zé)啦。想了解更多資訊,請關(guān)注57淘寶論壇網(wǎng)!
留言與評論(共有 條評論) |