דף הבית -> דף פירוט מדריכים
-> עיצוב לרזולוציות שונות
 
עיצוב לרזולוציות שונות

    חזרה לקפל    שמור על הרזולוציות שלך

מאת מיקל קיי
אז עיצבת אתר מדהים. הוא נראה נהדר על המחשב שלך, ואתה יוצא דופן בכך ששמת את סרגל
הניווט בצד ימין. אבל אם לא תשים לב לרזולוצית המוניטור, חלק מהקהל שלך לעולם לא
יראה את סרגל הניווט הזה ולא יעבור את הדף הראשון.
מאחר שאני עובד על המחשב במשרה מלאה, אני מעדיף להשתמש במקינטוש עם מסך גדול
ורזולוצית צבע טובה. אבל אנשים רבים גולשים ברשת באמצעות מחשב PC ישן ומסך קטן
יותר. מה שהם רואים שונה באופן דרמטי ממה שאני רואה, כך שאני חייב להתייחס להבדלים
האלו בכל מה שאני יוצר.
כשעיצבתי לדפוס, הייתי עובד ללא הפסקה בכדי לוודא שהתוצאה נראית בדיוק כמו שתכננתי.
לפעמים אפילו הייתי נמצא בחדר הדפוס בכדי לראות את המוצר יוצא. כשמעצבים לרשת
לעומת זאת, אין לנו את סוג השליטה הזה על מה שהקהל רואה.
המוניטורים שונים ברמת התמונה שלהם וברזולוציה. (אין לבלבל את זה עם גודל המוניטור
- 15 אינץ', 17 אינץ' וכו' - שיכולים להיות מכוונים לרזולוציות שונות). הגודל שהם
מציגים נמדד בפיקסלים. למרבה המזל, יש כמה גדלים סטנדרטיים, הנפוצים ביותר הם 640
על 480 , 800 על 600 ו1,024 על- 768. אבל חלק מהמוניטורים גדולים יותר או קטנים יותר
מאלה ואפילו בעלי פרופורציות שונות, כמו 640 על 400 . אין שום דרך לבצע התאמה לכל
גודל מוניטור שהוא, אבל זה חשוב לדעת מה יש לרוב המשתמשים.
בימיה המוקדמים של הרשת, חשבנו שעיצוב של 640 על 800 יהיה טוב מספיק כבסיס. רוחב
פיקסל של 600 הפך מאז לסטנדרט לתבנית קבועה. ההבדל בין 640 ל-600 נחשב (או מיוחס)
לכרום של הדפדפן, שהוא הדפדפן עצמו: סרגלי גלילה, כפתורים, שוליים. ברוב המחשבים
הניידים ומחשבי השולחן הפחות טובים שהיו אז, זה הגודל בו השתמשו, אבל אפילו זה היה
ממש הגבול, מכיוון שחלונות הדפדפן באותו זמן נפתחו בברירת מחדל ל רוחב של 520
פיקסלים. לאט, לאט רוחב התצוגה גדל, והיום לרוב הגולשים יש מצג של 800 על 600 או
יותר.
מעצבים שואפים לעצב לגדלים גדולים יותר, אבל בואו לא נפריז. לפי כמה מחקרים (כמו -
"GVU's Tenth WWW User Survy" ו- Web Snapshot ) בין 11 לעד 14 אחוזים מקהל הרשת
כרגע, עדיין לא רואה יותר גדול ממה שנכנס למצג של 640 על 480. הסקרים האלו מתבססים על
היקף נרחב של הגולשים, אבל הם מוגבלים על ידי הידע של המשיבים. אחוז גדול מהמשתתפים
לא ידעו מה הרזולוציה שלהם וענו "לא יודע" או "אחר", כך שהמספרים האלה יכולים בעצם
להיות יותר גבוהים. ורק בגלל שלכמה גולשים יש מוניטורים רחבים מאוד, זה לא אומר שהם
יגדילו את הדפדפן למקסימום גודל.
ממש כמו שיש אנשים שלא רוצים לשדרג לדפדפן החדיש ביותר, כך יש רבים שמהססים לשפר
את המוניטורים שלהם. מוניטור חדש יכול לעלות מ-200$ ומעלה, ואולי גם קצת מאמץ
בהתקנה. כן, יש גולשים שעוברים לתצוגה גדולה יותר, אבל בקצב גדול רק במקצת מאלו
שמהגרים מהארץ. מתי אתה מתכוון לשדרג את תצוגת ה- 800 על 600 שלך?
(הרגע השתמשתי בג'אוה סקריפט בכדי לדעת מה הרזולוציה שלך, ואתה יכול להשתמש בטריק
הזה אם אתה רוצה בכדי ליצור כמה גרסאות שונות של האתר שלך, על ידי הפניית כל מבקר
לדף המתאים - בהנחה שיש לך מספיק זמן ומשאבים. ה"ג'אווה סקריפט סורס" מציע תסריטים
דומים לזה).
השורה התחתונה היא שאתה תמיד צריך לבדוק איך האתר שלך יראה בממדים שונים. זה
חשוב בדיוק כמו להסתכל על האתר שלך דרך דפדפנים שונים ומערכות הפעלה שונים. אתה
יכול לעשות את זה אם המוניטור שלך יכול לעבור לרזולוציות שונות - פשוט תשנה אותו ל
640 על 480 . ישנן גם תוכנות שיתופיות (לחלונות או מקינטוש) שמסמנות את גבולות הדף של
כל גודל שתבחר, בלי לשנות את הרזולוציה שלך.


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



חזרה לקפל
אז באיזה גודל כדאי לך להשתמש? בכדי לענות על השאלה הזו, תן לי לשאול אחת אחרת: מה
אתה רוצה שהקהל שלך יראה? אם אתה עובד על אתר אומנותי שלא תלוי במשיכת קהל
מבקרים גדול, אתה יכול להיות יותר נועז בהתאמה שלך. אם אתה מעצב לקהל ענק, אתה רוצה
להיות בטוח שאת החלק החשוב ביותר של העמוד (כמו קופסת החיפוש באתר חיפוש)
הגולשים יראו מייד, ללא כל מאמץ נוסף מלבד הדפסת הURL. ואז אתה צריך להתמודד עם
המסחר.
אתרים גדולים רבים היום, אם לא כולם, קושרים את רוב ההכנסות שלהם למסחר. איך הם
ישלמו את החשבונות אחרת? הדרך הנפוצה ביותר למסחר היא מודעת הפרסומת. כמו בעיצוב
דפוס, כל המפרסמים רוצים את המודעה שלהם במקום הטוב ביותר. וממש כמו בעיתון, אנשי
הפרסום ברשת מדברים על "הקפל".
בעיתון יומי, ה"קפל" הוא איפה שהעיתון מקופל. רק החלק שמעל הקפל נראה לעיין על דוכן
העיתונים, כך שמאמרים חשובים פחות נופלים מתחת לקפל, בגלל שרק קורא מחויב שהוציא
קצת כסף יקרא את החלק הזה. בדפדפן ברשת, מתחת לקפל זה כל מקום אליו אתה יכול לגלול.
מכיוון שגודלי התצוגה משתנים, מיקום הקפל משתנה ממחשב למחשב, וזה נהייה חשוב
מכיוון שהמפרסמים רוצים את המודעות שלהם מעל לקפל - במקום הכי מוערך לצפייה.
תכנון למצג של 640 על 480 הוא נחמד, מינימום שמרני לקפל, אבל עוד 120 פיקסלים מתחת
עדיין ניתנים לצפייה ברוב המצגים (800 על 600 או יותר). הקפל גם מסתובב סביב צד ימין, כך
שכל מה שמוחבא בצד הזה יהיה גם מתחת לקפל. בכדי שהאתר שלך יהיה מה שיותר אפקטיבי,
אתה חייב להתייחס לכל הפקטורים האלו.
יתרון גדול של עיצוב להצגה גדולה יותר הוא שאתה מרוויח מקום מעל לקפל. עדיין, חשוב
לשים את רוב התוכן המשמעותי בתחומי הצגה של 640 על 480.
הממשק הנוכחי של "הוטבוט" רחב מ 600 פיקסלים, אבל רוב התוכן החשוב של האתר מעוצב
לתצוגה של 640 על 480:



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



QUOKKA מראה עיצוב שנראה מאוד מגניב בתצוגה של 1024 על 768 :


אבל אם יש לכם רק 640 על 480 אין לכם מזל במקרה הזה :




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



שמור על הרזולוציות שלך
אבל חכה! ישנם עוד סיבוכים שצריך להתחשב בהם. אם אתה משתמש במסגרות (לדוגמא
לתמונה) באתר שלך, האתגר שלך גדל. חלק הכרום של הדפדפן כבר משתמש בכמות יפה של
מקום מאונך. הוסף מסגרת אחת למודעה ועוד אחד לסרגל ניווט והשאר עם אפילו פחות
מקום. חלק מהגולשים שלך יצטרכו להתאמץ למצוא תוכן.
אני ממליץ על גישה קמצנית למסגרות. השתמש בהם רק אם הם הפתרון הטוב ביותר לעיצוב
שלך. אם אתה חייב להשתמש במסגרות, שמור את המספר שלהם מינימאלי והקדש את רוב
המקום למסגרת החשובה ביותר ופחות לדברים אחרים. שמור דברים כמו סרגל ניווט צרים
ככל האפשר כדי שהתוכן הממשי יהיה קל יותר לקריאה. אין חוק אחד למספר גבולי של
מסגרות. אבל אם 14 אחוז מהקהל שלך משתמש בתצוגה של 640 על 480 והם לא מצליחים
להבין מה קורה פה, אתה צריך להזיז או לצמצם כמה מסגרות.
ואז יש את ה-WEBTV, שמשתמשת ברזולוציה של 560 על 384. החדשות הטובות הן שאתה
לא בהכרח חייב לעצב לגודל הצר הזה, כי אמצעי זה יצמצם את הדף שלך בכדי להתאים לגודל
שלה. אבל זה יכול לעוות את העמוד ולהפוך את עיצוב הגלילה האופקי שלך לסיוט. בדוק איך
הכל נראה לפני מעשה - אתה יכול להוריד תוכנה בחינם שתעשה סימולציה לדפדפן ה-
"טלוויזיית רשת" על ה PC שלך.
עם כל הגורמים האלו שצריך להתמודד אתם, באמת שאין תשובה אחת לשאלה "לאיזה גודל
אני צריך לעצב?" בחלק מהמקרים, אולי תעצב פורמט שמתאים לגודל חלון הדפדפן, בין אם
הוא קטן או גדול (כמו בשימוש בטבלה עם רוחב 100 אחוז). במקרים אחרים, תרצה לשלוט
ברוחב תוכן העמוד. אם האתר שלך עומד להיות מודפס על מדפסת לייזר סטנדרטית, רוחב של
250 פיקסלים יבטיח התאמה על נייר בגודל מכתב. רוחב 600 פיקסלים טוב אם אתה בעיקר
רוצה לוודא שכל מה שנמצא על העמוד ייראה בבת אחת על מוניטור של 640 על 480 או רחב
יותר. זה נכון לרוב הגולשים. ולפעמים אתה רוצה לעצב אתר ברוחב 750 פיקסלים כדי שכל
רוחב הדף שלך ייראה על ידי רוב הגולשים (רוחב 800 ומעלה), אבל עדיין יתאים למצגים
קטנים יותר.
העיצובים הטובים ביותר ברשת לא מסתמכים על תצוגות או בסיסים עקביים. במידה מסוימת,
זה מה שיפה ברשת, מכיוון שיש לגולשים יותר שליטה על הפורמט של האינפורמציה שלהם.
מצד שני, אם אתה מעצב רק בשביל המכנה המשותף הנמוך ביותר, הרשת לעולם לא תתקדם.
עקרון טוב הוא לעצב בשביל רוב הקהל שלך, אבל לוודא שדפדפנים ישנים מתאימים בדרגה
מסוימת.
בכדי להגיע לערמות חומר על שימוש באינטרנט, הבט בשני האתרים הבאים. שניהם מסתמכים
על מאגר גולשים גדול, כך שהם די מדויקים:
StatMarket
GeorgiaTech' Visualization and Usability Center


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