כיצד לעצב אתר אינטרנט

01 מתוך 10

מחקר

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

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

הכל מתחיל עם מחקר

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

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

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

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

02 מתוך 10

סיעור מוחות

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

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

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

03 מתוך 10

להחליט על דרישות טכניות

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

אחת ההחלטות העיקריות היא מה המבנה הבסיסי של האתר צריך להיות, אשר יקבע מה התוכנה להשתמש ומה המערכת עושה את האתר "עבודה".

האפשרויות כוללות:

04 מתוך 10

כתוב מתאר

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

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

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

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

05 מתוך 10

צור Wireframes

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

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

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

חשוב לך לשמור על מראה אחיד לאורך כל האתר כפי שאתה המעבר מ wireframe אחד למשנהו.

06 מתוך 10

לעצב את האתר

ברגע שאתה והלקוח שלך שמחים עם wireframes, הגיע הזמן להתחיל בעיצוב האתר.

Adobe Photoshop הוא הכלי הנפוץ ביותר ליצירת העיצובים הראשוניים. המוקד של עיצוב האתר צריך להיות להציג את התוכן והוא ישמש ליצירת דפי אינטרנט בפועל.

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

07 מתוך 10

בניית דפי אינטרנט

כאשר העיצוב שלך אושר, הדפים צריכים להיות מופנים מ mockups לתוך דפי אינטרנט בפועל שנכתבו ב- HTML ו- CSS.

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

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

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

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

08 מתוך 10

לפתח את האתר

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

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

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

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

09 מתוך 10

לקדם את האתר

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

הגברת התנועה לאתר יכולה לכלול:

10 מתוך 10

שמור את זה טרי

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

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

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