איך HTML5 ישפיע על קידום אתרים באינטרנט ? – חלק א

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

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

אין ספק ששדרוג גירסת ה – HTML ישפיע בצורה ישירה על מאמצי הקידום של כולנו מבחינת אלמנטים הקשורים לקידום אתרים On-Page ואלמנטים הקשורים לקידום אתרים Off-Page , השאלה היא כיצד בדיוק ? –  במאמר זה אני אנסה לענות על השאלה.

הערה חשובה : במידה ואין לך ידע מספק ב – HTML המאמר הזה יתן לך ידע כללי בלבד. במידה ואתה מעוניין לשפשף את יכולות ה – HTML שלך, אני ממליץ לעבור ל – HTMLGuide, מדריך HTML מקיף שיוכל לעזור לך בנושא.

מתן משמעות סמנטית לחלקי עמוד HTML

אחד השינויים המהותיים שנעשו ב – HTML גרסה 5 הוא במתן משמעות סמנטית לחלקי העמוד על ידי חלוקת העמוד למקטעים שונים.

למשל, העמוד שבו אתה נמצא כרגע, מורכב מחלקים שונים כמו חלק עליון (Header), חלק תחתון (Footer), חלק צדדי (SideBar), חלק מרכזי (Main Content), חלקים שחוזרים על עצמם כמו תגובות אחרונות או רישום ל – RSS (Sections), תפריט ניווט קבוע (Nav) ואלמנטים אחרים.

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

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

עמוד HTML5 תקני, אמור להראות בצורה הבאה :

האלמנטים החדשים שהתווספו לשפת HTML5 הם :

• <header> –  תגית אשר מציינת את החלק העליון של העמוד. תגית זו מאפשרת למנועי החיפוש לשלוף את שם האתר, הלוגו ופרטים מזהים אחרים.
• <nav> – תגית אשר מציינת את תפריט הניווט של האתר. תגית זו יכולה לתת למנועי החיפוש מידע לגבי המבנה ההיררכי של האתר.
• <aside> – תגית אשר מציינת את תפריט הניווט הצדדי של האתר (במידה ויש כזה תפריט בכלל).
• <section> – תגית אשר מציינת איזור מסויים בעמוד. לפי דעתי, ניתן להשתמש בתגית לציון איזורים שחוזרים על עצמם ומכילים תוכן משוכפל (מבחינת גוגל) כמו תגובות אחרונות, חדשות אחרונות וכדומה.
• <article> – תגית אשר מציינת את התוכן המרכזי בעמוד. ללא ספק, תגית זו היא החשובה ביותר בשפת HTML5 וזאת מכיוון שהיא מאפשרת לנו להצביע על התוכן המשמעותי בעמוד בתקווה שמנועי החיפוש יתנו לו עדיפות בתוצאות החיפוש.
• <footer> – תגית אשר מציינת את החלק התחתון של העמוד.

בנוסף לתגיות הנ"ל, ישנן מספר תגיות נוספות אשר מקנות משמעות נוספת לתוכן שמשולב בתוכן, בין התגיות המרכזיות ניתן למצוא את <time>, <details>, <mark>, <meter>, <output>, <progress>, <dialog>, <video> ו – <audio>.

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

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

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

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