» נושאי לימוד
» נושאי לימוד
יום שני 2 בדצמבר 2024
טבלאות: טכניקות
דף ראשי  כיצד לעמוד בתקני הנגישות  מדריך לתקן 508  מדריך 508: טבלאות  טבלאות: טכניקות גרסה להדפסה

 טכניקות

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

 

דוגמא 1:

 

צריכת הסלק בוירג'יניה ביחידות של טון, 1998-2000

 

ינואר 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 צריכה להתחיל באות, ואחריה מספר.

 

אלמנטים THEAD ו- TBODY

חלוקה זו מאפשרת תמיכה בדפדוף לאורך הטבלאות. כאשר הטבלאות נמשכות לאורך כמה דפים, הכותרות והערות מתחת לטבלה יופיעו שוב ושוב. תוית ה- THEAD צריכה להופיע לפני פירוט השורות (TR), והיא כוללת בתוכה את כל תאי הכותרות (TH). תוית ה- TBODY צריכה להופיע בסוף פירוט הכותרות, לפני פירוט השורות (TR) של התאים עצמם של הטבלה.

 

טבלאות מורכבות

להלן אלמנטים של HTML 4.0 שיאפשרו לכם להנגיש אפילו טבלאות מורכבות ומקוננות.

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

 12-01-04 / 20:29  נוצר ע"י דפנה תדמור  בתאריך 
 טבלאות: מי מושפע? - הקודםהבא - טבלאות: בדיקה 
תגובות הקוראים    תגובות  -  0
דרכונט
מהי מערכת הדרכונט?
אינך מחובר, להתחברות:
דוא"ל
ססמא
נושאי לימוד
חיפוש  |  לא פועל
משלנו  |  לא פועל
גולשים מקוונים: 4