סתם אתר יפה שראיתי
ממש התרשמתי מהעיצוב של האתר של Template Toolkit (צילום מסך בהמשך). ויותר משהעיצוב ממש יפה, הוא עשוי ממש טוב וכולל כל מה שאפשר לרצות מאתר תואם סטנדרטים, וכמה דברים שלא ידעתי שאני רוצה :-).
הנה תמונת מסך וניתוח קצר של כל הדברים המגניבים שיש שם:
- בוחר עיצוב CSS: הוא נראה מצוין והוא עובד מצוין: קופסת הצבע המתאימה לעיצוב הנוכחי בולטת, ובמעבר של העכבר על קופסת צבע אחרת, היא קופצת החוצה כדי שילחצו עליה. בלחיצה על קופסת צבע וכל האתר הופך לצבע המתאים. נקודת בונוס: העיצוב נראה מצוין בכל צבע (לא ממש אהבתי את הירוק, אבל זה בעיה של טעם אישי – בשביל זה בדיוק המציאו מחליפי עיצוב).
- סרגל נתיב: מראה את הנתיב לעמוד באתר ומאפשר לנווט כלפי מעלה. העיצוב נראה נהדר, אם כי הסרגל אינו במראה קלאסי של סרגל נתיב, במקום זה הוא נראה כמו טאבים: דבר שיכול לבלבל אנשים שרגילים לטאבים ולגרום להם לחשוב שזה לא סרגל נתיב אלא דפדפת טאבים. זו הנקודה החלשה היחידה באתר.
- תפריט ניווט ראשי: מחולק לקטגוריות הירארכיות כשהקטגוריות שבנתיב של המסמך מסומנות בברור – מעולה. העיצוב מצוין, עם אפקטים של שקיפות, roll-over ובשביל נקודות בונוס, העיצוב נופל בקלות לרשימת נקודות בדפדפנים שלא תומכים בשקיפות. חוץ מזה גם הלוגו של האתר (מעל התפריט) ממוקם מעולה בלי להפקיע שטח מסך מהתוכן ויש לו אפקט roll-over חביב.
- מיני ניווט: מאפשר לדפדפף קדימה ואחורה בקלות בדפים הקשורים אחד לשני, לדוגמה: במדריך למשתמש. יש אפקט roll-over כמו בכל שאר הכפתורים באתר ועזרה מקוונת על השימוש של כל כפתור מופיעה בבועית דיבור של הגירית שמשמאל. העיצוב מקבל המון המון נקודות בונוס על הכפתור הקטן והלא מודגש מעל כפתורי המיני ניווט, שבלחיצה עליו כל הכרום הצבעוני מסביב לתוכן נעלם והתוכן מקבל את כל המסך לרשותו. מעולה.
- כותרות של תוכן: יש להן אפקט roll-over כמו בכל שאר האתר, והן גם מכילות אפקט של קיפול התוכן. על מנת להציג את העיצוב במלואו, קיפלתי את כל הפסקאות חוץ מרשימת התוכן, אבל בלחיצה על כפתור הפלוס, הפסקה נפתחת בחזרה. יש כמובן גם tooltip שמסביר מה זה עושה.
- באנרים: הם קיימים, אבל לא מפריעים והצבע שלהם מותאם לעיצוב. במעבר עם העכבר, התמונה מוחלפת בתמונה המקורית של הבאנר (בצבעים מלאים).
- מיני ניווט תחתון: כשהתוכן מאוד ארוך וקוראים את הדפים אחד אחד, קל יותר לדפדף מהתחתית – קוראים מלמעלה עד למטה ואז אפשר לעבור לעמוד הבא בלי לחזור למעלה שוב. הרבה אתרים (בעיקר בלוגים) עושים כאן טעות נוראית ומאפשרים לדפדף רק בראש העמוד – כשהקורא מגיע לתחתית העמוד יש לו שתי אפשרויות: לגלול בחזרה למעלה איפה שנמצאים כל הקישורים המעניינים כולל תפריט הצד והניווט, או לעזוב את העמוד. מכיוון שרוב האנשים עצלניים אז רוב האנשים יעדיפו לעזוב.
- גירית: סתם קמע משעשע, אבל היא גם “מדובבת” את כפתורי המיני ניווט העליונים, ומעירה הערות מצחיקות כשמנסים לבחור כפתור שאינו פעיל.
מלבד הנקודות הספציפיות, האתר מתנהג מאוד יפה כשמשנים את הגודל של המסך או הגופן ומלבד ההערות בתחתית העמוד שקצת מתחרבשות לפעמים, כל התוכן והעיצוב שורד כל הפרדה או גודל גופן. נקודות בונוס העיצוב מקבל על כך שהוא מאפשר הפצה תחת רשינות הקוד הפתוח של Perl וה-GNU General Public License (אני לא בטוח מה ה-GPL עושה לטובת עיצוב אתר מעבר לרשיון BSD ודומיו, אבל שיהיה).
לדעתי העיצוב הזה יפה פונקציונאלי ומשרת בצורה מצוינת את מטרות האתר (שהוא אתר לכלי לתבניות לאתרים) ובהנחה שהאתר אכן בנוי בעזרת אותו תוכנה, אז הוא גם פרסומת מצוינת לתוכנה. הסכיתו וראו – כך צריך לעשות את זה.
שני דברים, בזמן האחרון אני רואה רק תמונה של compiz-fusion ולא שום דבר אחרון אצלך בבלוג.
דבר שני, כשבניתי את ה “CMS” שלי, די התלבטתי בין השיטה הזו לבין השיטה בה אני עובד כיום… אני החלטתי לא ללכת לשיטה הנ”ל היות והיא שפה בתוך שפה, ולפעמים היא יוצרת הרבה בעיות (שנתקלתי בהן באתר מסויים).
אבל כנראה שלכל דבר יש יתרונות וחסרונות, והשלאה תמיד היא מה עדיף…
מצטער, פאשלה שלי – זה מה שקורה כשכל התמונות שאני משתמש בהן נקראות Screenshot.png 😉
תיקנתי עכשיו – תודה על ההערה, לא הייתי שם לב לזה אחרת.
איזו שיטה אתה מתכוון ? לתבניות ? יש עם זה קצת בעיה – מצד שני, אני לא מתנגד לתבניות באופן עקרוני: אם מישהו אחר עשה את העבודה של האינטגרציה עם מערכת תבניות ובמוצר שאני מקבל הרבה יותר קל לערוך את העיצוב, אז אני בסדר עם זהץ