מדריך: איך בונים אתר אינטרנט איכותי?

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

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

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

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

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

מה עושה אתר אינטרנט לאיכותי ומוצלח יותר

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

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

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

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

? קוד סמנטי - הקוד צריך להיות מבוסס על תגיות סמנטיות כגון h1,h2,description,title וכו´. קוד סמנטי עוזר לנגישות טובה יותר לבעלי מוגבלויות (הוא מאפשר למשל לתוכנות ייעודיות להקריא את תוכן האתר עבור גולשים עיוורים), ובעיקר תורם לפיענוח האתר ע"י גוגל, ובכך מהווה נדבך ראשון באופטימיזציית קוד האתר עבור מנועי חיפוש.

? עיצוב האתר – בכתיבת הקוד יש להפריד בין קוד html לעיצוב, שייעשה בקובצי CSS חיצוניים. חשוב שלא להשתמש במאפייני style לאורך הקוד ושעיצוב האתר ייעשה באמצעות דיבים ולא בטבלה. כל אלו יבטיחו קוד קל משקל יותר שייסרק טוב יותר ע"י גוגל, יעלה מהר יותר בדפדפן, ושיהיה קל לשנות את עיצוב האתר בעתיד.

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

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

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

? התאמה למנועי חיפוש – בניית האתר צריכה לכלול אופטימיזציה למנועי חיפוש. הכוונה היא שהאתר יכיל את המרכיבים הבאים.

היררכיית אתר ברורה גם לגולשים וגם לגוגל.

כותרות – לכל עמוד כותרת ייחודית, המוגדרת בתוך הקוד.

תיאור עמוד description ומילות מפתח keywords – ייחודיים לכל עמוד ועמוד.

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

? ניהול תוכן – חברות בניית אתרים מקצועיות מספקות עם האתר מערכת ניהול תוכן איכותית, המאפשרת למנהל האתר, כלומר הלקוח, להוסיף עמודי תוכן, לערוך אותם, לנהל קטגוריות ועוד, ללא צורך לפנות בכל פעם לחברה שבנתה את האתר. מערכת ניהול תוכן טובה מאפשרת להכניס לאתר תכנים בצורה המותאמת למנועי חיפוש, עם אפשרות להגדיר לכל עמוד את הפרמטרים החשובים למנועי החיפוש: title, description, keywords, h1,h2, וכו´.

לסיכום

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

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