מיקרוסופט
שחררה לאחרונה את גרסת הבטא הראשונה שלה לאינטרנט אקספלורר 9. הגרסה נראית מצוין
אבל לא בזה אעסוק כאן אלא באחת התכונות החדשות בגרסה זו והיא התמיכה ב - HTML
5. דפדפנים אחרים ככרום ופיירפוקס כבר תומכים בצורה חלקית בגרסת HTML 5 אולם מרגע
שמיקרוסופט (שכרגיל מאחרת לעשות זאת) עושה זאת אזי ברור לכל ש - HTML 5 תהפוך להיות
הסטנדרט באינטרנט.
גרסה 5 של שפת HTML מכילה שינויים רבים מאוד יחסית
לקודמותיה, תגים רבים בוטלו מהשפה, רבים אחרים נוספו לשפה וכן חלו שינויים בהרבה ממאפייני (attributes)
התגים הוותיקים.
במאמר זה אסקור רק חלק קטן מן התגים החדשים,
את אותו חלק המשנה לחלוטין את מבנה מסמך ה - HTML ואשר לו תהיה לדעתי ההשפעה הגדולה
ביותר על SEO. מדריך מקיף הבוחן את כל השינויים בשפה ואת ההבדלים בינה
לבין גרסתה הקודמת תוכלו למצוא
כאן.
"גרסת HTM 5 מבשרת על שינוי במבנה דפי האינטרנט. האם אתם מוכנים לקבל את פני
גרסת ה - HTML החדשה שהיא לא פחות ממהפכה בתחום ה - SEO?"
חלוקה פונקציונאלית של מסמך ה - HTML
מאז ומתמיד היה ברור שמנועי החיפוש מבצעים סיגמנטציה של דפי ה - HTML ומעניקים משקל
שונה לכל חלק מחלקי הדף. למרות שגוגל למשל מעולם לא הודתה בזאת ניסויים רבים שנעשו
הצביעו על כך שהמשקל שגוגל נותנת ללינק הנמצא בתחתית המסמך ב - footer - הוא נמוך
יותר מאשר לינק הנמצא באזורים אחרים, מרכזיים יותר.
אולם, בעוד שבעבר מנועי החיפוש היו צריכים לנסות ולהבין לבד מהם מרכיבי המסמך
מבחינה פונקציונאלית שכן, המסמך נבנה בעיקר באמצעות תגי <div> וטבלאות באה גרסת
HTML 5 והופכת את הסיגמנטציה לקלה מאוד עבור מנועי החיפוש. 6 תגים מבניים
חדשים עושים את כל ההבדל. על פי HTML 5 יתחלק כל מסמך הבנוי נכון פחות או יותר כך:
התג <header>
התג <header> הוא ברכה למקצועני SEO שכן הוא מעין תג h1 משוכלל וגמיש שיכול
להכיל בתוכו תצורות מורכבות יחסית של טקסט כגון פסקאות וכן לינקים, התייחסות
לזכויות יוצרים ובנוסף לכך הוא יכול להכיל בתוכו את התגים h1 - h6. בניגוד לתג <h1>
בתג <header> אפשר להשתמש יותר מאשר פעם אחת בדף. כבר התייחסתי בפסקה זו ללינקים אבל אחזור על כך שנית: ניתן לשבץ בתוך ה - <header> לינקים קשיחים
וזוהי בשורה גדולה לאנשי ה - SEO.
התג <section>
בעזרת התג <section> נוכל להגדיר חלקים שונים בדף ה - HTML. אם תחשבו
על הדף כולו כעל ספריה אזי התג <section> יהיה שקול לספר אחד מתוך הספריה
כולה. כל דף HTML יוכל להכיל מספר בלתי מוגבל של sections כאלה. כל section
יכול להכיל headings משלו אשר יוכלו ללמד את מנוע החיפוש באיזה נושא עוסק אותו
section ומהם מילות המפתח המייחדות אותו. לי אישית אין ספק כי מנועי החיפוש יעשו
שימוש רב במידע שיכתב ב - heading של תג זה ומכאן חשיבותו רבה מבחינת SEO.
סביר להניח גם שמילת מפתח כלשהי שתופיע בצפיפות רבה ב - section מסוים תקבל משקל
גדול יותר מאשר אם תהיה מפוזרת באותה כמות אבל לאורך כל הדף.
התג <article>
התג <article> הוא ללא ספק התוספת המבורכת ביותר מבחינת SEO. הוא מאפשר להפריד
בצורה ברורה בין נושאים שונים באותו דף. במיוחד הוא עשוי להביא תועלת באתרים כגון
בלוגים, אתרי חדשות ואתרים המפרסמים מאמרים שונים באותו נושא או בנושאים שונים. התג
<article> יכוון את מנועי החיפוש לתת חשיבות גדולה יותר לטקסט שנמצא בתוך תג זה,
המאייר בצורה ברורה היכן נמצא התוכן העיקרי של הדף. התג <article> מאפשר להימנע
מריבוי בתגי <div> ומאפשר למנועי החיפוש "להבין" טוב יותר היכן נמצאים החלקים
החשובים בדף, אלה שיש לתת להם משקל רב יותר.
התג <nav>
לינקים לניווט באתר היו תמיד סיפור שהתלבטו בו בחוגי מקצועני ה - SEO.
מאמרים ומדריכים רבים נכתבו על הדרך הנכונה לכתוב אזור חיוני זה בדף / אתר. התג
<nav> פותר נושא זה לפחות מבחינת הדרך הברורה ל"הסביר" למנועי החיפוש איזה
לינקים הם חלק ממערכת הניווט הפנימית של האתר ואיזה לינקים אינם כאלה. סביר להניח
שמנועי החיפוש ישתמשו בקישורים שנמצאים בתוך תגי ה - <nav> כפי שהיום הם
משתמשים במפות אתר. לדעתי, קישורים הנמצאים מחוץ לתג <nav>, במיוחד כאלה
המצביעים אל מחוץ לאתר, יקבלו משקל גדול יותר בכל הנוגע ל - page ranks מאשר
קישורים דומים בתוך תג זה, אך אין לדעת.
התג <aside>
התג <aside> ישמש אותנו כדי להגדיר תוכן שהוא צדדי יחסית לתוכן המרכזי של
הדף או המאמר שלנו. נשתמש בו כאשר נרצה להגדיר הערת שוליים, או כותרות צדדיות
במאמר.מרבית אנשי ה - SEO לא מייחסים חשיבות מיוחדת לתג זה, אולם אני סבור
שהוא מאוד חשוב למבנה הכללי של דף בגלל מה שהוא בעצם מייצג. התכנים שבתוכו מייצגים
בעצם את החלק השולי יחסית של הדף. כאשר נמקם בתוכו תכנים, נעזור למנועי החיפוש
להתמקד בעיקר ולייחס פחות חשיבות לדברים השוליים יותר בדף. כלומר, חשיבותו של התג
<aside> היא בכך שהוא מאפשר להפריד בין העיקר לטפל ובכך מאפשר למנוע החיפוש
להתמקד במה שכותב הדף חושב שהוא הנושא האמיתי שלו.
התג <footer>
בדומה לתג <header> גם התג <footer> גמיש מאוד. ניתן להשתמש בו יותר מאשר פעם אחת
בדף ולמעשה מומלץ להשתמש בו בסיומו של כל <section>. כמו התג <header> ניתן לשבץ בו
קישורים קשיחים והוא מסייע מאוד להבנת מבנה הדף ומקיל על מנוע החיפוש לבצע
סיגמנטציה שלו.
סיכום
השינויים בגרסת HTML 5 מאפשרים למנהלי אתרים ואנשי SEO לבצע סיגמנטציה ברורה יותר
של דף האינטרנט שלהם ו"להדריך" את מנועי החיפוש כיצד בנוי הדף, היכן להתמקד כדי
"להבין" מהו נושא הדף ומהם החלקים החשובים יותר בו והיכן החלקים החשובים פחות. מבחינה זו
HTML 5 היא בשורה גדולה למנהלי האתרים וליועצי ה - SEO.
אם מצאתם מאמר זה מועיל בוודאי תמצאו עניין גם במאמרים הבאים:
המדריך השלם ל - HTML 5
SEO ו - HTML
5 טיפים לכתיבת URLs נכונים
תגובות הקוראים
אירית
יוסי כל הכבוד על המאמר במושקע. כשזה מגיע לקוד אתה מספר 1. המשך בעבודה הטובה.
|
יוסי סיגורה
אירית תודה על המחמאות. אם את מוצאת את המאמר מעניין בוודאי תתענייני לדעת שאני כותב גם באתר Devschool.co.il ושם כל המאמרים והמדריכים שלי עוסקים אך ורק בפיתוח לאינטרנט ובקוד. בין היתר תוכלי למצוא שם מדריך מורחב ומפורט בנושא HTML 5. כדי להגיע לאתר את יכולה ללחוץ על שמי בראש תגובה זו.
|
אורי זילברשטיין
תמיד כאשר מגיעה טכנולוגיה חדשה ישנו פחד תמידי שכל חוקי המשחק ישתנו וקידום אתרים יהיה משהו אחר לחלוטין, וכתוצאה מכך אתרים קיימים יפגעו או ידרשו שינויים ופיתוחים שיכולים לעלות כסף, אך אנו יכולים לראות שמבחינת גוגל מערכת התוכן והקוד הוא שקוף.
אתר וואלה מתוכנת בשפה משלו! שפה שיש רק לאתר וואלה, קוד ששייך אך ורק לוואלה, ועם זאת גוגל סורק את הכול ושקוף לו הכול. אני רוצה לקחת הזדמנות זו באמת להוסיף לאירית שכתבה, שזה מגיע לקוד.. זה באמת הבלוג הכי מושקע שראיתי, המשך כך!
|
אופיר
אחלה מאמר, סחתיין על ההבנה לעומק, אבל בכל זאת, אני ממש לא חושב שחוקי המשחק הולכים להשתנות...ממש לא.
המשך כך אחי!
|
ניקוי שטיחים
יש דרך ל"הכריח" את הדפדפן לקבל HTML5 , ז"א גם בדפדפנים ישנים כמו IE7 ,
עושים זאת בעזרת הוספת JQUERY, ההסבר המלא:
http://www.potent.org.il/a/hookah/yxae
|
הגיבו למאמר
