PROFILPELAJAR.COM

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

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

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

עם הגידול במספר אנשי המקצוע בתחומי עיצוב תקשורת חזותית (Communication Design) וטכנולוגיית המידע (Information technology), נהוג להבדיל בין מקצוע עיצוב אתרי אינטרנט (Web design) לבין פיתוח רשתות (Web Development) - עבודה שמתמקדת בתחזוקה הכוללת של כל השירותים מבוססי הרשת.

היסטוריה

טים ברנרס-לי, ממציא ה-World Wide Web, פרסם אתר אינטרנט לראשונה באוגוסט 1991. דפי אינטרנט נכתבים בשפת תגיות הנקראת HTML.

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

עיצוב אתר אינטרנט

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

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

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

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

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

דפי אינטרנט מסווגים כדפים סטטיים או דינמיים:

עמודים סטטיים הם למעשה קבצים שמאוכסנים בשרת, ונשלחים אל הגולשים כמו שהם.
עמודים דינמיים מיוצרים על ידי השרת, בדרך כלל לפי מידע משתנה שמאוחסן בבסיס נתונים, קבצים שאינם בצורת דפי HTML בעצמם, או מידע שהשרת מושך משרתים אחרים ברשת בעת טעינת הדף. התכנה שמייצרת את הדפים מכונה "תוכנת צד שרת", ויכולה להיות כתובה בשפת תכנות כלשהי. יש מספר שפות תכנות שייעודן העיקרי הוא כשפה לתוכנת צד שרת באינטרנט, למשל ASP,‏ JSP, ו-PHP. שפות תכנות נוספות הנפוצות במימוש תוכנת צד שרת הן Java, ‏, Perl, ופייתון). בשרתי האינטרנט המוקדמים, תמיכה בתוכנת צד שרת מומשה בדרך כלל בעזרת מנגנון שנקרא Common Gateway Interface, או בקיצור CGI, ולעיתים משתמשים בקיצור CGI או CGI-bin כדי לציין תוכנת צד שרת, אם כי שימוש זה מקובל פחות ופחות.

דרישות רב תחומיות

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

מעצב אתרים ואפליקציות

מעצב אתרים ואפליקציות (נקרא גם מעצב Web) הוא אדם העוסק בעיצוב גרפי וטיפוגרפיה של אתרים ואפליקציות אינטרנט ("עיצוב אתרים"). הידע הנדרש כדי לעסוק בתחום זה כולל ידע ב-HTML, ב־CSS (כולל CSS Preprocessors דוגמת SASS), וכן ידע ב־Javascript ובספריות שלה (כגון Jquery). מעבר לכך נדרש גם ידע בתוכנות עיצוב גרפי, כגון תוכנה לבניית תמונות וקטור (כגון Illustrator) ותוכנות ליצירה ועיבוד תמונה (כגון Photoshop).

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

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