כיצד ליצור אתר אינטרנט

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

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

01 מתוך 03

מה לכלול באתר אינטרנט Wireframe

דוגמה פשוטה של ​​wireframe.

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

02 מתוך 03

כיצד ליצור אתר אינטרנט

OmniGraffle מסך.

ישנן מגוון דרכים ליצור מסגרת אתר. הם כוללים:

ציור ידני על נייר

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

באמצעות Adobe Photoshop, Illustrator או תוכנה אחרת

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

שימוש בתוכנה שנוצרה עבור סוג זה של משימה

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

03 מתוך 03

היתרונות

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