Paprasta duomenų lentelė su viena stulpelių antraščių eilute viršuje yra gana paprasta. Tikras skausmas prasideda nuo sudėtingų lentelių – su antraštėmis ir stulpeliuose, ir eilutėse, sujungtais langeliais arba suvestinės eilutėmis. Šiame straipsnyje paaiškinama, kaip pažymėti lentelės antraštes, kad ekrano skaitytuvas „suprastų“ kiekvienam langeliui, kurios antraštės jam taikomos, neprarandant konteksto.
Trumpai tariant – ką šis vadovas apima
Kodėl TH skiriasi nuo TD
HTML lentelėje arba pažymėtame PDF faile kiekvienas langelis turi vieną iš dviejų vaidmenų tipų: TH (lentelės antraštė) arba TD (lentelės duomenys – įprastas duomenų langelis). Skirtumas nebūtinai yra vizualus – antraštės langelis ir duomenų langelis gali atrodyti identiško stiliaus – jis yra semantinis: TH ekrano skaitytuvui nurodo „tai antraštė, paaiškinanti, ką reiškia žemiau arba šalia jo esantys duomenys“. Neturint tinkamo žymėjimo, ekrano skaitytuvas perkelia lentelę eilutėje po eilutės taip, lyg kiekvienas langelis būtų lygus, ir nesunku visiškai pamiršti, kurie duomenys kuriai kategorijai priklauso.
Kai apimties pakanka ir kai reikia daugiau
Daugeliui lentelių pridedate aapimtįatributas kiekvienam TH langeliui, kad nurodytų, ar tai stulpelio antraštė (scope="col") arba eilutės antraštė (scope="row"). Kai ekrano skaitytuvas pasiekia duomenų langelį, jis automatiškai praneša ir atitinkamą stulpelio antraštę, ir eilutės antraštę, kad vartotojas išgirstų, pavyzdžiui, „1 200 – Pardavimai, Q1“, o ne tik atskirtą „1 200“.
Ypač sudėtingoms lentelėms, kuriose yra daugiau nei dviejų lygių antraštės (pavyzdžiui, superantraštė, sugrupuojanti kelis postulpelius), vien apimties ne visada pakanka. Tokiais atvejais naudokite atributų id ir antraštes porą: kiekvienam antraštės langeliui suteikite unikalų ID, o kiekviename duomenų langelių sąraše, antraštės atribute, visus su juo susijusius antraštės ID. Šis metodas yra lankstesnis, bet taip pat sudėtingesnis ir linkęs į klaidas – naudokite jį atvejams, kuriems to tikrai reikia.
scope="col", o eilučių antraštės („Q1“, „Q2“, „Q3“) suscope="row"– taigi kiekviena duomenų ląstelė yra susieta su dviem jai svarbiomis antraštėmis.Suvestinės eilutės ir kelios antraštės
Suvestinės eilutė lentelės apačioje („Iš viso“, „Vidutinis“) pati savaime yra tam tikra antraštė – paprastai visą langelį tikslinga pažymėti kaip TH su „scope="row", todėl ekrano skaitytuvas atskiria ją nuo įprastos duomenų eilutės. Panašiai ir lentelėje su antrašte, kurioje sugrupuojami keli stulpeliai (pvz., „2026 m. pardavimai“, apimantys „Q1“, „Q2“), reikia tinkamai naudoticolspanatributas kartu su apimtimi, todėl hierarchinė grupuotė išsaugoma ir tada, kai ji skaitoma garsiai.
💡 Praktinis patarimas
Jei lentelė atrodo per sudėtinga, kad ją būtų galima teisingai pažymėti (daugiau nei du antraštių lygiai, keli sujungimai), kartais paprasčiausias ir prieinamiausias sprendimas yra suskaidyti ją į kelias paprastesnes lenteles arba šalia jos pridėti paprasto teksto santrauką.
Kaip tai atrodo praktiškai naudojant Word ir PDF
„Word“ naudojant standartinį įrankį „Įterpti ▸ lentelę“ ir pažymint „Antraštės eilutę“ lentelės projekte sukuriamas tinkamas pagrindas, kuris daugeliu atvejų automatiškai eksportuojamas į PDF kaip TH. Programoje Acrobat, eksportavus iš Word ir atlikus pritaikymo neįgaliesiems patikrą, verta atidaryti žymų medį ir patvirtinti, kad antraštės langeliai tikrai pažymėti kaip TH, o ne kaip įprastas TD – tai dažna eksportavimo klaida, kurią lengva nepastebėti.
Ar dokumentuose, kurie niekada nebuvo išbandyti, yra duomenų lentelės?
Mūsų įrankis identifikuoja lenteles su trūkstamomis arba neteisingomis antraštėmis kiekviename jūsų svetainės PDF faile.
Nuskaitykite savo svetainę nemokamai ←