17-05-2016, 11:16
|
|
|
|
חבר מתאריך: 12.04.06
הודעות: 2,021
|
|
ציטוט:
וזה תחליף די טוב, אני חושב שזה סוג של סטנדרט כבר, ובינינו - אם ידעת שהלייבל בתוך השדה כשאין מידע ושכחת מה מטרת השדה (וגם אם לא) -
בכול מקרה תמחק הכול, לא יודע איך זה אצל אחרים אבל לי כמשתמש זה אחד הדברים שאני מנסה כדי לנחש מה מטרת שדה הטקסט
|
סורי, אבל זה לא "סטנדרט" לפי התקן.
placeholder
קוד:
The placeholder attribute represents a short hint (a word or short phrase) intended to aid the user with data entry.
A hint could be a sample value or a brief description of the expected format.
The placeholder attribute should not be used as an alternative to a label.
לעומת זאת, label
קוד:
The label element represents a caption for a form control.
אם נקח את הדוגמא של שדה החיפוש בשאלה של Nati323 -
אפשרות 1, התמונה היא נפרדת משדה החיפוש, אז במכשירים המתאימים אפשר פשוט להחליף את התמונה בטקסט.
משהו כזה למשל,
קוד:
<label>
<div class="search_icon" aria-hidden="true">
<!-- add icon with img or background-image or icons-font -->
</div>
<span class="sr-only">חיפוש</span>
<input type="text" placeholder="מה לחפש?" />
</label>
** sr-only זה מאפיין של bootstrap. כתבתי את זה רק בשביל הנוחות, להציג את המטרה.
אפשרות 2, התמונה היא כרקע בשדה חיפוש, אז כמו שכתבתי לפני כמה הודעות, אפשר פשוט להשתמש במאפיין aria-label, אם אין מקום אחר שאפשר להשתמש ב label.
קוד:
<input type="text" aria-label="חיפוש" placeholder="מה לחפש?" />
** בכל מצב, יש איזשהו סימן זיהוי מה משמעות השדה.
לא רואה סיבה לשים שדה טקסט שבשלב מסויים צריך לנחש את המשמעות שלו או להתאמץ כדי לגלות אותה.
_____________________________________
נערך לאחרונה ע"י MatiM בתאריך 17-05-2016 בשעה 11:20.
|