בניית דפים פנימיים

מבוא

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

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

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

הצבעים לאתר יכולים להיות הצבעים של המותג, עם שילוב של שחור (לפעמים), לבן, גרפיט (אפור כהה – #2c2c2c) ופנינה (אפור בהיר מאוד – #f5f5f5) – שמהווים צבעים ניטרליים שיכולים להשתלב בעיצוב.

סט הבסיס

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

הסט כולל:

  • 5 תמונות רקע מלא עם פייד לימין
  • 5 תמונות רקע מלא עם פייד לשמאל
  • 3 תמונות רקע מלא שקוף בהיר
  • 3 תמונות רקע מלא שקוף כהה
  • 5 תמונות רקע מלא (למעברים)

מבנים מומלצים לשימוש

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

להלן כמה מבנים נפוצים:

  • מבנה 1/2-1/2 (פיצול הרקע)
  • תמונה-טקסט, טקסט-תמונה
  • שיבוץ סרטון (ברוחב ה-GRID)
  • פס תמונות (רוחב מלא)
  • טופס / קריאה לפעולה (CTA)
  • גלריית תמונות (רוחב מלא, או משבצות)
  • סט של משבצות עם גלילה למטה
  • סט של אייקונים (עם אופציה לגלילה למטה)
  • אייקון ולצידו טקסט (אפשר לחזור על המבנה הזה כמה פעמים)

שיבוץ טקסט

כאשר משבצים טקסט, יש להקפיד על שימוש נכון בכותרות (פירוט מטה), פיצול לפסקאות (לחיצה של Enter להפרדה בין הפסקאות כדי שהטקסט לא יהיה בגוש אחד) והדגשות לטקסטים שנרצה להבליט.

שימוש נכון בכותרות

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

כמו כן, יש להקפיד על היררכיה בכותרות העמוד: כותרת H1 אחת לעמוד בלבד, כותרות H2 לאורך העמוד, כותרות H3 תחתיהן לפי הצורך, וכותרות H4 לאייקונים / פוסטים זה מקובל.

שיבוץ תמונות

כאשר אנחנו משבצים תמונה, נוכל (לפי הסגנון של האתר) להוסיף לתמונה פינות מעוגלות (באמצעות הקלאסים), מסגרת, או צל שטוח (אפשר גם בצבעי האתר).

גודל התמונות יכול להיות רוחבי (גודל 800X600), רוחב גריד (1200X400), או לחלופין ריבועי (כך 600X600) או אפילו ארוך (כך 400X600 לדוגמא).

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

כיוונים נוספים והערות כלליות

אפשר לשלוף דברים מדף הבית עם וריאציה קטנה ולשלב בדפים הפנימיים.

אפשר (ומומלץ) לשלב קריאה לפעולה בכל העמודים המרכזיים – כך טופס מקוצר ליצירת קשר, עם קריאה לפעולה רלוונטית לאותו העמוד.

אפשר לשבץ פרלקסים למעבר (תמונת פרלקס שמחברת בין 2 אזורים, ללא תוכן, רק מרווח Divider).

אפשר לשבץ תמונות מרחפות כאלמנט עיצובי לעמודים.

x
סייען נגישות
הגדלת גופן
הקטנת גופן
גופן קריא
גווני אפור
גווני מונוכרום
איפוס צבעים
הקטנת תצוגה
הגדלת תצוגה
איפוס תצוגה

אתר מונגש

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

סייגי נגישות

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

רכיב נגישות

באתר זה הותקן רכיב נגישות מתקדם, מבית all internet - בניית אתרים. רכיב זה מסייע בהנגשת האתר עבור אנשים בעלי מוגבלויות.