עיצוב אתרים - מדריך למעצב המבולבל

חלק א' – השראה, קומפוזיציה וייחודיות

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

השראה זאת לא בושה

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

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

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

גריד לוריד

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

אל תהיו מרובעים

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