SourceХуудсууд
Олон хуудсан дээр хэд хэдэн холбогдох контент байгааг харуулахын тулд хуудасны тэмдэглэгээг харуулах баримт бичиг, жишээнүүд.
Бид хуудас бичихдээ холбосон холбоосуудын том хэсгийг ашигладаг бөгөөд холбоосыг алдахад хэцүү, хялбархан өргөтгөх боломжтой болгодог бөгөөд энэ нь их хэмжээний хит хэсгүүдийг өгдөг. Хуудсууд нь жагсаалтын HTML элементүүдээр бүтээгдсэн тул дэлгэц уншигчид боломжтой холбоосуудын тоог зарлах боломжтой. <nav>
Уншигч болон бусад туслах технологиудыг дэлгэцийн навигацийн хэсэг болгон тодорхойлохын тулд боох элементийг ашиглана уу.
Нэмж дурдахад, хуудсууд нь нэгээс олон навигацийн хэсэгтэй байх магадлалтай тул зорилгоо тусгах үүднээс тайлбар aria-label
өгөхийг зөвлөж байна. <nav>
Жишээлбэл, хайлтын илэрцүүдийн хооронд шилжихэд хуудасны бүрэлдэхүүн хэсгийг ашигладаг бол тохирох шошго байж болно aria-label="Search results pages"
.
Зарим хуудасны холбоосын текстийн оронд дүрс эсвэл тэмдэг ашиглахыг хүсч байна уу? aria
Дэлгэц уншигчийн зохих дэмжлэгийг шинж чанарууд болон .sr-only
хэрэглүүрээр хангахаа мартуузай .
Тахир дутуу болон идэвхтэй төлөвүүд
Хуудасны холбоосыг өөр өөр нөхцөл байдалд тохируулж болно. .disabled
Товших боломжгүй холбоосууд болон .active
одоогийн хуудсыг зааж өгөхөд ашиглана уу .
.disabled
Анги нь s- ийн холбоосын функцийг идэвхгүй болгохыг pointer-events: none
оролддог боловч CSS <a>
шинж чанар нь хараахан стандартчилагдаагүй байгаа бөгөөд гарын навигацыг тооцдоггүй. Иймд та үргэлж tabindex="-1"
идэвхгүй холбоосууд дээр нэмж, тэдгээрийн функцийг бүрэн идэвхгүй болгохын тулд тусгай JavaScript ашиглах хэрэгтэй.
<span>
Та сонгосон хэв маягийг хадгалахын зэрэгцээ товшилтын функцийг устгаж, гарны фокусаас сэргийлэхийн тулд идэвхтэй эсвэл идэвхгүй зангууг -аар сольж эсвэл өмнөх/дараагийн сумтай бол зангууг орхиж болно.
Илүү том эсвэл жижиг хуудас бичихийг хүсч байна уу? Нэмэх .pagination-lg
эсвэл .pagination-sm
нэмэлт хэмжээ авах боломжтой.
Flexbox хэрэгслүүдийн тусламжтайгаар хуудасны бүрэлдэхүүн хэсгүүдийн зэрэгцүүлэлтийг өөрчил .