WikiHow זה מלמד אותך כיצד לעצב אתר חלק, בעל מראה מקצועי. למרות שאתה חופשי להחליט על עיצוב האתר שלך, ישנם כמה דברים חשובים שכדאי לך להימנע מהם בעת יצירת אתר.
שלב
חלק 1 מתוך 2: יצירת עיצוב אתרים
שלב 1. החליט אם ברצונך להשתמש ביוצר אתרים
בניית אתר מאפס דורשת הבנה מפורטת של קוד HTML, אך ניתן ליצור אתר באמצעות שירות אירוח חינם כמו Weebly, Wix, WordPress או Google Sites. יוצרי אתרים נוטים להיות הרבה יותר קלים למעצבים מתחילים מאשר HTML.
- אם תחליט לקודד בעצמך, עליך ללמוד קידוד HTML ו- CSS.
- אם אתה לא נעים להקדיש את הזמן והאנרגיה ליצירת אתר משלך, תוכל לשכור מעצב אתרים. שירותי מעצבים עצמאים משתנים מאוד, חלקם גובים לשעה וחלקם לפרויקט, עם טווח כולל של מיליונים לעשרות מיליוני רופי.
שלב 2. צור מפת אתר
לפני פתיחת יוצר האתר, היית צריך לקבוע כמה דפים יש באתר, מה התוכן בכל עמוד והפריסה הכללית של דפים חשובים כמו "בית" ו"אודות ".
יהיה לך קל יותר לדמיין את דפי האתר שלך על ידי יצירת תמונות גסות, לא רק צללים
שלב 3. השתמש בעיצוב אינטואיטיבי
בעוד שרעיונות חדשים בדרך כלל מעניינים, עיצובים בסיסיים צריכים לפעול בהתאם להנחיות הכלליות הבאות:
- יש להציב בראש הדף אפשרויות ניווט (לדוגמה, כרטיסיות מרובות לדפים שונים).
- אם אתה משתמש בסמל התפריט (☰), הוא אמור להיות בפינה השמאלית העליונה של הדף.
- אם אתה משתמש בסרגל החיפוש, מקם אותו ליד הצד הימני העליון של הדף.
- קישורים מועילים (למשל, קישורים לדפי "אודות" או "צור קשר") צריכים להיות בתחתית הדף.
שלב 4. היו עקביים
לא משנה מה הטקסט, לוח הצבעים, עיצוב התמונה והעיצוב שתבחר, הקפד ליישם את אותן ההחלטות ברחבי האתר שלך. משתמשים יופתעו לראות שגופן וצבע הדף בדף "אודות" שונים מאוד מזה המשמש לדף הבית.
- לדוגמה, אם אתה משתמש בצבע רך לדף הבית שלך, אל תשתמש בצבע עז בעמוד הבא.
- שים לב כי השימוש בצבעים בהירים או מתנגשים, במיוחד הצבעים הדינמיים (או הנעים), יכול לעורר התקפים או התקפים אפילפטיים בקרב מיעוט המשתמשים. אם תחליט להשתמש בצבע כזה, הקפד לכלול אזהרת "סיכון להתקף" לפני הדף המדובר.
שלב 5. הוסף אפשרויות ניווט
הצבת קישורים ישירים לדפים חשובים מעל דף הבית תסייע למבקרים חדשים בתוכן החשוב להם. רוב יוצרי האתרים מוסיפים קישור זה כברירת מחדל.
חשוב לוודא שניתן לגשת לכל דפי האתר על ידי לחיצה על אפשרות בתוך האתר במקום גישה רק באמצעות כתובת העמוד
שלב 6. השתמש בצבעים תואמים
כמו כל סוגי העיצוב, גם עיצוב אתרים מסתמך על שילובי צבעים נעימים. לכן, בחירת צבע נושא תואם היא חשובה מאוד.
אם אתה מבולבל, התחל בשחור, לבן ואפור
שלב 7. שקול עיצוב מינימליסטי
הקונספט המינימליסטי מעודד שימוש בגוונים מגניבים, גרפיקה פשוטה, דפי טקסט שחורים על רקע לבן ופחות מעט קישוט. מכיוון שעיצוב מינימליסטי דורש מעט מאוד אלמנטים, זוהי אפשרות קלה לגרום לאתר שלך להיראות מקצועי ואטרקטיבי ללא מאמץ רב מדי.
- רוב יוצרי האתרים מספקים ערכת נושא "מינימליסטית" שתוכל לבחור ממנה בעת יצירת אתר.
- האלטרנטיבה המינימליסטית היא "ברוטליזם", שמשתמש במילים קשות יותר, צבעים עזים, טקסט מודגש וגרפיקה מינימלית. יש הרבה פחות משתמשים בעיצובים ברוטליסטים מאשר מינימליסטים, אבל אם התוכן מתאים, עיצוב זה יכול להיות בחירה טובה.
שלב 8. החל אפשרויות ייחודיות
רכיבי רשת וקווים ישרים הם בחירה בטוחה, אך כמה סגנונות ייחודיים יוסיפו נופך אישי ויבדילו את האתר שלך משאר.
- אל תפחד להתגבר על המגמה על ידי הצבת אלמנטים לא אסימטריים של האתר או שימוש באלמנטים מוערמים ליצירת מראה מרובד.
- למרות שאלמנטים מרובעים וחד שפתיים חדים (המכונים מצגת מבוססת כרטיסים) פחות רצויים מאלמנטים רכים ומעוגלים.
חלק 2 מתוך 2: מיקסום ביצועי האתר
שלב 1. נצל את אפשרויות האופטימיזציה לרכב
דפדפנים ניידים גורמים לתנועה רבה יותר מדפדפנים שולחניים. המשמעות היא שתשומת הלב שאתה משלם לגרסת המובייל צריכה להיות זהה לפחות לפיתוח אתרי שולחן העבודה. רוב האתרים ליוצרים אוטומטיים כבר יצרו גרסת רכב, אך זכור את המידע הבא לאתרי מובייל:
- ודא שהלחצנים (למשל קישורי sitelink) גדולים וקלים להקשה.
- הימנע מתכונות שלא ניתן לראות במכשירים ניידים (למשל Flash, Java וכו ').
- שקול לבנות אפליקציית רכב לאתר שלך.
שלב 2. אל תכלול יותר מדי תמונות לדף
דפדפנים שולחניים וניידים מתקשים לפעמים לטעון דפים עם הרבה תמונות או סרטונים. למרות שהתמונות חשובות מאוד בעיצוב אתרים, כמויות מוגזמות של מדיה לדף יכולות להאריך את זמני הטעינה, וזה מונע ממשתמשים לבקר בדפים אלה.
באופן כללי, טעינת דף צריכה להימשך פחות מארבע שניות
שלב 3. הוסף דף "איש קשר"
אתה עשוי להבחין כי רוב האתרים מספקים דף "צור קשר" המכיל מידע ליצירת קשר (כגון מספר טלפון וכתובת דוא"ל). למעשה, חלק מהאתרים מספקים טופס בירור אוטומטי בדף זה. דף "איש הקשר" הוא קו תקשורת ישיר בין המבקרים באתר ובינכם, מה שאומר שהוא גם פתרון לשאלת המבקר או לתסכולו.
שלב 4. צור דף 404 מותאם אישית
כאשר מבקר מגיע לדף ספציפי שלא נוצר או שאינו קיים, יופיע דף "שגיאת 404". רוב הדפדפנים מספקים דף 404 מובנה, אך ניתן להתאים אישית את מראהו מהגדרות יוצר האתר. אם ברצונך ליצור דף 404 מותאם אישית, הזן את הפרטים הבאים:
- הודעות שגיאה מצחיקות ומהנות (למשל, "מזל טוב, נחתת על דף שגיאה!")
- קישור חזרה לדף הבית
- רשימת קישורים שמבקרים בדרך כלל רואים
- התמונה או הלוגו של האתר שלך
שלב 5. הזן את סרגל החיפוש במידת האפשר
אם שיטת יוצר האתרים שבה אתה משתמש תומכת בהוספת סרגל חיפוש, אנו ממליצים להוסיף אותו. זה מבטיח שמשתמשים יכולים למצוא את הדף או התוכן הספציפיים שהם מחפשים מבלי שהם צריכים ללחוץ על כל אפשרויות הניווט.
סרגל החיפוש שימושי מאוד גם כאשר מבקרים רוצים לחפש מונחים נפוצים מבלי להתעסק בדפים אקראיים
שלב 6. שימו לב יותר לדף הבית
כשמבקרים נכנסים לדף הבית, הם היו צריכים לקבל את עיקר הנושא של האתר שלך. בנוסף, כל האלמנטים של דף הבית צריכים להיטען במהירות, כולל אפשרויות ניווט ותמונות. דף הבית צריך גם לספק את ההיבטים הבאים:
- קריאה לפעולה (למשל, כפתור ללחיצה או טופס למילוי)
- סרגל כלים או תפריט ניווט
- גרפיקה מזמינה (כגון תמונה מוצקה, וידאו או מספר תמונות עם טקסט משלים)
- מילות מפתח הקשורות לשירות, הנושא או המיקוד של האתר שלך
שלב 7. בדוק את האתר שלך בדפדפנים ופלטפורמות שונות
זה חשוב מאוד מכיוון שהדפדפנים מעבדים היבטים של אתר אינטרנט בדרכים שונות. לפני קידום האתר שלך, נסה לפתוח ולהשתמש באתר שלך בדפדפנים הבאים בפלטפורמות Windows, Mac, iPhone ו- Android:
- גוגל כרום
- פיירפוקס
- ספארי (אייפון ומאק בלבד)
- Microsoft Edge ו- Internet Explorer (Windows בלבד)
- דפדפן ברירת המחדל של טלפונים מסוימים של Android (סמסונג גלקסי, גוגל נקסוס וכו ')
שלב 8. שמור על עדכון האתר
מגמות עיצוביות, קישורים, תמונות, מושגים ומילות מפתח משתנות תמיד. לכן, גם אתה חייב לבצע שינויים כדי להתעדכן בזמנים. עליך לבדוק את ביצועי האתר שלך ולהשוות אותו לאתרים דומים לפחות אחת לשלושה חודשים (רצוי בתדירות גבוהה יותר).
טיפים
- נגישות היא גם היבט חשוב לא פחות בפיתוח אתרים. הנגישות כוללת תיאורים של מבקרים לקויי שמיעה, תיאורי שמע למבקרים לקויי ראייה והתראות רגישות לאורכם אם האתר שלכם משתמש בהשפעות שעלולות לגרום להתקפים.
- רוב יוצרי האתרים מספקים תבניות בהן תוכל להשתמש כדי לקבוע את הפריסה והעיצוב לפני הוספת האלמנטים הרצויים.
אַזהָרָה
- רוב אתרי היוצרים הינם בחינם, אך אם ברצונך להשתמש בדומיין משלך (כגון "www.yourname.com" במקום "www.yourname.wordpress.com"), עליך לשלם תשלום חודשי או שנתי.
- הימנעו מגניבה ולמדו את כל חוקי זכויות היוצרים. אין לכלול תמונות אקראיות מהאינטרנט או מרכיבים מבניים ללא אישור.
