האם יש לך " אתר תגובה "? זהו אתר עם פריסה שמשתנה בהתאם למכשיר המבקר ולגודל המסך. עיצוב אתרים מגיב הוא עכשיו הנוהג הטוב ביותר בתעשייה. מומלץ על ידי Google ומצא במיליוני אתרים ברחבי האינטרנט. יש, עם זאת, הבדל גדול בין בעל אתר זה פשוט "מתאים" על גדלי מסך שונים שיש אתר כי הוא באמת תגובה.
אני באופן שגרתי לראות חברות לעצב מחדש את אתר האינטרנט שלהם לדחוף את ההודעה לעיתונות המרחיבים את המעלות של העיצוב החדש ידידותי הנייד שלהם. כאשר אני מבקר באתרים אלה, מה שאני מוצא לעתים קרובות הוא פריסה כי אכן בקנה מידה לשנות כדי להתאים במסכים שונים, אבל זה ככל שהם לוקחים את הרעיון של היענות. זה לא מספיק. אתר תגובה באמת עושה יותר בקנה מידה רק כדי להתאים למסך קטן יותר או גדול יותר. באתרים אלה, תוכלו למצוא גם את התכונות החשובות הבאות.
1. ביצועים ממוטבים
אף אחד לא אוהב לחכות לטעינה של אתר אינטרנט, וכאשר מישהו משתמש במכשיר נייד עם חיבור שעשוי להיות פחות אידיאלי, הצורך באתר לטעינה מהירה עוד יותר חשוב.
אז איך אתה למטב את הביצועים של האתר שלך? אם אתה מתחיל עם אתר חדש כחלק עיצוב מחדש, אז אתה צריך לעשות את זה נקודה כדי ליצור תקציב ביצועים כחלק של הפרויקט. אם אתה עובד עם אתר קיים ואינך מתחיל מאפס, הצעד הראשון הוא לבדוק את ביצועי האתר שלך כדי לראות היכן אתה עומד כיום.
ברגע שיש לך את הבסיס שבו האתר שלך עומד ביצועים חכם, אתה יכול להתחיל לעשות את השיפורים הדרושים כדי להגדיל את מהירות ההורדה. מקום נהדר להתחיל בו הוא כנראה עם התמונות של האתר שלך. תמונות גדולות מדי הן הגורם # 1 כשמדובר באתרי טעינה איטיים, ולכן אופטימיזציה של התמונות שלך עבור משלוח אינטרנט יכול באמת לעזור לאתר שלך מנקודת מבט הביצועים.
המציאות היא כי שיפור ביצועי האתר ומהירות להוריד מהר הם יתרון שכל המבקרים יעריכו. אחרי הכל, אף אחד מעולם לא התלונן כי האתר נטען "מהר מדי", אבל אם האתר לוקח זמן רב מדי לטעון, זה יהיה בהחלט להפוך אנשים משם אם זה "מתאים" על המסך שלהם או לא.
2. היררכית תוכן חכמה
כאשר אתר אינטרנט מוצג על מסך גדול, אתה יכול להניח תוכן החוצה במגוון דרכים בגלל הנדל"ן מסך משמעותי זמין. לעתים קרובות אתה יכול להתאים הודעות ותמונות חשובות, עדכוני חדשות, מידע על אירועים וניווט באתר על המסך בבת אחת. זה מאפשר למבקר בקלות ובמהירות לסרוק את התוכן של הדף כולו ולהחליט מה חשוב להם.
תרחיש זה משתנה באופן דרמטי למדי כאשר אתה לוקח את עיצוב האתר ולהפוך אותו למכשירים מסך קטן, כמו טלפון סלולרי. פתאום אתה עובד עם חלק של הנדל"ן המסך היה לך לפני. זה אומר שאתה צריך להחליט מה יופיע באתר הראשון, מה יעקוב אחריו, וכו 'במקום כל דבר נראה בבת אחת, סביר להניח שיש רק את המקום כדי להראות אחד או שני דברים (אחד מהם הוא ניווט סביר). משמעות הדבר היא כי החלטות של היררכיה צריך להיעשות. למרבה הצער, מה קובע לעתים קרובות מה מגיע הראשון על המסך, ולאחר מכן השני, וכו 'היא הדרך את הדף עצמו מקודד. זה הכי קל, כאשר בניית אתר תגובה, להציג את כל מה הראשון בקוד הראשון על המסך, ואחריו את הפריט השני בקוד וכן הלאה. למרבה הצער, מה עשוי להיות החשוב ביותר על מכשיר אחד לא יכול להיות קריטי על אחר. אתר תגובה באמת מבין כי היררכיה של התוכן צריך להשתנות בהתאם למצבים שונים וזה צריך להיות חכם על מה הוא מציג שם.
שיפורים בטכניקות פריסת CSS, כולל CSS Grid Layout, Flexbox ועוד, מאפשרים למעצבי אתרים ולמפתחים אפשרויות רבות יותר כשמדובר בהנחת תוכן בתבונה, במקום להיות מוקפים בסדר המדויק של אזורי תוכן בקוד ה- HTML. ניצול טכניקות פריסה חדשות אלה יהפכו אף יותר חשוב כמו הנוף המכשיר, ואת הצרכים של המשתמשים באתר שלנו, ממשיכה להתפתח.
3. חוויות לקחת בחשבון את החוזק של המכשיר וחולשות
להישאר על הנושא של מכשירים - כל מכשיר שאדם יכול להשתמש בו כדי לבקר באתר שלך יש גם נקודות החוזק והחולשות שהם הטמון פלטפורמה זו. אתר תגובה גדול מבין את היכולות והמגבלות של מכשירים שונים ומשתמש בהם כדי ליצור חוויות מותאמות אישית המתאימות ביותר לכל מכשיר שאורח עשוי להשתמש בו באותו רגע.
לדוגמה, טלפון סלולרי כולל מספר תכונות שלא תמצא במחשב שולחני מסורתי. GPS הוא דוגמה אחת של התכונה ניידת- centric (כן, אתה יכול לקבל מידע על מיקום כללי על שולחנות עבודה, כמו גם, אבל GPS המכשיר הוא הרבה יותר מדויק). האתר שלך עשוי להשתמש במידע GPS כדי לשלוח בחוכמה אדם מפורט מאוד מפורט ומדויק פרטים צעד אחר צעד או הצעות מיוחדות המבוססות על המקום שבו הם נמצאים באותו רגע.
דוגמה נוספת למנהלת זו בפועל תהיה אתר שמבין איזה סוג מסך מסך אתה משתמש ושולח תמונות המתאימות ביותר לתצוגה זו. אם יש לך מסך עם צפיפות פיקסלים גבוהה, אתה יכול להחליט לשלוח תמונות באיכות גבוהה יותר למסך זה. אלה תמונות אותו יהיה חסר טעם על המסך מסוגל פחות, עם זאת, ואת איכות נוספת יאבדו בעוד גודל הקובץ הנוסף יורדו ללא שום סיבה בפועל.
אתרי תגובה גדולים באמת רואים את כל חוויית המשתמש ועובדים על מנת להתאים את החוויה הזו בהתבסס לא רק על סוג המכשיר או גודל המסך שלו, אלא גם היבטים חשובים אחרים של החומרה.
תוכן עם הקשר
בתחילה, עיצוב אתרים מגיב קיבל את שמו בגלל הרעיון של פריסת האתר להגיב לגדלים שונים המסך, אבל אתה יכול להגיב על כך הרבה יותר מאשר גודל המסך. בהתבסס על הדוגמה הקודמת של שימוש בחוזקות של המכשיר וחולשות, אתה יכול להשתמש אלה, כמו גם נתונים אחרים כמו תאריך ושעה, כדי באמת להתאים את חוויית האתר.
תארו לעצמכם אתר אינטרנט עבור אירוע גדול להראות סחר. אמנם אתר אינטרנט בעל יכולת תגובה ישנה את הפריסה של דפי האתר, כך שניתן יהיה לשנות את קנה המידה במסכים שונים, אך תוכל גם להשתמש בתאריך כדי לקבוע איזה תוכן חשוב ביותר להצגה. אם זהו פרק הזמן לפני האירוע, סביר להניח שאתה רוצה להציג את פרטי הרישום באופן בולט. אם, עם זאת, האירוע הוא בעצם קורה באותו רגע, ההרשמה לא יכול להיות התוכן החשוב ביותר. במקום זאת, אתה יכול decidethat לוח הזמנים של היום הוא קריטי יותר שכן הוא רלוונטי יותר לצרכים המיידיים של אותו משתמש.
לוקח דברים צעדים נוספים, אתה יכול לנצל את ה- GPS של המכשיר כדי לקבוע היכן הם באמת בתערוכה. אתה יכול לתת להם תוכן אינטראקטיבי על פי המיקום שלהם, מראה להם דוכנים או פגישות הקרובות על מנת להתחיל.
5. נגישות
הדוגמה האחרונה אנחנו מסתכלים על איך האתר באמת יכול לענות על הצרכים של המבקר היא לחשוב על נגישות לאתר . אתרי אינטרנט צריך להיות מסוגל להיות בשימוש על ידי אנשים רבים ככל האפשר, כולל אלה עם מוגבלות. אתר האינטרנט שלך אמור להיות מסוגל להיות בשימוש על ידי מישהו הזקוק קורא מסך או תוכנה מסייעת אחרים כדי לגשת לתוכן שלה. בדרך זו, האתר שלך עונה על הצרכים שלהם, כי יש לך להבטיח כי החוויה, בעוד שונה עבור מבקרים נכים, עדיין מתאים.
על ידי תגובה לנקודות נתונים רבות ככל האפשר, ולא רק גודל המסך, אתר אינטרנט יכול להיות הרבה יותר מאשר רק "ידידותי ניידים." זה יכול להיות חוויה מגיבה באמת בכל מובן של הביטוי.