960gs נעים להכיר

לא נעים להודות אבל מיקום של אלמנטים בתוך דף HTML תמיד היה מעצבן , עבודה שחורה ויותר מהכל תמיד זה היה זז פיקסל לפה או לשם ונותן את ההרגשה שצריך להעמיד חוזה על ראשם של מפתחים של דפדפנים שונים (שמעתי IE ברקע ?). אחרי שסיימנו להוציא את העצבים על דפדפן כזה או אחר אנחנו חוזרים לקובץ ה PSD שקיבלנו מהמעצב ומגלים שגם הוא פיספס בכמה פיקסלים לפה או לשם.

בקצרה , עבודת CSS היא עבודה מעצבנת ,מונוטנית ובאופן כללי גורמת להרבה עצבים ושלא בצדק….

אז אני שמח להציג את הדבר הגדול הבא !!! שפותר את כמעט כל הבעיות של המיקומים בדף….

960gs הוא רעיון גאוני (framework של css) שהולך ותופס תאוצה בזמן האחרון והוא מאפשר בקלות יחסית לעמד כל עיצוב ללא שום בעיות ואפילו בקלות מבלי להתעסק עם מרווחים ובעיות תאימות של דפדפנים….

אז איך הרעיון הזה עובד ?

בגדול אם נקח גודל סטנדרטי של רוחב אתר כללי בגודל 980px כאשר המקום של התוכן הוא 960px (הגדלים לא כל כך רלוונטים) ונצייר עמודות לכל רוחב העמוד עם מרווחים קבועים כלומר נניח שכל עמודה היא ברוחב של 60 עם רווח של 5 PX מכל צד נקבל כ 12 עמודות (להם נקרא לצורך העניין container_12)

עכשיו יש לנו את הבסיס של הפסים שלפיהם המעצב יעבוד ויכניס את האלמנטים בדיוק ברוחב וכל מה שנשאר לנו לעשות זה לכתוב 3 וחצי שורות קוד בשביל להתאים את העימוד של העיצוב , אם טבלה נמצאת בגודל של 4 פסים אז נשתמש בצורה הבאה

1
2
3
4
5

<div class="container_12">
<div class="grid_4">side bar here</div>
<div class="grid_6">page_content</div>
<div class="grid_2">small_side_bar</div>
</div>

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

כמובן שמיותר לציין שהקבצים הם לשימוש חופשי, אז תהנו