בשנים האחרונות חלה מהפכה של ממש באופן שבו אנשים גולשים באינטרנט : במקום לגלוש מהבית או מבית קפה דרך מחשב נייד, אנשים גולשים יותר ויותר דרך מכשירים סלולאריים או טאבלטים. ככל שהמכשירים הללו נעשים פופולאריים יותר, כך גם שיעור הגלישה באמצעות המחשבים המסורתיים (נייחים וניידים) הולך ופוחת. כבר כיום יש אתרים מסוימים שלא פחות מ – 25% מהמבקרים בהם גולשים ממכשירים ניידים!
מכיוון למכשירים הניידים יש מסכים קטנים יותר ואין להם מקלדת, אלא מסכי מגע, הרי שאתרי אינטרנט רגילים עלולים להיות בלתי קריאים או בלתי נוחים לשימוש. לדוגמה, קישור שמופיע בגודל קטן מדי, יהיה קשה יחסית ללחיצה. במיוחד למי שיש לו אצבעות גדולות. מסיבה זו, יותר ויותר בעלי אתרים מבינים שעליהם לבנות אתר נוסף שיתאים לגלישה מהסלולרי ולשטח תצוגה קטן יותר.
כאשר בונים אתר סלולרי, יש גם לקחת בחשבון שגלישה סלולארית היא גלישה אינטנסיבית יותר בה מקדישים פחות זמן לכל אתר ואתר. לפיכך, אפשר לוותר על חלק מעמודי המשנה או פונקציות מסוימות כמו הזמנת מוצרים מורכבת, שלרוב הגולשים לא יהיה נוח להשתמש בהן "על הדרך".
כיצד בונים בפועל אתר סלולרי?
ישנן שתי גישות מסורתיות כיצד יש להרחיב אתר אינטרנט אל עולם הסלולר :
הגישה הראשונה גורסת שצריך לבנות גרסה מיוחדת רק לסלולר או אפליקציה ייעודית.
הגישה השנייה גורסת שאפשר לבנות אתר דינאמי אשר יתאים את עצמו לפלטפורמה עליה הוא מוצג , כולל גודל המסך והממשק , כאשר בדרך כלל מדובר במסך מגע ומסך קטן יותר מאשר במחשבים אישים , עבורם תוכנן האתר מלכתחילה. גישה זו היא גישה עיצוביית בעיקרה, עיצוב רספונסיבי (מגיב).
הסיבה המרכזית לכך שהעיצוב הרספונסיבי פופולארי יותר כיום היא שבשוק קיים מגוון הולך וגדל של מכשירים בגדלים שונים ובעלי מערכות הפעלה שונות. יותר נוח לבנות אתר אחד מאשר ארבעה אתרים או ארבע אפליקציות שונות לטאבלטים וסמארטפונים בעלי מערכות הפעלה שאינן תואמות לחלוטין אחת לשניה.
כיצד פועל עיצוב רספונסיבי
בעוד אתר אינטרנט רגיל בנוי בצורה לינארית ומציג את כל האלמנטים על המסך בסדר קבוע, עיצוב רספונסיבי מארגן את האלמנטים השונים בצורה דינאמית. לדוגמה, אם במסכים רחבים, הקישורים לעמודים השונים יוצגו לרוחב המסך, בגרסאות למסכים קטנים יותר, הם יוצגו לגובה (קל יותר לגלול מלמעלה למטה מאשר לצדדים). במקרים אחרים, ייתכן שחלק מהפונקציות של האתר הרגיל לא יהיו רלוונטיות יותר. לדוגמה, הזמנת כרטיסי טיסה היא תהליך מורכב יחסית שכמעט אף פעם לא מבוצע "על הדרך", ולכן אפשר לוותר עליו בגרסה הסלולארית. במקום זאת ,עדיף להוסיף טופס שישלח למשתמש התראה אל הדואר האלקטרוני שעליו עדיין לבצע את ההזמנה כאשר יגיע הביתה.
בשורה התחתונה, עיצוב רספונסיבי הוא ללא ספק מאתגר מאוד מבחינה טכנית, אבל בטווח הארוך, הוא חוסך למי שמשתמש בו זמן וכסף בניסיונות להתאים את האתר לכל המכשירים הקיימים בשוק.
דוגמא לאתר רספונסיבי: אדריכלות תוצאות באינטרנט
