רוב הסיכויים שראית כיצד האייפון יכול להעיף ולהרחיב דפי אינטרנט. זה יכול להראות לך את כל דף האינטרנט במבט חטוף או להתקרב כדי להפוך את הטקסט שאתה מעוניין לקריא. במובן אחד, מאז אייפון משתמש בספארי, מעצבי אתרים לא צריכים לעשות שום דבר מיוחד כדי ליצור דף אינטרנט שיעבוד באייפון. אבל האם אתה באמת רוצה שהדף שלך פשוט יעבוד - או יבלוט ויזרח?
כאשר אתה לבנות דף אינטרנט, אתה צריך לחשוב מי הולך לראות את זה ואיך הם הולכים לראות את זה. חלק מהאתרים הטובים ביותר לוקחים בחשבון באיזה סוג מכשיר הדף נצפה, כולל רזולוציה, אפשרויות צבע ופונקציות זמינות. הם לא סומכים רק על המכשיר כדי להבין את זה.
הנחיות כלליות לבניית אתר למכשירים ניידים
- בדוק כמה שיותר מכשירים. הדבר הראשון שעליך לעשות הוא להציג את האתר שלך ב- iPhone וכמה שיותר שונים מכשירים ניידים או אמולטורים ככל שתוכל. אמנם אתה יכול להשתמש באמולטורים לכל הבדיקות שלך, אבל הם באמת לא נותנים לך את אותה התחושה כמו לנסות לנווט באתר באתר על המסך הקטן. עליך לבדוק במכשירים ממשיים ככל האפשר.
- הפוך את הדפים שלך לבזות בחן. אתה יכול לכתוב את הדפים שלך עבור מופעלת באמצעות פלאש, דפדפני מסך רחב, אך וודא שהמידע הקריטי גלוי גם בצג זעיר שאינו יכול להתמודד עם שום תכונה מיוחדת (כמו עוגיות, אייאקס, פלאש, JavaScript וכו '). כל דבר מעבר ל- XHTML Basic יהיה מעבר לטלפונים סלולריים מסוימים. בעוד שרוב הסמארטפונים יכולים להתמודד עם כל הדברים האלה, מכשירים ניידים אחרים לא יכולים.
- בנה דף ספציפי לאלחוט - והקל עליו למצוא. אם אתה מתכוון לבנות דף ספציפי עבור הטלפון הסלולרי והלקוחות האלחוטיים שלך - הפוך אותו לזמין. דרך נהדרת היא לשים את הקישור לדף האלחוטי בחלק העליון של המסמך שלך, ואז להסתיר את הקישור ממכשירים שאינם כף יד באמצעות סוג המדיה כף היד. אחרי הכל, רוב האנשים מגיעים לדף הבית שלך, אפילו בטלפונים סלולריים - ואם הקישור לדף האלחוטי שלך לא נמצא, הם יעזבו אם הדף קשה מדי לשימוש.
פריסת דף אינטרנט לסמארטפונים
הדבר הראשון שאתה צריך לזכור כשכותבים דפים לשוק הסמארטפונים הוא שאתה לא צריך לבצע שינויים אם אתה לא רוצה. הדבר הנהדר ברוב הסמארטפונים הזמינים הוא שהם משתמשים בדפדפני Webkit (Safari ב- iOS ו- Chrome ב- Android) הצג דפי אינטרנט, כך שאם הדף שלך נראה בסדר ב- Safari או ב- Chrome, הוא ייראה בסדר ברוב הסמארטפונים (פשוט הרבה קטן יותר). אבל יש דברים שאתה יכול לעשות כדי להפוך את חוויית הגלישה לנעימה יותר:
- זכרו שהמסך זעיר. סמארטפונים ירכזו את כל העמודות האלה לתוך החלון הזעיר, וזה יכול להקשות עליהם מאוד לקריאה מבלי להתקרב. רוב המשתמשים רגילים לבצע זום, אך זה יכול להיות מעייף. עמודה ארוכה אחת של טקסט קלה יותר לקריאה.
- חלקו דפים לגושים קטנים יותר. זה יכול להיות קשה לקרוא קטעי טקסט ארוכים בטלפון הסלולרי, ולכן הצבתם למספר עמודים מקלה על הקריאה שלהם.
קישורים וניווט במכשירי iPhone
- ככל שכתובות האתרים קצרות יותר, כך טוב יותר. אם ניסיתם פעם להקליד כתובת URL בטלפון הסלולרי, תדעו שזה כאב (למעט אולי בני נוער שרגילים לשלוח הרבה הודעות טקסט). אפילו באייפון זה מייגע להקליד כתובות URL ארוכות. שמור עליהם קצרים.
- אבל קל יותר להקיש על טקסט קישור ארוך. כאשר בדף שבו מספר מילים נפרדות מקושרות למאמרים שונים, כולם ממש אחד ליד השני, זה יכול להיות קשה מאוד להקיש על המילה הנכונה בלי להתקרב. אנשים רבים פשוט יוותרו וילכו למקום אחר. קל יותר ללחוץ על קישורים עם 3 עד 5 מילים בטלפון מאשר קישורים של מילה אחת.
- אל תשים את הניווט שלך בחלק העליון של המסך. אין דבר מעצבן יותר מאשר צורך לדפדף במסכים ובמסכי קישורים כדי למצוא את המידע שאתה רוצה. אם בדקתם בדפי אינטרנט שתוכננו לטלפונים סלולריים, תראו שהדברים הראשונים שמופיעים הם התוכן והכותרת. ואז, מתחת לזה נמצא הניווט.
- אל תפחד להסתיר את הניווט שלך.הסתרת קישורי ניווט עם CSS או JavaScript וגורם להם להופיע רק כשהמשתמש מבקש שזו דרך להקל על משתמשי הסמארטפונים את הדף.
טיפים לתמונות בסמארטפונים
- התמונות חייבות להיות קטנות. כן, אנדרואיד ואייפון יכולים להגדיל ולהתקרב לתמונות, אך ככל שהם קטנים יותר, בשני הממדים ובזמן ההורדה, כך הלקוחות האלחוטיים שלכם יהיו מאושרים יותר. מיטוב תמונות זה תמיד רעיון טוב, אבל עבור דפי טלפון סלולרי, זה קריטי.
- תמונות חייבות להוריד במהירות. תמונות תופסות מקום רב בדפי אינטרנט כאשר אתה צופה בהם ממכשיר נייד. ולמרות שהם לרוב מאוד נחמדים וגורמים לדפים להיראות טובים יותר כאשר הם נצפים בדפדפן אינטרנט מלא, הם בדרך כלל מפריעים למכשיר נייד. בנוסף כאשר משתמש בסמארטפון נמצא ברשת הסלולרית, הדבר האחרון שעליו הם רוצים לשלם הוא הורדת חבורה של תמונות ענקיות או אייקוני ניווט.
- אל תשים תמונות גדולות בראש הדף. בדיוק כמו בניווט, זה יכול להיות מייגע מאוד לחכות לתמונה שלוקחת 3 עד 4 תמונות מסך להיטען בחלק העליון של הדף. וזה נפוץ ביותר בדפי אינטרנט. היוצא מן הכלל היחיד לכך הוא אם הקורא יודע שהם הולכים לקבל תמונה כשהם לוחצים, נגיד בגלריית תמונות.
ממה להימנע בעת תכנון לנייד
יש להימנע ממספר דברים בבניית דף ידידותי לנייד. כאמור לעיל, אם אתה באמת רוצה שיהיו אלה בדף שלך, תוכל, אך וודא שהאתר עובד בלעדיהם.
- הֶבזֵק: רוב הטלפונים הניידים אינם תומכים בפלאש, ולכן לא מומלץ לכלול אותו בדפים האלחוטיים שלך.
- עוגיות: לטלפונים סלולריים רבים אין תמיכה בעוגיות. לאייפונים יש תמיכה בעוגיות.
- מסגרות: גם אם הדפדפן תומך בהם, חשוב על ממדי המסך. מסגרות פשוט לא עובדות במכשירים ניידים - קשה מאוד או בלתי אפשרי לקריאה.
- שולחנות: אל תשתמש בטבלאות לפריסה בדף נייד. ונסו להימנע משולחנות באופן כללי. הם לא נתמכים בכל סלולרי (למרות שאייפונים וסמארטפונים אחרים תומכים בהם) ואתה יכול בסופו של דבר לקבל תוצאות מוזרות.
- שולחנות מקוננים: אם אתה חייב להשתמש בשולחן, הקפד לא לקנן אותו בשולחן אחר. אלה קשה לתמוך בדפדפני שולחן העבודה, ובמקרה הטוב לגרום לדף לטעון לאט יותר.
- אמצעים מוחלטים: במילים אחרות, אל תגדיר את הממדים של עצמים בגדלים מוחלטים (כמו פיקסלים, מילימטרים או אינץ '). אם אתה מגדיר משהו כרוחב של 100 פיקסלים, במכשיר נייד אחד שעשוי להיות חצי מהמסך ובאחר הוא יכול להיות פעמיים ברוחב. גדלים יחסית (כמו ems ואחוזים) עובדים הכי טוב.
- גופנים: אל תניח כי כל אחד מה גופנים אתה רגיל שיש גישה אליו יהיה זמין בטלפונים הסלולריים.