גליונות סגנון מדורגים הפכו לדרך הסטנדרטית לאתרי סגנון ועיצוב. מעצבים משתמשים גיליונות סגנונות לספר לדפדפן כיצד אתר צריך להיות מוצג מבחינת מראה ותחושה, המכסה גורמים כמו צבע, ריווח, גופנים ועוד.
סגנונות CSS פורסים בשתי דרכים:
- מוטבע - בתוך הקידוד של דף האינטרנט עצמו, על בסיס אלמנט אחר אלמנט
- במסמך CSS עצמאי, אליו מקושר האתר
שיטות עבודה מומלצות עבור CSS
"שיטות עבודה מומלצות" הן שיטות העיצוב והבנייה של אתרים שהוכחו כיעילות ביותר ונותנות את התמורה המרבית לעבודה הכרוכה בכך. עוקב אחריהם ב CSS בעיצוב אתרים עוזר לאתרים להיראות ולתפקד בצורה הטובה ביותר. הם התפתחו עם השנים יחד עם שפות וטכנולוגיות אינטרנט אחרות, וגיליון הסגנונות העצמאי של CSS הפך לשיטת השימוש המועדפת.
ביצוע שיטות עבודה מומלצות עבור CSS יכול לשפר את האתר שלך בכמה דרכים:
- מפריד בין תוכן לעיצוב: אחת המטרות העיקריות של CSS היא להסיר אלמנטים עיצוביים מ- HTML ולמקם אותם במיקום אחר לשמירה על המעצב. נוהג זה משמש גם להפריד בין מעצבים למפתחים, כך שכל אחד מהם יכול להתמקד בתחומי ההתמחות שלהם. מעצב לא צריך להיות מפתח בכדי לשמור על מראה האתר.
- מקל על התחזוקה: אחד האלמנטים הנחשבים ביותר בעיצוב אתרים הוא תחזוקה. בניגוד לחומרים מודפסים, אתר לעולם אינו "אחד ונגמר". תוכן, עיצוב ותפקוד יכולים וצריכים להתפתח עם הזמן. קיום ה- CSS במקום מרכזי, ולא מפוזר ברחבי האתר, מקל על התחזוקה.
- שומר על נגישות האתר שלך: שימוש בסגנונות CSS מסייע למנועי חיפוש ולאנשים עם מוגבלויות ליצור אינטראקציה עם האתר שלך.
- משמר את האתר שלך ארוך יותר: על ידי שימוש בשיטות עבודה מומלצות עם CSS, אתה מקיים סטנדרטים שהוכחו כי הם יציבים אך גמישים מספיק בכדי להתאים לשינויים בסביבת עיצוב האתרים.
סגנונות מוטבעים אינם שיטות עבודה מומלצות
סגנונות מוטבעים, אמנם יש להם מטרה, אך בדרך כלל אינם הדרך הטובה ביותר לתחזק את האתר שלך. הם מנוגדים לכל אחת מהשיטות הטובות ביותר:
- סגנונות מוטבעים אינם מפרידים בין תוכן לעיצוב: סגנונות מוטבעים זהים לחלוטין לגופן מוטבע ולתגי עיצוב אחרים ומגושמים שמפתחים מודרניים מעקים עליהם. הסגנונות משפיעים רק על האלמנטים הספציפיים היחידים עליהם הם מיושמים; אמנם גישה זו עשויה לתת לך שליטה פרטנית יותר, אך היא מקשה גם על היבטים אחרים של עיצוב ופיתוח - כמו עקביות.
- סגנונות מוטבעים גורמים לכאבי ראש בתחזוקה: כאשר אתה עובד עם גיליונות סגנונות, יכול להיות קשה להבין היכן מגדירים סגנון. כשאתה מתמודד עם תערובת של סגנונות מוטבעים, מוטבעים וחיצוניים, יש לך הרבה מיקומים לבדוק. אם אתה עובד בצוות עיצוב אתרים או שאתה צריך לעצב מחדש או לתחזק אתר שנבנה על ידי מישהו אחר, תהיה לך עוד יותר בעיות. לאחר שתמצא את הסגנון ותשנה אותו, תצטרך לעשות זאת בכל אלמנט בכל עמוד בו הוא הוצב. זה מגדיל את תקציבי הזמן ואת העבודה בצורה אסטרונומית.
- סגנונות מוטבעים אינם נגישים באותה מידה: בעוד שקורא מסך מודרני או מכשיר עזר אחר יוכלו לטפל בתכונות מוטבעות ומתייג ביעילות, חלק מהמכשירים הישנים לא יכולים, דבר שיכול לגרום לאינטרנט המוצג באופן מוזר עמודים. תווים וטקסטים נוספים יכולים להשפיע על האופן שבו הדף שלך נצפה על ידי רובוט מנועי חיפוש, כך שהדף שלך לא מסתדר בצורה טובה מבחינת אופטימיזציה למנועי חיפוש.
- סגנונות מוטבעים מגדילים את הדפים שלך: אם תרצה שכל פיסקה באתר שלך תופיע בצורה מסוימת, תוכל לעשות זאת פעם אחת עם שש שורות קוד בגליון סגנונות חיצוני. אם אתה עושה את זה עם סגנונות מוטבעים, עם זאת, עליך להוסיף סגנונות אלה לכל פיסקה באתר שלך. אם יש לך חמש שורות של CSS, זה חמש שורות מוכפל בכל פסקה באתר שלך. רוחב הפס וזמן הטעינה יכולים להסתדר בחופזה.
האלטרנטיבה לסגנונות מוטבעים הם גיליונות סגנונות חיצוניים
במקום להשתמש בסגנונות מוטבעים, השתמש בגיליונות סגנונות חיצוניים. הם נותנים לך את כל היתרונות של שיטות עבודה מומלצות של CSS וקל לשימוש. מועסקים בדרך זו, כל הסגנונות המשמשים באתרכם חיים במסמך נפרד המקושר למסמך אינטרנט עם שורת קוד אחת. גיליונות סגנונות חיצוניים משפיעים על כל מסמך אליו הם מצורפים. אם יש לך אתר בן 20 עמודים שבו כל עמוד משתמש באותו גיליון סגנונות - ככה זה בדרך כלל נעשה - ניתן לבצע שינוי בכל אחד מאותם עמודים פשוט על ידי עריכת סגנונות אלה פעם אחת, באחד מקום. שינוי סגנונות במקום אחד נוח יותר מחיפוש קוד זה בכל עמוד באתר האינטרנט שלך. גמישות זו מקלה על ניהול האתר לטווח הארוך.