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