תהליכי אפיון UI שיש לבצע לפני בניית האתר

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

יצירת המערך הכללי של האתר וקביעת ההיררכיה

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

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

היתרון שבפשטות

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

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

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

קביעת הצורה של כל עמוד

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

מכינים את המתכון ומכניסים לתנור

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

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

עם רגל אחת באוויר

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

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

בהצלחה!

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