למרות שמספר האתרים ללא אופטימיזציה לנייד הולך וקטנה, עדיין נותרו כמה המיועדים לשולחן העבודה בלבד. לרוע המזל, שירות האינטרנט ה'מוביליזרי 'הקודם של Google הופסק. יורשו הרוחני של השירות הוא Google Weblight, המתוכנן סביב אופטימיזציה לחיבורים איטיים ולא לשינוי אתרים לצפייה בנייד. מעבר לשירות של גוגל, ישנם מספר שיטות וכלים שיש לקחת בחשבון בעת פיתוח אתר עם מחשבה על מובייל.
צעדים
חלק 1 מתוך 2: ניסוי ב- Google Weblight
שלב 1. נתח כיצד פועל Weblight
Weblight הוא אלגוריתם שנוצר על ידי Google כדי לספק למשתמשים טעינת דפים מהירה וקלה יותר בתנאי רשת גרועים. המשמעות היא של- Weblight אין ממשק משתמש ופועל בממשק האחורי. הדפים מופשטים מהאלמנטים המורכבים יותר שלהם, ומספקים חוויה מופשטת וקלה יותר מאשר אופטימיזציה מפורשת לפלטפורמה הניידת.
שלב 2. בדוק שינויים באתר עם Weblight
במכשיר הנייד שלך, פשוט הוסף את כתובת האתר המלאה שלך לסוף כתובת ה- weblight (למשל אם האתר שלך הוא "mywebsite.com", לאחר מכן היכנס https://googleweblight.com/?lite_url=https://mywebsite.com). הדף יטען גרסה פשוטה אך פונקציונאלית של עצמו. עם האלמנטים שהוסרו, אתרים מסוימים עשויים להיראות הרבה יותר טובים במסכי מכשירים ניידים.
שלב 3. הכירו במגבלות
זכור כי זהו אינו כלי ממיר מפורש המיועד לאינטראקציה של משתמשים. בעוד שניתן להשתמש בכניסה ידנית לאתר באופן קמצוץ, Weblight מיועד למהירות ולא לשימושיות.
חלק 2 מתוך 2: עיצוב לתאימות לנייד
שלב 1. זכור את מגבלות המכשיר הנייד
מכשירים ניידים חולקים כמה היבטים המייחדים אותם מעמיתיהם לשולחן העבודה. תכונות ליבה אלה צריכות להיות השיקולים העיקריים בעת יצירת אתר לצריכה ניידת.
- מסכים קטנים ואנכיים: למרות שרזולוציות המסך במכשירים ניידים משתפרים ללא הרף, הגודל וגורם הצורה נותרים דאגה בעיצוב האתר. עיצוב אתר לפריסת עמודה אחת הוא הטוב ביותר עבור טלפונים (טאבלטים יכולים לעתים קרובות להשתמש באתרי שולחן עבודה ללא יותר מדי בעיות).
- ממשקי מגע: יש למקם אלמנטים של עמודים תוך התחשבות בגודל של אצבע. יש למזער או לעצב מחדש רכיבים המשתמשים במעבר העכבר למגע (למשל תפריטים נפתחים).
- מהירויות נתונים: אחד היתרונות הגדולים של מכשירים ניידים הוא שימוש מחוץ לטווח ה- wifi, אך חיבורי הנתונים בדרך כלל איטיים יותר ואמינים פחות. ממשקי משתמש (UI) צריכים להישאר פשוטים והתוכן צריך להיות גלוי ונגיש. עומס רב מדי יביא לביטול זמני הטעינה ויקשה על הניווט.
שלב 2. השתמש בשירות מערכת ניהול תוכן (CMS)
עבור אלה המתפתחים עם פחות משאבים, שימוש בשירות CMS כמו Wordpress או Squarespace הוא אופציה מצוינת לעיצוב נייד בעלות נמוכה וידידותית למשתמש. ערכות נושא המשתמשות בעיצוב אתרים רספונסיבי יספקו את התבנית הקלה ביותר לאתר מובייל.
עיצוב אתרים רספונסיבי היא תיאוריה של עיצוב אתרים המקדמת את השימוש באלמנטים עיצוביים נוזליים כדי לאפשר מעבר חלק של עיצוב ושימושיות בין פלטפורמות
שלב 3. בדוק את מסכי המכשיר הנייד באמצעות תוכנת שולחן עבודה
ישנם מספר יישומי אינטרנט בחינם המאפשרים לך לחקות מכשירים ניידים כדי לבדוק את האסתטיקה והפונקציונליות של האתר. השימוש בכלים אלה קל כמו בחירת מכשיר הבדיקה הרצוי, ולאחר מכן כניסה לאתר היעד לתצוגה מקדימה. רובם יכללו כלים למשתנים כמו כיוון המסך, צפיפות הפיקסלים או אפילו בחירת דפדפן. כמה דוגמאות פופולריות הן:
- אמולטור למכשירי Chrome
- mobilephoneemulator.com
- screenfly (קבוצת משנה של כלים חיוניים)
- mobiletest.me (חברות בתשלום)
