אין לכם גישה לתוכן זה

לקבלת גישה לשיעור זה, יש לבחור מסלול מתאים ולהירשם תחילה

תוכן הקורס

מה נלמד בשיעור הזה?

  • נתחיל את ההתאמה למובייל עם עיצוב הHeader
  • נסגנן את התפריט כולל האייקון פתיחה והלוגו
  • נעבור להתאמה למובייל של גוף הדף שלנו. נייצא את תמונת הרקע של הHero בהתאמה למובייל
  • נלמד איך להשתמש בCSS שמותאם למובייל (מוזמנים להעתביק את הקוד מהאקורדיון CSS פה למטה)
  • נתאים את האייקונים בשירותים שלנו
  • נמשיך להתאים את כל הסקשנים הנותרים בהתאם לעיצוב
  • נתאים גם את הFooter למובייל

וקצת יותר בפירוט...

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

 

בהמשך נעבור להתאמה למובייל של גוף הדף, תוך ייצוא תמונת הרקע של ה-Hero Section בגרסה שמתאימה לניידים. נלמד כיצד להשתמש בקוד CSS מותאם למובייל כדי לנהל עיצוב דינמי ויעיל (עם קוד זמין באקורדיון CSS לשימוש מהיר). נוודא שגם האייקונים בסקשן "השירותים שלנו" מותאמים למובייל, כך שהם ישמרו על מראה נקי וקריא.

 

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