התאמה לניידים

מה הכוונה באתר מותאם לנייד לפי גוגל ואיך אני בודק את ההתאמה של האתר שלי?

תשובת מדריך קידום אתרים Inlight :

בגדול, אתר שמותאם לנייד הוא אתר שנראה היטב על התקנים ניידים וניתן לגלוש בו בנוחות מבלי לבצע תנועות של הגדלה או הקטנה כדי שגודל הטקסט יהיה מספיק קריא. כמו כן, באתר מותאם לא אמורה להיות גלילה אופקית של הדף, אלא רק גלילה אנכית רגילה.

גוגל מחלקת את ההתאמה של אתר לנייד למספר קטגוריות שונות. ככל שיש פחות דפים בעיתיים בכל קטגוריה, כך הסיכוי שהאתר ייחשב לאתר מותאם לנייד יגדל (אתרים שמתאימים לניידים מופיעים במקום גבוה יותר כאשר מחפשים אותם מהגרסה הניידת של גוגל).

כמובן שיש אתרים עם רמות שונות של התאמה – החל מאתרים שמותאמים במלואם לגלישה מניידים ויקבלו ציון מושלם ועד לאתרים שלא מותאמים כלל לניידים ולכן יהיה צורך לבצע להם מתיחת פנים מלאה. על מנת לבדוק את מידת ההתאמה של האתר לנייד, יש לגשת אל קונסולת החיפוש, ואז אל תפריט "תנועת חיפוש" באתר הרלוונטי ולתת תפריט "התאמה לשימוש בניידים". שם ניתן לראות את השגיאות השונות ואת העמודים הרלוונטיים לכל שגיאה.

מהן ששת הקטגוריות אותן גוגל בודק בעת התאמת אתר לנייד?

שימוש ב-Flash – שימוש בפלאש הוא בעייתי כיום, במיוחד במכשירים של אפל או בדפדפנים אחרים שאינם תומכים בפלאש. לכן רצוי להסיר רכיבי פלאש או להחליף אותם ברכיבים אחרים המבוססים על תקנים אחרים כמו תקן HTML 5.

הגדרת נקודות מבט – נקודות המבט היא למעשה הגדרת תג מטה בשם Viewport שמגדירה את רוחב המסך של המשתמש ואת קנה המידה שבו יוצג האתר לעומת שאר רכיבי העיצוב בדף (רכיבי CSS). מידע נוסף אודות התג ניתן למצוא בדף של גוגל למפתחים בנושא.

נקודת מבט ברוחב קבוע – ההעדפה היא כי נקודת המבט אותה הצגנו בסעיף הקודם, תוגדר על פי רוחב המכשיר (device-width) ולא על פי רוחב קבוע של פיקסלים (לדוגמה, 320px). הגדרה על פי רוחב קבוע אמנם נותנת מענה מהיר לדפים לא מותאמים, אבל היא לא מסוגלת לתת מענה לכלל המכשירים בשוק או מכשירים עתידיים שהרזולוציה שלהם עלולה להיות שונה מן הסטנדרט.

התוכן אינו מותאם לגודל של נקודת מבט – מכיוון שנקודת המבט היא כאמור נקודה בעלת רוחב יחסי, אתרים שמשתמשים בערכים מוחלטים בעיצוב ה-CSS שלהם עלולים לגרום לגלילה אופקית של הדף שאיננה נוחה. למשל, אם הרזולוציה האופקית של המכשיר היא 480 פיקסלים, אבל אחת מן התמונות בדף היא ברוחב של 580 פיקסלים, יהיה צורך לגלול את המסך. לכן ההמלצה היא להשתמש תמיד בערכים יחסיים ולא בערכים מוחלטים. גם תמונות שמוגדרות באופן נכון, יכולות לשנות את קנה המידה שלהן ואינן מקובעות לרוחב מסוים.

גודל גופן קטן מדי – גודל גופן כמו 12 שיכול להיות קריא לחלוטין על מחשב אישי, הופך להיות בלתי קריא או קטן מאוד על גבי מסך קטן של סמארטפון. את גודל הגופן ניתן לקבוע בנפרד עבור כל סוג תצוגה : גופן בסיס, גופן קטן לרזולוציות גבוהות וגופן גדול לרזולוציות נמוכות. כל זאת בתנאי שיש הגדרת נקודת מבט מתאימה.

רכיבי מגע קרובים מדי - אם רכיבים שונים באתר כמו למשל שדות בטופס קרובים מדי אחד לשני, יהיה קשה לגעת בהם עם האצבע באופן מספיק מדויק, ואז יהיה צורך לבצע תנועה של צביטה כדי להקטין ולהגדיל את המסך. לכן, בגרסה מותאמת של האתר, חשוב לדאוג לריווח מספיק בין אלמנטים שונים בדף, ולא רק בטפסים, אלא גם בין קישורים, פסי גלילה ובעצם כל רכיב שניתן לתקשר איתו באמצעות לחיצה.

מעבר לזאת, חשוב לזכור שגם אם יש לכם מערכת ניהול תוכן שמטפלת בכל נושא ההתאמה לניידים עם ערכת עיצוב מתאימה, הרי שתוספים מסוימים כמו תוספים שיוצרים טפסים או ווג'יטים אחרים, עשויים שלא להתאים לניידים, ולכן גם באתר מותאם לכאורה עלולות להתגלות שגיאות.