נאוה פורומיסט על
הצטרף / הצטרפה: 06 August 2006 מדינה: Israel
משתמש: מנותק/ת הודעות: 1209
|
נשלח בתאריך: 01 February 2007 בשעה 18:41 | | IP רשוּם
|
|
|
|
http://www.isoc.org.il/w3c-wai/webAccessibilityEbook.pdf
אני מדביקה פה לטובת כולם סיכום מהיר של הספר: נגישות באינטרנט- בניית אתרים נגישים מאת Joe Clark שנמצא פה בקישור למעלה, ניתן לרכוש את הספר בהוצאת הוד עמי. ציינתי נקודות חשובות להנגשת האתר, לא סיכמתי את כל הספר אלא מה שהיה רלוונטי לאתר הפשוט שלי. אני
ממליצה לכולם לקרא את הספר ולהעזר בסיכום שלי לקבלת סקירה כללית על הספר.
עדיף להעתיק את הקודים מהאתר. עשיתי הגהה אחת לסיכום מומלץ לבדוק את הקודים במקור, בספר.
סיכום הספר: נגישות באינטרנט- מאת Joe Clark
קוראי מסך מופעלים על ידי מקלדת, כל מה שעובד עם עכבר צריך לעבוד גם עם מקלדת. חרש עיוור- משתמש בצג ברייל. עבור ליקויי למידה- השתמש בשפה ברורה.
הצהרה לדפדפן על סוג המסמך- DOCTYPE בלעדיו העמוד לא יקבל תוקף של הבודק. validator.w3.org
אחד מנותני תוקף לא רשמיים: HTMLHelp.com/tools/validator/
כדי לציין שינוי שפה צריך קודם כל לציין את השפה המקורית:
קוד:
<html lang="he" xmlns="http://www.w3.org/1999/xhtml">
|
|
|
המומלצת:
קוד:
<html lang="he" xml:lang="he" xmlns="http://www.w3.org/1999/xhtml">
|
|
|
כדאי להשתמש בשתי האפשרויות. עמוד 44
קבע תבניות עבור כל המסמכים העתידיים שיכללו DOCTYPE ומאפיין שפה בתוך האלמנט <html></html>
עמוד 50 סמן ציטוטים
שים לב שהמסמך נקרא היטב לפי הסדר הנכון גם ללא גליונות סגנון.
הקפד לשים טקסט הסבר לתמונות ב alt
אל תיצור עמודים שמתרעננים באופן אוטומאטי ומחזורי. עד שסוכני המשתמש יאפשרו לשלוט בהבהובים.
דף 2 שלי לא לשנות חלון נוכחי מבלי להודיע למשתמש.
עמוד 51 ציין את הגירסה המורחבת של כל קיצור או ראשי-תיבות בפעם הראשונה שהם מופיעים בדף.
מקש tab סרגל ניווט
מידע חשוב צריך לשים בהתחלה של הדף.
צריך לספק מידע על אוספי מסמכים.
עמוד 55 קוד שפה בכל תגית html
alt טקסט אלט מסכם את התמונה בכמה מלים. מומלץ להקפיד שטקסט אלט יהיה קצר. מומלץ להגביל את אורך הטקסט אלט עד 1024 תווים שזה 1k
title אפשר להוסיף כמעט לכל דבר. שקיעה בים... לחץ לתמונה המוגדלת... אפשר להשתולל קצת בכתיבה.
alt נותן מידע מינימלי וחיוני. title מוסיף מידע שימושי ויכול להוסיף קצת פלפל.
אפשר לבטל את הצגתו של המאפיין title בדפדפנים חזותיים באמצעות הקוד
חשוב לשמור על עקביות בעמוד אחד.
עמוד 64 קישור חוזר לעמוד המקורי מהתמונה.
אין צורך לתאר תאור גרפי של העמוד.
לתאור חצים אפשר להשתמש <><- ->
דף 3 שלי
עמוד 81 נגישות למונה כניסות
טקסט אלט ארוך עד 1024 תווים 1k צריך להקפיד שהוא יתאים לגודל הגרפיקה שהוא נמצא בתוכה.
אתר מרובה שפות חובה לתרגם טקסט חלופי.
קו הפרדה hr לסדר css עמוד 97
עמוד 100 טקסט וקישורים.
עבור אתרים בעברית יש לכתוב:
קוד:
<meata http-equiv="Content-Type" content="text/html; charset=windows-1255" />
|
|
|
או
יוניקוד
אל תגדיר את כיוון הכתיבה ברמת התגית body
קוד:
<meta http-equiv="Content-Language" content="he" />
|
|
|
בעמוד 104 הסבר מפורט על הבעיה של דו כיווניות של סימן שאלה, מקף, סימן קריאה וכדומה.
פריט באינטרנט: כותרות, רשימות לא ממוספרות, תמונות, טבלאות, מסגרות, פסקאות, קישורים.
ניקוד עזר חלקי- צריך לפי הספר הזה. צריך לבדוק את הנושא.
תחילת דף 4 ציטוטים <cite> </cite> כותרות שמות של ספרים, סרטים, מחזות, תוכניות טלוויזיה, פסקי דין ואפילו שמות של ספינות.
לנגישות עבור קיצור <abbr> </abbr>
לנגישות עבור ראשי תיבות <acronym> </acronym>
עמוד 111
קוד:
<abbr title="continued">cont'd</abbr> <acronym title="not in my backyard">NIMBY</acronym>
|
|
|
שפה זרה:
קוד:
<abbr lang="de" xml:lang="de" title="hautbahnhof">Hbf</abbr> <acronym title="societate per aziony" lang="it" xml:lang="it">SpA</acronym>
|
|
|
לסמן רק בפעם הראשונה שהקיצור מופיע בדף. ראה הערה בספר. עמוד 113 הוסף את הקוד הבא לגליון הסגנון:
קוד:
abbr, acronym{text-decoration:underline; border-bottom:1px dotted gray;}
|
|
|
עמוד 116 ציטוט בלוקים של טקסט מדליק.
תחילת דף 5 שלי
עמוד 122 ניווט הפיכת התמונות לנגישות מהווה חצי מהעבודה, הטיפול בניווט מהווה את החצי השני. ריבוי של תפריטים מקשה על הנגישות, אתר שקשה להשתמש בו הוא אתר לא נגיש. יש אפשרות לאפשר דילוג על הניווט... ראה הסבר בספר.
עמוד 171 גופן וצבע אדום וירוק- לא כחול- כן. אדום וירוק נראים לעיוור צבעים כמו אפור צהוב או בז'. אדום ושחור עלולים להראות זהים אם האדום מספיק עמום. יש המתבלבלים בין גוונים כחולים וירוקים אדום וירוק נראים לעיוור צבעים בז' צהוב וכתום. עיוור צבעים עלול להתבלבל בין בז' כתום וצהוב אמיתיים "למזויפים". לכן טווח הצבעים שצריך להדאיג אותנו הוא רחב למדי: אדום, כתום, צהוב, בז' וירוק. עיוורון צבעים כרוך בהבחנה בין צבעים (אדום וירוק רמזור)
רק אובייקטים בעלי משמעות חייבים להיות חד משמעיים, עיוורי צבעים לא יכולים לסבול מצב שהם לא יכולים להשתמש באתר.
צבעים בטוחים- מק פי סי הצבעים אינם עקביים אפילו במסך אחד.
תחילת דף 6 שלי
קרבה וחפיפה לא למקם אדום על שחור או שחור על אדום. לא לשלב בין אדום לשחור או בין אדום לירוק. ולא לשלב אותם עם בז' צהוב וכתום במרחק נגיעה. לא למקם אדום וירוק זה ליד זה במרחק נגיעה. אפשר להשתמש כשהפריטים רחוקים זה מזה וכשיש ניגודיות חזקה בין הצבעים. יש הבדלי בהירות.
שילובי צבעים: צמדי צבעים בטוחים: אדום -כחול כתום - כחול כתום - סגול צהוב - סגול בדרגות בהירות וכהות שונים.
רשימה משנית: חום - כחול צהוב - כחול יש 6 צמדי צבעים ושלושים ושתיים דרגות של צבעים
עמוד 182
תחילת דף 7 שלי בחירת צבע קריא עבור הטקסט. הוספת קונטורים, גבולות הפרדה. metadata
לבן, שחור ואפור נתפסים ככאלה על ידי כולם, ניתן לשלב אותם עם 216 הצבעים הבטוחים לשימוש באינטרנט.
אפור הופך לצבע מבלבל כאשר משלבים אותו בשילובים מוזרים כגון: ארגמן אפור וכחול ירקרק. הוא אינו הופך לצבע מבלבל לעתים קרובות.
עמוד 186 קישורים וטקסט יש לקבוע לפחות חמישה צבעים בו זמנית טקסט רגיל, רקע. קישור רגיל, קישור פעיל וקישור שכבר ביקרו בו.
צריך לאפשר למשתמש להחליף צבע לטקסט.
אפשר להוסיף עוד שני צבעים: צבע שהקישור מקבל כאשר הוא נבחר, או צבע שמופיע כאשר העכבר זז מעל הקישור.
קוד:
<body bgcolor="white" text="black" vlink="purple" alink="blue" link="990000"> יש לציין את ההגדרות גם בגליון הסגנון body{color:black; background-color:white} a link{color:#990000;background-color:8888
|
|
|
עמוד 186 לבדוק שינוי גודל הטקסט על ידי המשתמש באופרה.
תחילת דף שלי מספר 8
עמוד 188 focus
קוד:
A:focus{color:#990000; background-color:white; border:solid 1px gray;}
|
|
|
צריך לשמור על שוני בין Hover ל-Focus
הסדר המומלץ: a: link a: visited a: focus a: hover a: active
גליון סגנון חזק יותר כנגד העדפות המשתמש בעיקר בזכות המאפיין important ידו של המבקר על העליונה בכל מקרה.
עמוד 190 צבעי מערכת גליונות סגנון מרמה 2 ומעלה מציעים מגוון של מילות מפתח חדשות הקשורות לצבע ובעלות ערך תיאורטי עבור עיצוב נגיש. הבוררים מתיחסים לצבעי מערכת, יהיו מה שיהיו, והם מתאימים יותר לנגישות. הדפדפנים אינם תומכים כהלכה בבוררי css2 כל העניין די לא מומלץ ובעייתי.
אפשרות אסטתית לקישור - קו תחתון מנוקד
קוד:
a{border-bottom:1px dotted gray}
|
|
|
כל גופן שגובהו קטן מתשעה פיקסלים הוא בלתי קריא.
תחילת דף 9 שלי לתמונה של טקסט יש יתרון בכך שעבור מגדילי המסך יש לה גיבוי של alt או title. מה שאין לשאר הטקסט שלפעמים מתעוות בהגדלה.
עמוד 193 הילה טקסט בהיר על רקע כהה נראה גדול יותר מהאפשרות המנוגדת. כאשר הגופן קטן לא מרגישים בהבדל. אבל כאשר הוא לא קטן צריך שיהיה הבדל בין הגופן הרגיל להפוך בגודל של פיקסל אחד.
עמוד 195 גופן כאשר בוחרים גופן באמצעות גליונות סגנון כדי לציין בכל מקרה את המשפחה הגנרית של הגופן. (בדרך כלל, בסוף הרשימה, מכיוון שכך היא תהיה המוצא האחרון).
המשפחות הגנריות של גופנים בגליונות סגנון גולשים רמה 2 הן: serif sans-serif שים לב למקף כתב יד cursive fantasy משמשים לקישוט אך הם עדיין אותיות monospace
__________________ ספרי חידות
חידות הגיון
חידות
|