קווים מנחים לעיצוב אתרים

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

מקוריות

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

קווים מנחים

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

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

באיזו רזולוציה משתמש קהל היעד שלך?
זוהי השאלה החשובה ביותר שעליך לשאול את עצמך (שמת לב שאתה מדבר עם עצמך די הרבה לאחרונה?). ישנם גולשים שעדיין משתמשים ברזולוציה של 800/600 (למשל, יושבי ספריות המשמשות סטודנטים וגמלאים, פיקידי משרדים ממשלתיים שנשערו במאה שעברה). האם קהל היעד שלך מגוון? לאילו קבוצות גיל אתה פונה? איזה סוג תוכן יהיה באתר? בהתחשב בתשובות לשאלות אלה יש שתי אפשרויות:
1.עיצוב למשתמשים ברזולוציה 600/800- זוהי פנייה לקהל מצומצם אולם כל הגולשים יוכלו לצפות בנוחות באתר.
2. עיצוב למשתמשים ברזולוציה 1024/768- אמנם לוקחים בכך סיכון שלא כל הגולשים משתמשים ברזולוציה זו אך לרוב זוהי הרזולוציה      הסטנדרטית.  בימינו מספר הגולשים ברזולציית 1024.768 הם כבר הרוב המכריע.

מהו רוחב הפיקסלים הרצוי?
אם האתר הוא עם 800 פיקסלים בדיוק או ברוחב 1024 פיקסלים ישנן מספר נקודות שעליך להתייחס אליהן:
1. פס גלילה אנכי- גם אם לא תכננת שהתוכן יתפשט אנכית ויגלוש אל מעבר לחלק הנראה לעין של האתר, חלק מהדפדפנים (IE6+) הם בעלי פס גלילה אנכי המופעל כברירת מחדל.
2. גבולות הדפדפן- גם במצב של מסך מלא, לחלק מהדפדפנים (IE6+) יש שוליים צרים אשר תוחמים את צדי המסך.
3. מסך לא לגמרי מלא- לא כל אחד מבין במחשבים. ישנם גולשים אשר מושכים את פינות הדפדפן כדי למלא את המסך כך שהאתר שהם צופים בו לא נראה במלואו על המסך והם אינם רואים את צדו הימני ואת צדו השמאלי. יש להביא זאת בחשבון בעת עיצוב האתר.

המסקנה היא שכאשר קובעים את רוחב האתר הרוחב המרבי צריך להיות 745 פיקסלים לרזולוציה של 800/600 ו-970 פיקסלים לרזולוציה של 1024/768. אפשר כמובן לסטות ב-5 פיקסלים אך לא מעבר לכך.

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

באיזו רזולוציה משתמש קהל היעד שלך?
כאן יש לקחת בחשבון את אותם גורמים אותם הזכרנו כאשר עסקנו ברוחב האתר. האם הצופה באתר יעשה שימוש ברזולוציה של 800/600 או במינימום רזולוציה של 1024/768.

באיזה גובה פיקסלים צריך להיות עצוב האתר?
מה שאתה צריך לבדוק הוא מהו הגובה (בפיקסלים) אשר נותר מעבר למקום שתופסים הדפדפן וה-OS. יש להביא בחשבון כמה דברים:
1. Start Bar - סרגל הכלים ב"חלונות" הוא ברירת המחדל ורוב המשתמשים לא משנים זאת ולעתים אף מרחיבים אותו לשתי שורות.
2. כלים של הדפדפן- כולל לשוניות (Tabs), פס כותרות (Title bar), Status bar, מקש אחורה/קדימה/עצור (Back/Forward/Stop) וניווט (Navigation).
3. סרגל כלים-סרגלי כלים של גוגל, MSN, Firefox extensions וכדומה תופסים מקום על המסך.
4. כאמור קודם לכן, ישנם צופים אשר אינם רוצים להשתמש בפס גלילה אנכי ולכן הרוחב המקסימלי של האתר צריך להיות 330 פיקסלים לרזולוציה
ל 800/600 ו-500 פיקסלים לרזולוציה של 1024/768.תוכל לסטות בכ-5 פיקסלים. אלו גם הגבהים (בפיקסלים) של אורך הפיקסלים בתוכן האתר אשר יאפשרו צפייה בלא צורך להשתמש בפס הגלילה.

עקרונות עיצוביים

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

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

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

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

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

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

קדימה לעבודה

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

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

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

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