Webist
  • קורס בניית אתרים בוורדפרס
  • בלוג
    • בניית אתרים
      • וורדפרס
      • בניית חנות וירטואלית
      • דפי נחיתה
      • מערכות ניהול תוכן
    • קידום אתרים
    • עיצוב אתרים
    • אחסון אתרים
      • מדריך Cpanel
      • אחסון קבצים
      • גוגל אנליטיקס
    • כללי
      • ברשת
      • כלים חינמיים
  • צור קשר
  • שירותים
    • בניית אתרים בתשלום חודשי
    • בניית אתרים חינם בגוגל
    • קידום אתרים
    • פרסום בגוגל
  • קורס בניית אתרים בוורדפרס
  • בלוג
    • בניית אתרים
      • וורדפרס
      • בניית חנות וירטואלית
      • דפי נחיתה
      • מערכות ניהול תוכן
    • קידום אתרים
    • עיצוב אתרים
    • אחסון אתרים
      • מדריך Cpanel
      • אחסון קבצים
      • גוגל אנליטיקס
    • כללי
      • ברשת
      • כלים חינמיים
  • צור קשר
  • שירותים
    • בניית אתרים בתשלום חודשי
    • בניית אתרים חינם בגוגל
    • קידום אתרים
    • פרסום בגוגל
ווביסט ● בניית אתרים ● חשיבות ה – CSS בעיצוב אתרים

חשיבות ה – CSS בעיצוב אתרים

יוסי ג'אנה אוקטובר 19, 2010 2:03 am 3 תגובות

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

[adsense]

מעצבי אתרים אומנם התמודדו עם שלל הבעיות, אך הפתרונות היו מאולצים. עיצוב אתרים היה סביר, אך הדרך להגיע לעיצוב הסופי הייתה מסורבלת ומנעה דברים נוספים. האתר היה לא גמיש, לא הותאם לגודל החלונות, וכדומה. הפתרון הנפוץ בקרב מעצבי האתרים היה בשימוש בטבלאות רבות על מנת למקם את הטקסט במקומות הדרושים. הטבלאות לא נועדו במקור לעיצוב, לכן התחזוקה של אתר כזה הייתה קשה ומסורבלת וכמובן גם לא מותאמת למנועי חיפוש.
פתרון זה לא חביב על המעצבים, והם חיפשו פתרונות חלופיים. בסופו של דבר השאלה הייתה – מי ישלוט בעיצוב האתר – המשתמשים או המעצבים? בסופו של דבר ארגון ה – W3C התערב בשאלה וקבע לטובת המעצבים. הצעת הארגון הייתה פשוטה – להפריד בין העיצוב לתוכן. בצורה כזאת המעצבים יתעסקו בעיצוב, ואנשי התוכן בתוכן. על מנת לבצע את ההפרדה הנ"ל נולדה שפת ה – CSS .
'CSS או בשמו המלא Cascading Style Sheets, הינו בעצם סדרה של חוקים. חוקים אלה נועדו לעצב את עמוד האינטרנט או את האתר כולו בצורה שתוכננה על ידי המעצב. כל דפדפן התומך ב – CSS מונחה על ידי חוקים אלה כיצד להציג את התוכן אותו הוא מקבל משרת ואמור להציג לגולש. הוראות עיצוב יכולות להיות משובצות בתוך קוד ה – HTML או להיות מרוכזות בקובץ CSS נפרד. בצורה כזאת קובץ CSS בודד יכול להכתיב את העיצוב לאתר שמכיל אלפי עמודי אינטרנט.
לסיכום, CSS הוא שפה חשובה בתחום של עיצוב אתרים. כל האתרים היום נעזרים ב – CSS על מנת להפריד את העיצוב מהתוכן. בצורה כזאת ניתן להתגבר על מגוון בעיות עיצוביות. כל מעצב אתרים מתחיל חייב להכיר את CSS בצורה טובה.

דוגמה ליצירת דף html + Css פשוט:

מסמך html.

  1. <html>
  2. <head>
  3. <title>Untitled Document</title>
  4. </head>
  5. body>
  6. <p>
  7. ווביסט – אני חי אינטרנט !
  8. </p>
  9. </body>
  10. </html>

קובץ Css:

  1. body {
  2. font-family:Arial, Helvetica, sans-serif;
  3. font-size:22px;
  4. }
  5.  
  6. .zero {
  7. width:400px;
  8. margin: 0 auto;
  9. }

חיבור בין html ל-Css:

  1. <link rel="stylesheet" type="text/css" media="all" href="style.css" />

תוצאה מלאה והמושלמת:

  1. <html>
  2. <head>
  3. <title>Webist</title>
  4. <link rel="stylesheet" type="text/css" media="all" href="style.css" />
  5.  
  6. </head>
  7. </body>
  8.  
  9. <div class="zero">
  10. ווביסט – אני חי אינטרנט !
  11. </div>
  12. </body>
  13. </html>
css html בניית אתרים מעצב עיצוב עיצוב אתרים
« פוסט קודם
פוסט הבא »

3 תגובות

  1. אלונה הגב אוקטובר 19, 2010 בשעה 2:14 am

    אחלה פוסט, כמו תמיד

  2. אורי זילברשטיין הגב אוקטובר 19, 2010 בשעה 10:46 am

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

  3. רפאל הגב אוקטובר 21, 2010 בשעה 3:44 pm

    אהלן יוסי,
    איפה אני יכול ללמוד יותר על Css? מצאתי באתר כמה מדריכים אבל אתה כותב מנקודת הנחה שאנשים יודעים את המושגים שאתה מזכיר שם. לצערי אני לא מגיע מחום התכנות ולכן אשמח אם תוכל לכוון אותי איפה אפשר ללמוד יותר על Css

השארת תגובה

ביטול

צור איתנו קשר
בניית אתרים
בנה אתר מקצועי עכשיו
עשה קליק
קידום אתרים
קדם אתר בגוגל
קבל מחיר ותוצאות
פרסום בגוגל
פרסום היחיד שעובד חזק
קבל מחיר ותוצאות
הקודם
הבא
קטגוריות בבלוג
  • קידום אתרים
  • בניית אתרים
  • וורדפרס
  • תוספים של וורדפרס
  • עיצוב אתרים
  • שרתי אחסון
  • אחסון אתרים
  • אחסון קבצים
  • בניית חנות וירטואלית
  • ברשת
  • גוגל אנליטיקס
  • דפי נחיתה
  • מדריך Cpanel
  • קוד פתוח
פוסטים אחרונים
  • אז מה חדש בוורדפרס 4.0 ועד 4.7?
  • איך פותחים כתובת מייל ממותג בשרת – Cpanel
  • איך מתחברים לחשבון Cpanel בשרת אחסון
  • תוסף וורדפרס לבדיקת ביצועים – P3 💯
  • Facebook סוגרת פיצ'ר הנפוץ של Like Box
iDox סוכנות דיגיטל
Webist.co.il - כל הזכויות שמורות 2008 - 2017
גלילה לראש העמוד