האתר לא מותאם לנייד: בדיקה של 10 דקות ותיקונים לפי סדר חשיבות

למה "שבור בנייד" זה שבור בפועל

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

השנייה קשורה לגוגל. גוגל עבר לשיטה שנקראת mobile-first indexing: הוא סורק ומדרג אתרים לפי הגרסה שלהם בנייד, לא במחשב. כלומר הגרסה הניידת של האתר שלך היא זו שקובעת איך אתה מופיע בתוצאות החיפוש — גם עבור מי שמחפש ממחשב.

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

בדיקת עשר הדקות: מה לפתוח ומה ללחוץ

אין צורך בכלים מסובכים. הבדיקה הטובה ביותר היא הטלפון שבכיס שלך. פתח את האתר בטלפון — לא במצב 'תצוגת מחשב' של הדפדפן אלא רגיל — ועבור על הרשימה הבאה כשאתה באמת לוחץ על כל דבר, בדיוק כמו שלקוח היה עושה:

אם משהו ברשימה נכשל, סימנת בעיה אמיתית. עכשיו נדבר על מה כל בעיה אומרת ומה עושים איתה.

• ●התפריט. הוא נפתח? אפשר ללחוץ על כל הפריטים בלי להתאמץ לכוון עם האצבע?
• ●כפתור החיוג. לחיצה על מספר הטלפון פותחת חיוג? זה הכפתור החשוב ביותר בעסק מקומי, והוא נשבר לעיתים קרובות.
• ●טופס יצירת קשר. אפשר להקליד בכל השדות? המקלדת לא מסתירה את השדה שאתה ממלא? כפתור השליחה נגיש?
• ●וואטסאפ. אם יש כפתור וואטסאפ — הוא באמת פותח שיחה למספר הנכון?
• ●טקסט. אתה קורא בלי לזום, או שאתה צריך לפתוח באצבעות כדי לקרוא?
• ●גלילה לרוחב. הדף 'בורח' לצדדים ואפשר לגלול ימינה-שמאלה? זה סימן מובהק לאתר שלא מותאם.
• ●גלריות ותמונות. התמונות נכנסות למסך או שהן נחתכות ובורחות ממנו?
• ●טבלאות. אם יש טבלה (מחירון, שעות פעילות) — היא נקראת בנייד או שהיא נמעכת?

הבעיות הנפוצות באתרי עברית בנייד — והתיקון לכל אחת

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

• ●טקסט קטן מדי שמחייב זום. התבנית מציגה גופן במידה שנקבעה למחשב. התיקון בדרך כלל הגדרתי — הגדלת מידת הגופן הבסיסית והמרווחים במובייל.
• ●גלילה לרוחב וטקסט ש'בורח' מהמסך. לרוב אלמנט אחד ברוחב קבוע (תמונה, טבלה, כפתור) רחב מהמסך ומושך איתו את כל הדף. התיקון הוא לתת לאותו אלמנט להתכווץ לרוחב המסך — לעיתים הגדרה, לעיתים עבודת קוד.
• ●כפתורים צפופים מדי לאצבע. קישורים או כפתורים קרובים מדי זה לזה גורמים ללחיצות שגויות. התיקון: להגדיל את שטח הלחיצה ואת המרווח ביניהם.
• ●טופס שקשה למלא. שדות צרים, תוויות שנעלמות, מקלדת שמכסה את השדה. חלק מזה מטופל בהגדרות התבנית, וחלק דורש התאמת קוד לטופס.
• ●טבלה שנמעכת. טבלאות רחבות הן מקור קלאסי לגלילה לרוחב. התיקון הוא להפוך את הטבלה לגוללת בנפרד, או לעצב אותה מחדש לתצוגת נייד.
• ●מספרים ומותגים באנגלית בתוך טקסט עברי. בנייד לעיתים כתובת, מספר טלפון או שם מותג לועזי 'קופצים' לצד הלא נכון של השורה. זו בעיית כיווניות שמטופלת בקוד, ולרוב נפתרת בקלות ברגע שמזהים אותה.
• ●חלונות קופצים שמכסים את המסך. פופ-אפ שתופס מסך שלם בנייד בלי כפתור סגירה נגיש חוסם את המבקר לגמרי. התיקון: לוודא כפתור סגירה גדול וברור, או לכבות את הפופ-אפ בנייד.

מה מתקנים בהגדרות ומה דורש מפתח

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

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

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

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

מתי זה סימן להחליף במקום לתקן

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

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

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

שאלות נפוצות