» נושאי לימוד
» נושאי לימוד
יום חמישי 25 באפריל 2024
6. קישורים
דף ראשי  טכניקות לכתיבת HTML נגיש  6. קישורים גרסה להדפסה

כלי עבודה טכניקה 6: קישורים

 

6.1 קישורי טקסט

  • 13.1 הגדירו בבירור מה היעד של כל קישור. [עדיפות 2]

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

 

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

 

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

 

אם יותר מקישור אחד מפנים ליעדים שונים אבל יש להם את אותו הטקסט (בקישור) , הבחן ביניהם ע"י הגדרת ערכים שונים לתכונה "title" לכל אלמנט.

 

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

 

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

 

<A href="my-doc.html">My document is available in HTML</A>,
  <A href="my-doc.pdf" title="My document in PDF">PDF</A>,
  <A href="my-doc.txt" title="My document in text">plain text</A>

 

 

6.1.1 טקסט לתמונות המשמשות כקישורים

  • 1.1 לספק מקבילת טקסט לכל אלמנט שאינו טקסט (כלומר ע"י "alt" או "longdesc" או בתוכן האלמנט). האלמנטים כוללים: תמונות, הצגות גרפיות של טקסט (כולל סמלים), מפות-תמונות, אנימציה (כלומר קבצי GIF מונפשים) יישומונים ואלמנטים תכנותיים, אומנות ascii, מסגרות, סקריפטים, תמונות המשמשות כסימון לרשימה (תבליטים), אלמנטים להפרדה (כגון קוים מפרידים), כפתורים גרפיים, צלילים (כאלה שהמשתמש יוצר וגם כאלה שאינם דורשים אינטראקציה), קבצי אודיו, פסי קול של סרטי וידאו, ווידאו. [עדיפות 1].

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

 

דוגמא:

  <A href="routes.html">
     <IMG src="topo.html"
          alt="Current routes at Boulders Climbing Gym">
  </A>
 

 

או, אם אתה מספק טקסט קישור, השתמש בתו הרווח כערך התכונה "alt" של האלמנט IMG. יש לציין שהטקסט יופיע על הדף לצד התמונה.

 

דוגמא:

 <A href="routes.html">
     <IMG src="topo.html" alt=" ">
        Current routes at Boulders Climbing Gym
  </A>
 

 

 

6.2 סידור בקבוצה ועקיפת קישורים

  • 13.6 קבצו יחד קישורים הקשורים זה לזה, תנו שם לקבוצה (עבור סוכני המשתמש) וספקו דרך לעקוף את כל הקבוצה, כל עוד סוכני המשתמש אינם מאפשרים זאת בעצמם.
  • 10.5 כל עוד סוכני המשתמש (כולל טכנולוגיות מסייעות) אינם יודעים לפענח כראוי קישורים סמוכים, עליכם לכלול כמה תוים (שניתן להדפיס) שאינם קישורים, ושמוקפים ברווחים, בין קישורים סמוכים.

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

  • הוסף קישור המאפשר לדלג על הקבוצה של קישורי הניווט.
  • ספק גליון סגנון המאפשר למשתמש להחביא את הקבוצה של קישורי הניווט.
  • השתמש באלמנט של HTML 4.01 MAP לקבץ קישורים, ואח"כ הגדר את הקבוצה עם התכונה "title".

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

 

דוגמא:

בדוגמה הזו האלמנט MAP מקבץ סדרה של קישורים, התכונה "title" מגדירה זאת כסרגל ניווט, וקישור בתחילת הקבוצה מקשר למקום הנמצא אחרי הקבוצה. יש לציין שהקישורים מופרשים ע"י  "לא קישורים", ותוים הניתנים להדפסה (מוקפים ברווחים).

 

 <BODY>    
     <MAP title="Navigation Bar">   
       <P>
       [<A href="#how">Bypass navigation bar</A>]
       [<A href="home.html">Home</A>]
       [<A href="search.html">Search</A>]
       [<A href="new.html">New and highlighted</A>]
       [<A href="sitemap.html">Site map</A>]
       </P>
     </MAP>    
     <H1><A name="how">How to use our site</A></H1>
   <!-- content of page -->    
   </BODY>
    

 

 

6.3 גישה במקלדת

  • 9.4 קבעו סדר טאבים הגיוני של קישורים, טפסים ואובייקטים. [עדיפות 3]
  • 9.5 קבעו קיצורי מקלדת לקישורים חשובים (כולל קישורים במפות-תמונת בצד הלקוח) ולשליטה בטפסים. [עדיפות 3]

גישה במקלדת לאלמנטים פעילים של הדף חשובה למשתמשים רבים שאינם יכולים להשתמש בהתקני הצבעה (כמו עכבר). סוכני משתמש צריכים לכלול מאפיינים המאפשרים למשתמשים לקשור פעולות מקלדת לפעולות מסוימות. HTML 4.01 מאפשר למפתחי תוכן להגדיר קיצורי מקלדת במסמך דרך התכונה "accesskey".

בדוגמה הבאה, אם משתמש לוחץ על המקש "C", הקישור יופיע.

 

<A accesskey="C" href="doc.html" hreflang="en"
      title="XYZ company home page">
         XYZ company home page</A>

 

הערה: כל עוד סוכני משתמש אינם מאפשרים לדעת מיהם מקשי הגישה הזמינים, ספק מידע על מקשי הגישה.

 

 

6.4 עוגן ומטרות

  • 10.1 כל עוד סוכני המשתמש אינם מאפשרים למשתמשים לכבות חלונות ש"נולדים" מתוך חלונות קיימים, אין לגרום להופעתו של חלון pop-up או כל חלון אחר, ואין לשנות את החלון הנוכחי מבלי להודיע למשתמש. [עדיפות 2]

 

ספרים מקורות

טכניקה 6: קישורים, טכניקות HTML, הנחיות W3C

 17-12-03 / 18:33  עודכן ,  13-10-03 / 18:02  נוצר ע"י דפנה תדמור  בתאריך 
 5. טבלאות - הקודםהבא - 7. תמונות ומפות תמונות 
תגובות הקוראים    תגובות  -  0
דרכונט
מהי מערכת הדרכונט?
אינך מחובר, להתחברות:
דוא"ל
ססמא
נושאי לימוד
חיפוש  |  לא פועל
משלנו  |  לא פועל
גולשים מקוונים: 1