|
|
|
עיצוב לאינטרנט מול עיצוב לדפוס
|
|
המאמר נכתב על ידי נורית תנעמי, מעצבת גרפית בחברת Netwise – ינואר 2006
|
|
|
תקציר המאמר:
העיצוב לאינטרנט והעיצוב לדפוס באים מאותו עולם – אך השונות שלהם גדולה. מעצבים שעבדו לאורך זמן בעיצוב דפוס ומעונינים לעצב עבור האינטרנט יתקלו במגבלות אותן לא הכירו קודם. חוסר הכרות עם הבדלים בין העיצוב לדפוס לעיצוב לאינטרנט עלול לגרום לכך שהתוצרים הגרפיים יהיו בלתי ישימים עבור העיצוב לאינטרנט.
מאמר זה שופך אור על ההבדלים העיקריים בהם ייתקלו מעצבים במעבר בין שני העולמות ויסייע במעבר בין עולם הדפוס לעולם האינטרנט.
|
|
|
|
ההבדלים המרכזיים בין העיצוב לדפוס לעיצוב לאינטרנט
|
|
|
|
|
טיפוגרפיה
|
|
|
תמונות
|
|
|
סטטיות ודינמיות
|
|
|
התוצר הסופי
|
|
|
|
|
טיפוגרפיה: סוגי הגופנים
|
|
|
|
בעולם הדפוס קיים מגוון עצום של גופנים. כשמעצבים באים ליצור, הם בוחרים מתוך מאגר הגופנים המותקנים במחשב ללא כל הגבלה.
|
|
|
בעולם האינטרנט צריכים מעצבים גרפים להתפשר בנושא הגופנים. קיימים שני גופנים קבועים (אריאל -Arial ודויד -David ) בהם יוכלו המעצבים להשתמש לטקסטים דינמיים ((html בעברית, הנתמכים ונראים זהים בכל המחשבים.
גופן שאינו מותקן על המחשב יראה כמלל שאינו קריא: "ג'יבריש". גופנים אחרים שקיימים במחשב מלבד אריאל ודויד, יראו את הטקסט אך יהיו קשים או בלתי אפשריים לקריאה.
אם המעצבים יירצו להשתמש בגופן שאינו נתמך במחשבים של המשתמשים באתר, הם יצטרכו להפוך אותו לתמונה (jpg או gif) ובכך "לשלם" בעליה במשקל הכולל של האתר.
|
|
|
|
טיפים לשימוש בגופנים בעיצוב אינטרנט
|
|
|
|
|
הגופן המומלץ ביותר לטקסט בעברית הוא אריאל – הוא הקריא ביותר.
|
|
|
יש לשמור על כמות סבירה של טקסט שהפך לתמונה כדי לא להכביד על עליית האתר .
|
|
|
|
|
תמונות: איכות ומיקום
|
|
|
צפיפות פיקסלים בדפוס: המעצבים לדפוס יעדיפו לעבוד עם תמונות שצפיפות הפיקסלים בהם גבוהה 150 עד 300 dpi, כדי שהתוצר הסופי יראה איכותי.
גודל התמונה בדפוס: גודל התמונה בה ייבחרו יכול לנוע מקטנטן (בול דואר) ועד לענק (שלט חוצות).
מיקום התמונה: מיקום התמונה חופשי לחלוטין ואינו מוגבל בטבלאות או משקל.
בבואו לעצב אתר יתקל המעצב בהבדלים משמעותיים:
|
|
|
|
|
צפיפות פיקסלים באינטרנט: צפיפות הפיקסלים בתמונה המופיעה באתר לא תעלה על 72 dpi. זוהי גם הצפיפות הנראית במסך, כך שאין טעם לעבוד עם תמונה איכותית יותר כיוון שהיא תיראה אותו דבר.
|
|
|
גודל התמונה בדפוס: צפיפות הפיקסלים וגודל התמונה יקבעו את משקלה הסופי ולמשקל התמונה חשיבות מכרעת באתרי אינטרנט. ככל שהתמונה גדולה יותר ומספר התמונות באתר רב יותר, יעלה האתר באיטיות רבה יותר.
|
|
|
מיקום התמונה: מיקום התמונה ישפיע על תכנון הדף וככל שמיקום התמונה חופשי יותר (אינו קבוע או סיסטמטי), ייאלצו המתכנתים למצוא פתרונות יצירתיים יותר כדי לשלב את התמונות באתר בצורה יעילה. לעיתים פתרונות כאלה דורשים זמן ומאמץ רב והם מעכבים את יעילות העבודה.
|
|
|
|
|
טיפים לעיצוב תמונות
|
|
|
|
|
שמרו על צפיפות פיקסלים נמוכה בתמונות
|
|
|
זכרו תמיד שמישהו צריך לבנות את מה שעיצבתם
|
|
|
למדו את עיקרי עבודת המתכנתים, זה יקל על כולכם
|
|
|
|
|
סטטי ודינמי
|
|
|
|
הדפוס הוא עולם סטטי וחושי. המעצבים זוכים למשש את התוצר, לדפדף בקטלוג אותו עיצבו, לבחור את סוג הדף, להוסיף אפקטים שונים ולהיות שם במלוא חושיהם. העיצוב עצמו נעשה על מחשב, אך בסיום התהליך עובר המוצר מהמחשב אל הנייר.
|
|
|
|
בעולם האינטרנט יוצרים המעצבים יצירה דינמית, היא יכולה להשתנות בכל עת, לדוגמא: באמצעות החלפת תמונות באתר או באמצעות שינויי הטקסטים. היצירה הדינמית של המעצבים עשויה להיות אינטראקטיבית. לדוגמא: היא יכולה להיות פרסומת קופצת, אלמנט בתוכנת פלאש או סרטון וידאו.
|
|
|
|
בעיצוב לאינטרנט התוצר הסופי אינו משנה מדיה. תהליך ההכנה והמוצר הסופי מופיעים שניהם על אותו מסך מחשב והעיצוב יהיה תמיד זהה לסקיצה. כך תוכלו כמעצבי אינטרנט לראות את המוצר הסופי זמן רב לפני היותו מוכן לעלייה ל"אוויר". זהו יתרונם של המעצבים לאינטרנט.
|
|
|
|
התוצר הסופי
|
|
|
בתום העבודה מוסרים המעצבים הגרפיים העוסקים בדפוס את התוצר – כקובץ, לבית הדפוס. הקובץ הנמסר נעול ואין דרך לשנות או לתקן אותו. על כל תיקון צריכים המעצבים לחזור אל הקבצים המקוריים, לבצע את התיקון, לנעול מחדש ולמסור שוב את המוצר המוגמר אל בית הדפוס. תהליך זה מסמיך את המעצב להיות האחראי הסופי לתוצר.
בעיצוב לאינטרנט סיום העיצוב הוא רק תחילתו של התהליך. למעצבים נותרה עוד עבודה רבה:
|
|
|
|
|
לחתוך את התמונות כדי שהמתכנתים יוכלו לשתול אותן בתוך הדפים
|
|
|
להגיש למתכנתים מסמכים המציינים את הקוד המספרי של הצבעים המופיעים באתר
|
|
|
למדוד ולרשום את המרווחים בין האלמנטים השונים
|
|
|
לציין את סוג הגופן בו השתמשו לאינפורמציה ה"משתנה"
|
|
|
לציין את גודל הגופן במקומות השונים
|
|
|
לבדוק את התוצר אחרי עבודת המתכנתים ולתקן את השגיאות
|
|
|
|
|
טיפים לשלב התוצר הסופי
|
|
|
|
|
הסתיים העיצוב? זכרו אחריותכם לא תמה
|
|
|
בדקו תמיד את עבודת המתכנתים בסיומה
|
|
|
|
