成都小程序設(shè)計(jì)使用移動(dòng)優(yōu)先的開發(fā)過程開發(fā)。這種設(shè)計(jì)和開發(fā)網(wǎng)站的方法將移動(dòng)設(shè)備用戶的需求放在首位。然而，盡管使用移動(dòng)設(shè)備的人數(shù)不斷增加，但一些網(wǎng)站仍然無法在移動(dòng)設(shè)備上提供優(yōu)質(zhì)的用戶體驗(yàn)。當(dāng)然，移動(dòng)友好型網(wǎng)頁設(shè)計(jì)比將桌面版本壓縮到小屏幕上要多得多。使站點(diǎn)具有響應(yīng)性只能部分滿足移動(dòng)用戶的需求。必須將一些基本的設(shè)計(jì)功能整合到真正適合移動(dòng)設(shè)備的網(wǎng)站中。以下是為移動(dòng)設(shè)備設(shè)計(jì)響應(yīng)式網(wǎng)站時(shí)需要考慮的關(guān)鍵點(diǎn)。
字體大小必須足夠大，以便人們?cè)谂_(tái)式機(jī)和移動(dòng)設(shè)備上都能輕松閱讀。14 像素的字體大小通常最適合桌面用戶。然而，即使是 14 像素的字體也可能難以在小的移動(dòng)設(shè)備屏幕上閱讀。因此，對(duì)于移動(dòng)設(shè)備，您可能需要將字體大小增加到 16 像素或更大。
字體必須是品牌上的。但是，最好選擇在小屏幕上清晰易讀的響應(yīng)式字體。實(shí)驗(yàn)字體可能在桌面的大屏幕上可讀。但是，當(dāng)縮小尺寸以適應(yīng)移動(dòng)屏幕時(shí)，某些字體幾乎變得不可讀。因此，最好在各種設(shè)備上測(cè)試字體，以確保無論屏幕大小如何，一切看起來都正確。并且不要忘記檢查粗體或斜體時(shí)字體的外觀。
您可能認(rèn)為用戶會(huì)水平拿著手機(jī)來查看網(wǎng)站。然而，調(diào)查發(fā)現(xiàn)事實(shí)并非如此。事實(shí)上，據(jù)估計(jì)高達(dá) 90% 的人豎著拿手機(jī)。他們不會(huì)切換到以橫向模式查看網(wǎng)站，即使該網(wǎng)站使用起來很棘手。因此，最好在橫向和縱向模式下測(cè)試易用性。
對(duì)于某些人來說，在手機(jī)上打字并不容易。因此，避免要求輸入太多需要輸入的信息。記住，有些人手指粗，手機(jī)小！您可以使用下拉菜單來減少打字的需要。最好避免向用戶詢問不必要的或長(zhǎng)篇大論的信息。
如上所述，較大的字體在移動(dòng)設(shè)備上更易讀。但是，您可以過大，尤其是標(biāo)題。如果標(biāo)題的字體太大，您可能會(huì)發(fā)現(xiàn)只有一兩個(gè)詞適合移動(dòng)屏幕的寬度。如果是這樣，標(biāo)題可能會(huì)占據(jù)大部分屏幕。過長(zhǎng)的標(biāo)題也可能造成同樣的問題。
在移動(dòng)設(shè)備上打字并不是唯一具有挑戰(zhàn)性的事情。嘗試點(diǎn)擊靠得太近的可點(diǎn)擊元素也會(huì)令人沮喪。因此，盡量避免將超鏈接和按鈕放在一起。
當(dāng)字體在移動(dòng)設(shè)備上縮小時(shí)，閱讀起來就更難了。因此，當(dāng)在移動(dòng)設(shè)備上查看網(wǎng)站時(shí)，文本和背景之間的對(duì)比更為重要。例如，白色背景上的灰色字體可能在較大的桌面屏幕上可讀。但是，當(dāng)為較小的移動(dòng)屏幕縮小時(shí)，對(duì)比度可能不足以使文本清晰可辨。
空格仍然很重要
移動(dòng)設(shè)備顯示文本的空間有限。即便如此，最好不要用不間斷的文本塊填滿整個(gè)屏幕。事實(shí)上，應(yīng)該使用空格來分隔文本，就像在網(wǎng)站的桌面版本上一樣。但是，移動(dòng)設(shè)備上的空間會(huì)成比例地變小。空白還有助于解決在移動(dòng)設(shè)備上選擇可點(diǎn)擊對(duì)象的一些困難。
在移動(dòng)設(shè)備的小空間內(nèi)獲取關(guān)鍵信息至關(guān)重要。因此，通常最好剝離內(nèi)容并將重要信息放在首屏。如果用戶可以看到首屏下方有更多內(nèi)容可讀，這也會(huì)有所幫助。例如，在屏幕底部顯示部分標(biāo)題會(huì)鼓勵(lì)人們向下滾動(dòng)。
用鼠標(biāo)輕松點(diǎn)擊的按鈕可能很難用手指按下。因此，在設(shè)計(jì)適合移動(dòng)設(shè)備的網(wǎng)站時(shí)，請(qǐng)同時(shí)考慮按鈕的位置和大小。
當(dāng)人們使用移動(dòng)設(shè)備時(shí)，他們傾向于用拇指點(diǎn)擊按鈕。因此，將按鈕放置在不需要人們移動(dòng)手部位置即可按下的位置。按鈕通常還需要在移動(dòng)屏幕上更加突出。如果可點(diǎn)擊控件太小或靠得太近，選擇正確的選項(xiàng)可能會(huì)很棘手。
如前所述，在移動(dòng)設(shè)備上準(zhǔn)確打字可能具有挑戰(zhàn)性。因此，人們經(jīng)常在鍵入時(shí)鍵入并快速更正錯(cuò)誤。但是自動(dòng)更正可能會(huì)替換整個(gè)拼寫錯(cuò)誤的單詞，從而使更正更耗時(shí)。自動(dòng)更正通常會(huì)將地址等內(nèi)容替換為更常見的術(shù)語，從而導(dǎo)致需要進(jìn)行更多更正。因此，通常最好在網(wǎng)站的移動(dòng)版本上禁用自動(dòng)更正功能。
彈出窗口在桌面網(wǎng)站上非常有效。彈出窗口相對(duì)簡(jiǎn)單，可以用鼠標(biāo)關(guān)閉。但是，在移動(dòng)設(shè)備上，彈出窗口可能會(huì)占據(jù)整個(gè)屏幕。找到關(guān)閉選項(xiàng)可能具有挑戰(zhàn)性。因此，最好在網(wǎng)站的移動(dòng)版本上消除彈出窗口。
人們通常在旅途中使用移動(dòng)設(shè)備。因此，頁面加載速度比桌面加載速度更為重要。您可以采取任何措施來減少頁面加載時(shí)間，從而改善移動(dòng)設(shè)備上的用戶體驗(yàn)。降低頁面加載速度的方法之一是壓縮 CSS（層疊樣式表）代碼和高分辨率圖像。壓縮圖像和CSS可以加快它們的加載速度，但不會(huì)對(duì)功能或質(zhì)量產(chǎn)生負(fù)面影響。
移動(dòng)友好性不再是一個(gè)不錯(cuò)的選擇；它必須從一開始就集成到網(wǎng)站的設(shè)計(jì)中。這意味著要做的不僅僅是縮放站點(diǎn)以適應(yīng)較小的屏幕。它還意味著要考慮內(nèi)容的布局、鏈接和按鈕的位置以及排版。
未能融入基本移動(dòng)設(shè)計(jì)原則的網(wǎng)站將失去不斷增長(zhǎng)的移動(dòng)流量。但成都小程序設(shè)計(jì)希望以上提示能幫助您設(shè)計(jì)出對(duì)移動(dòng)設(shè)備用戶和桌面用戶一樣易于使用的網(wǎng)站。
