מה ההבדל בין בניית אתרים לבין עיצוב אתרים?

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

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

מהו ההבדל המהותי בין בניית אתרים לבין עיצוב אתרים?

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

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

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

למה בימינו העיצוב לוקח את מרבית הזמן בבניית אתרי תדמית?

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

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

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

דפדפני האינטרנט המובילים כיום, מימין לשמאל: כרום, ספארי, אקספלורר, פיירפוקס, אופרה

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

כיצד כדאי לאפיין את עיצוב ובניית האתר שלך?

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

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

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

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

אתר אינטרנט ככלי

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

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

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