טיפים לשימור יחסים בין מעצב למתכנת

[wmw]

http://webmaster.org.il/articles/how-to-build-psd-for-web

מאמר נחמד

מהיסטוריית הגולשים בפורום שלנו, יש המון עוד מה להוסיף...

 

[contrast]

אפשר להעלות לחסומים?

 

[wmw]

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

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

הנה זה בא, לא בהכרח לפי סדר חשיבות:

לא להשתמש בגדלי פונטים בחצאים, כמו 11.5 אלא במספרים שלמים בלבד. כנ"ל לגבי מרווחי שורות וקרנינג
במידה והחלטתם לבנות את העיצוב בתוכנה שלא קוראים לה פוטושופ, חשוב להקפיד לייבא את העיצוב בסופו של דבר לפוטושופ, ולדאוג שכל הטקסטים ישמרו חיים
במידת האפשר, לא לשחק עם opacity של טקסט חי סתם כדי להבהיר אותו, כיוון שכשאנחנו דוגמים את הצבע מתוך הגדרות הפונט - הוא נותן את הצבע המקורי ולא הבהיר יותר
לשלב את כל הסטייטים של המעבר עכבר וה-Selected בתוך ה-PSD עצמו. רצוי ליצור שיכבה עליונה ביותר שבה יהיו מעיין בועות חצי-שקופות שיסמנו על אילו כפתורים או לינקים יש סטייטים כאלה, כדי שנדע לחפש עבור אותו כפתור את הסטייטים המתאימים
לזכור שסטייטים של מעבר עכבר אינם מופעלים במכשירים מבוססי מגע
להקפיד לסכם עם הלקוח את הרזולוציה המתאימה, גם ברוחב במסך וגם מבחינת מה נכנס בפולד. אפשר לשמור את העיצוב כתמונה ולהעלות לאתר http://mocku.ps וכך המעצב והלקוח יכולים לקבל תחושה איך האתר יראה בתוך הדפדפן ברזולוציות שונות.
לפני שימוש בפונט מיוחד, יש להחליט אם הכוונה היא שהוא יהיה כותרת-תמונה או טקסט-חי (לקחת בחשבון שיקולי SEO). במקרה של טקסט חי – יש הכרח לוודא שקיימת גירסאת Web לפונט (חינאמי או ברכישה חד-פעמית / subscription) ולוודא שהלקוח מוכן לשאת בעלות הזו
בקוביות המכילות תמונות, שהלקוח מתכוון להעלות ע"ב שוטף דרך המערכת ניהול, יש לקחת בחשבון שהלקוח בד"כ מעלה תמונות בפרופורציה של מצלמה דיגיטאלית. אם הלקוח מבין ויודע שהוא צריך להעביר כל תמונה עיבוד גרפי שיתאים לפורמט שונה - סבבה, אבל אם לא - רצוי לשמור בתמונות כאלה על יחס רוחב-גובה של מצלמה דיגיטאלית, וכמובן להתייחס לתמונות מאוזנות ואנכיות
Last but not least - חשוב לסגור פוטר ראוי לאתר, שכולל את פס "כל הזכויות שמורות" והקרדיטים. טוב שהלקוח יראה את התמונה המלאה והכוללת בתוך העיצוב, ולא שנוסיף את הדברים בדיעבד
זהו, נקווה שבזה הצלחתי להפחית לפחות 5% מהיקף סבבי התיקונים שמתכנתים רגילים לקבל בעקבות הנקודות האלה, שלהם נראות מאוד טריוויאליות מלכתחילה

 

[KingYes]

תסדר את השורות.. שמת הכל בשורה אחת.