תן המבנה הסמנטי עבור דפי אינטרנט
  |  |
להדפיס  |
לשלוח  |
חלק         |
אזהרה: הגירסה המקורית של מסמך זה היא יצירת מבנה סמנטי . תרגום זה נעשה על ידי צרפתי Ideose במסגרת הסכם בין WebAIM ו Ideose .
הערה: ראה עמוד מסמכים על נגישות באינטרנט כדי לקבל רשימה של כל המסמכים מתורגמים. משאבים נוספים על נגישות האינטרנט מוצגים גם הדיגיטלי נגיש הפורטל .
טבעו של HTML
מחברי ה-HTML היו מדענים שחיפשו דרך לשתף מסמכים על פיסיקת החלקיקים.
הם לבשו עניין בצורה ויזואלית של המסמך המדויק מוצג על מסך המחשב.
למעשה, HTML תוכנן במקור כדי לענות על הפרדה בין מבנה התוכן והפריסה גרפי.
הכוונה היתה ליצור עולם רחב כמה דפי אינטרנט שאפשר להציג כל מערכת הדפדפן הקיימים - כולל דפדפנים כי "קוראים" אינטרנט דפי טקסט למשתמשים עם ליקויי ראייה - וזה יכול להתפרש על ידי מנועי חיפוש וניתוח.
ממציאי האינטרנט לא לממש את הפוטנציאל שלה עבור תצוגה גרפית. לכן, HTML לא תוכנן עם שיקולים כאלה. הם היו להוטים כל כך לעשות את המסמכים ששימשו את מכונות הם הציגו מסמכים מכונות בלבד (או פיזיקאי החלקיקים) רוצה לקרוא. על ידי התמקדות אך ורק על ההיגיון המבני של המסמכים, הם התעלמו את הצורך ההיגיון החזותי של עיצוב גרפי וטיפוגרפיה. חוסר הראשונית של האינטרנט שיקול ויזואלי גורם הלחץ עבור מעצבי אינטרנט כאשר הם רוצים לקבל פריסה גרפית ספציפית לדפי האינטרנט שלהם. זה הצורך עיצוב הסיבה מדוע חברות תוכנה החלו ניווט להתעלם בסטנדרטים של HTML ו מורשה פונקציונליות נוספת בדפדפנים שלהם.
לדוגמה, רוב מעצבי להימנע משימוש תגי HTML סטנדרטיים עבור כותרות בפסקה ( <h1> , <h2> , וכו '.) משום שאין להם עידון ויזואלי: ברוב דפדפני האינטרנט, תגיות אלה מראים בהחלט גדול מדי (כותרות <h1> , <h2> ) או קטן עד כדי גיחוך ( <h4> , <h5> , <h6> ).
אבל אלה תגי HTML לא נוצרו בדאגה של עיבוד הראייה שלהם.
המטרה היחידה שלהם היא לייעד héarchique ברמת הכותרת, כך הקוראים האדם מנועי החיפוש יכולים בקלות לקרוא את המסמך ולקבוע מידע המבנה שלה.
רק שלא בכוונה, כי מפתחי הדפדפן נתנו בגדלים שונים וברמות השומן כל תג הכותרת פסקה, גם אם במידות אלה נוטים להיות מוגבל ב-HTML.
השתמש בכותרות פיסקה לבנות תוכן
למרות האופי של האינטרנט ואת השינויים העצומים של השימוש (דרך לבנות מסמך במדיום ויזואלי), חשוב כי תוכן אינטרנט נועד עם מבנה טוב. אינטגרציה טובה יותר עם גיליונות סגנון (CSS) בגירסאות האחרונות של דפדפני האינטרנט, מפתחים יכולים לשנות את המראה של אלמנטים מבניים לפגוש אפשרויות העיצוב שלהם לתצוגה.
דוגמה
תסתכל על מבנה התוכן של אחד של דפי האינטרנט שלך באמצעות validator W3C .
. הזן את כתובת האתר של דף האינטרנט בתיבת הטקסט, בדוק ולאחר מכן לחץ על
לעת עתה, להתעלם מהשגיאות של HTML המוצגים ואת לגלול למטה את הדף כדי לראות את המפה המוצגת בדף האינטרנט.
תראה סקירה קצרה של מבנה התוכן של דף האינטרנט שלך, כפי שהוגדר על ידי התגים ( <h1> - <h6> ).
אם התוצאה לא נראה כמו תוכנית של ממש, סביר להניח כי את התגיות אינם משתמשים בו כראוי (או אין מגדלור של ראשי פרקים).
משתמשי קוראי מסך וטכנולוגיות מסייעות אחרות יכולים לגלוש בדפי אינטרנט באמצעות המבנה שלהם.
משמעות הדבר היא כי המשתמש יכול לקרוא או לכוון גישה ברמה גבוהה אלמנטים ( <h1> ) ושל ברמה 2 ( <h2> ), ואז לאלה של רמה 3 ( <h3> ) וכן הלאה.
צפייה או האזנה תוכנית זו מקנה להם רעיון טוב של התוכן והמבנה של הדף.
הדפים צריכה להיות בנויה באופן היררכי, הרמה הראשונה של אבטחה ( <h1> ) שהוא הגדול ביותר (בדרך כלל בעמוד השער או מסמך), ולאחר מכן את רמת האבטחה של 2 ( <h2> כותרות, חיים בדרך כלל פרקים), ואז את רמת כותרים שלישי ( <h3> , סעיפים קטנים של פרקים) וכן הלאה.
מבחינה טכנית, כאשר רמה נמוכה חייב לעקוב אחר רמת אבטחה גבוהה יותר.
התרשים הבא מציג את המבנה של ניירות ערך ניירות ערך צריכה לכלול דף אינטרנט.
למעשה, הוא מייצג את ההיררכיה של התוכן העיקרי של דף זה עם רמות שונות של כותרות פיסקה מהגבוה ביותר לנמוך ביותר.
אתה יכול ללחוץ על כל כותרת כדי לקבל גישה בסעיף המתאים בדף זה.
נכון להשתמש כותרות פיסקה
אין להשתמש בעיצוב טקסט כגון גודל הגופן או בולדינג לתת המראה החזותי כדי ראשי פרקים - להשתמש טיטרציה תגיות סטנדרטי ( <h1> - <h6> ) כל התוכן.
טכנולוגיות מסייעות ודפדפנים אחרים מבוססים, פשוטו כמשמעו, על קוד מקור על מנת לקבוע את המבנה שלה.
פריטים מודגש או להציג בגופן גדול יותר לא מפורשים אלמנטים מבניים.
כמו כן, לא להשתמש בתגיות עבור טיטרציה רק ליצור אפקטים חזותיים. לדוגמה, אם אתה רוצה לסמן או להדגיש מרכיב אחד של תוכן שאינו כותרת (כפי שנעשה עם המשפט הקודם), לא להשתמש בתגיות לעשות טיטרציה.
במקום זאת, השתמש את התגים של גופן הדגשה סגנון, גודל או נטוי.
אם אתה רוצה להדגיש משהו, עליך להשתמש בתג strong (דגש) במקום b ו תג em (נטוי) במקום i .
תגיות b ו i לסחוב את כל המידע החזותי 2 בלבד, בעוד strong ואת em לתת מידע סמנטי.
מבחינה ויזואלית, התוצאה היא זהה, אך המפתחים צריכים להשתמש רכיבי HTML המתאימים.
et sélectionnez l'option . ב Dreamweaver, תוכל לבחור ובחר
שצריך להשתמש ברשימות
רשימות HTML - ul , ol ו dl - גם לשמש להעברת המבנה ההיררכי של התוכן.
כל הרשימות האלה יש גם חוקים לגבי השימוש בהם.
תבליטים (רשימה לא מסודרת) יש להשתמש כאשר אין רצף או סדר החשיבות בין האלמנטים של הרשימה.
רשימה ממוספרת מצביע על התקדמות או רצף האלמנטים ברשימה.
רשימה של הגדרה יש להשתמש באופן מפורש להצגת מספר הגדרות מבנה.
כמו טיטרציה עם תגיות, רשימות של תגי יש להשתמש בהן כהלכה על פי אופיים.
הורה לא מסודרת רשימות תמיד צריך לכלול את פריטי הרשימה.
רשימות של הגדרות תמיד צריך להיות תיאורים של הגדרות.
רשימות ריקים אינם חוקיים ב-HTML.
הרשימות אין להשתמש מסיבות אחרות או על הפריסה.
רשימות מקוננות חייב להיות מקודד בצורה נכונה.
קישורים מסחריים
WebAIM הינה יוזמה של:
כל הזכויות שמורות 1999-2009 WebAIM
