עיצוב רספונסיבי – איך לבצע התאמת אתר למובייל בצורה בטוחה | חלק 6 שדרוג אתרים

התאמת אתר למובייך, התאמת אתר לניידים, רספונסיביות אתר

למה חשוב לבצע התאמת אתר למובייל?

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

לפני עשור, זה לא היה כל כך נורא, אבל היום, בעידן שבו לרוב האתרים יש נתוני גלישה של מעל 80% כניסות מהמובייל, זה כבר בעייתי.

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

 


ישנם שלושה סוגי התאמות למובייל אפשריות:

1. “המופרדת” – Parallel / Separate Mobile Site 

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

לדוגמא: 

דומיין אתר הדסקטופ יכול להיות: website.co.il

ואילו דומיין המובייל יהיה בעצם סאב-דומיין מתוך הדומיין הראשי: m.website.co.il

וכן הלאה במידה ונרצה לעשות גם לטאבלט.

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

שיטה זו הינה שיטה ישנה וכיום כמעט ולא משתמשים בה.

2. “המשתנה” – Dynamic Serving 

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

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

3. “הרספונסיבית” – RWD – Responsive Web Design
זהו בעצם אתר אחד, שיושב על דומיין אחד עם עיצוב אחד שמתאים את עצמו בהתאם לסוג וגודל המסך ממנו הוא נפתח. 

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

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

סוגי התאמות לניידים, התאמה למובייל, RWD, אתר רספונסיבי

במאמר זה לא ניכנס לעומק היתרונות והחסרונות של כל אחד מסוגי ההתאמות למובייל, אך במאמר הזה של seoreport.co.il ניתן למצוא עוד מידע על כל אחת מן השיטות שהצגנו כאן בקצרה.


השיטה בה אנחנו נשתמש לביצוע שדרוג אתר והתאמת אתר למובייל היא כמובן RWD – הרספונסיבית.

בעזרת מדריך אלמנטור ואלמנטור פרו נוכל לבצע התאמת אתר לניידים בקלות רבה וכמובן גם לקדם את האתר בצורה קלה יותר.

 


מה צריך לעשות לפני שמבצעים התאמת אתר למובייל?

1. לבצע גיבוי

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

2. להכין אפיון נפרד
בין אם אנחנו בונים קודם את העיצוב במחשב ואז מתאימים למובייל או ההפך (גישת “Mobile First”), אנחנו בהחלט רוצים ליצור אפיון נפרד מראש למובייל.

לנראות האתר כאשר הוא מותאם לניידים יש חשיבות רבה בחווית המשתמש של הגולשים ודירוג האתר שלנו בהמשך.

3.להיזהר מאפקטי תנועה

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

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

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

4. להתמקד בתכנים החיוניים

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

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

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

5. להכיר את הגולשים

כשזה נוגע לחווית משתמש, מה יותר טוב מאשר לשאול, טוב… את המשתמש?

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

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

6. לקבל השראה מאתרים אחרים

כולנו עושים את זה ולא משנה מאיזה תחום אנחנו. והאמת? זו שיטה דווקא די טובה.

כשאני אומרת לקבל השראה אני לא מתכוונת להעתיק אתר אחד ספציפי.

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

7. להציג אפיון ראשוני

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

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

לאחר מכן נשאל אותם מה הם היו מוסיפים/ מורידים/ משנים.

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


אהבתם את המאמר על התאמת אתר למובייל בצורה בטוחה?

המאמר הזה הוא חלק 6 במדריך שדרוג אתרים. תוודאו שאתם לא מפספסים את מדריך שדרוג אתרים המלא.


חדשים בווורדפרס? אל תפספסו את מדריך וורדפרס למתחילים

חדשות באלמנטור? תוודאו שאתן בודקות את המדריך השווה מדריך אלמנטור למתחילות.


 

עקבו בפייסבוק והתעדכנו במאמרים וטיפים חשובים

מה אנשים אוהבים לקרוא כאן?

פוסטים אחרונים

הרשמו לניוזלטר וקבלו תכנים מגניבים

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

רוצים להקים אתר איכותי שמותאם בול לצרכי העסק והמותג שלכם?

השאירו פרטים ואתם בחצי הדרך לשם :)