ינואר 1998 - דצמבר 1998	ינואר 1999 - דצמבר 1999	ינואר 2000 - דצמבר 2000
אלכסנדריה	2000	2250	2978
פאלס צ'רצ'	1453	1599	1700

קוד ה- HTML עבור דוגמא 1 הוא:

<table border=1 summary="טבלה זו מסכמת את צריכת הסלק של תושבי אלכסנדריה ופאלס צ'רצ', בשנים 1998-2000, ומראה כי תושבי אלכסנדריה צורכים יותר סלק.">
<caption>צריכת הסלק בוירגי'ניה ביחידות של טון, 1998-2000</caption>
<tr><td></td>
<th abbr="1998">ינואר 1998 - דצמבר 1998</th>
<th abbr="1999">ינואר 1999 - דצמבר 1999</th>
<th abbr="2000">ינואר 2000- דצמבר 2000</th>
</tr>
<tr><th>אלכסנדריה</th>
<td>2000</td>
<td>2250</td>
<td>2978</td>
</tr>
<tr><th>פלס צ'רצ'</th>
<td>1453</td>
<td>1599</td>
<td>1700</td>
</tr>
</table>

שימו לב לתכונות ה- HTML הבאות:

תכונת ה- SUMERRY

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

תכונת ה- CAPTION

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

אלמנט TH

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

תכונת ABBR

השתמשו ב-ABBR כאשר ישנה כותרת ארוכה. למשתמש לקוי ראיה יהיה קל יותר לשמוע "1998",  "1999" וכו', מאשר כל פעם לשמוע "ינואר 1998 - דצמבר 1998" וכו'. אין צורך להשתמש בתכונה זו בכותרות קצרות או כותרות של מילה אחת.

דוגמא 2:

אוניברסיטה, ממוצע ציונים, והכנסה שנתית

שם	אוניברסיטה	תחום הלימודים	ממוצע ציונים	הכנסה שנתית
מרים	העברית	ספרות	90	42,000
יוסי	תל אביב	תקשורת	87	48,000

קורא מסך יקרא זאת כך:

שם: מרים, אוניברסיטה: העברית, תחום הלימודים: ספרות, ממוצע: 90, הכנסה: 42,000.

שם: יוסי, אוניברסיטה: תל אביב, תחום הלימודים: תקשורת, ממוצע: 87, הכנסה: 48,000.

הקוד של דוגמא 2:

<table border="1" summary="טבלה זו מציינת שם, אוניברסיטה, תחום הלימודים, ממוצע ציונים והכנסה שנתית.">
<caption>אוניברסיטה, ממוצע ציונים והכנסה שנתית</caption>
<thead>
<tr><th id="a1">שם</th>
<th id="a2">אוניברסיטה</th>
<th id="a3">תחום הלימודים</th>
<th id="a4" abbr="ממוצע">ממוצע ציונים</th>
<th id="a5" abbr="הכנסה">הכנסה שנתית</th></tr>
</thead><tbody>
<tr><td headers="a1">מרים</td>
<td headers="a2">העברית</td>
<td headers="a3">ספרות</td>
<td headers="a4">90</td>
<td headers="a5">42,000</td> </tr>
<tr><td headers="a1">יוסי</td>
<td headers="a2">תל אביב</td>
<td headers="a3">תקשורת</td>
<td headers="a4">87</td>
<td headers="a5">46,000</td></tr></tbody>
</table>

תכונות בדוגמא 2 שלא נדונו בדוגמא 1:

תכונת ה- HEADRS

תכונה זו מאפשרת לקוראי המסכים לחבר בין תאי הטבלה לבין הכותרות המתאימות להם. כפי שאתם רואים, בדוגמא שלעיל כל התאים שבטור של "שם" מסומנים ב- HEADERS="a1", התאים שמתחת לעמודת האוניברסיטה מסומנים ב- HEADERS="a2", וכו'.

תכונת ה- ID

בהקשר הנוכחי, תכונת ה- ID מופיעה בתוך תוית ה- TH ומאפשרת קישור בין תאי הטבלה לבין הכותרת. תכונת ה- ID בתוך תוית TH צריכה להתחיל באות, ואחריה מספר.