Akadálymentesség és teljesítmény
Mit vár el a platform a saját témáitól (axe WCAG 2.1 AA, 390 és 1280 px, nincs vízszintes görgetés), mit ellenőriz a feltöltés és mit nem, és milyen futási korlátok vannak.
Frissítve: 2026. október 6.
A feltöltés a csomag szerkezetét és biztonságát ellenőrzi – azt nem, hogy a téma jól olvasható, billentyűzettel bejárható vagy telefonon használható. Ez a te felelősséged. Az alábbi szint az, amit a platform a saját témáinál a kiadás feltételeként tesztel; a saját témádnál ugyanezt javasoljuk.
Amit a platform a saját témáin tesztel
- axe hiba nélkül a WCAG 2A, 2AA, 2.1A és 2.1AA szabálykészlettel, a kezdőlapon, a termékoldalon, a keresésben és a kosárban.
- Két nézet: asztali (1280 px széles) és telefon (390×844, érintéssel).
- Nincs vízszintes görgetés: a dokumentum szélessége nem haladja meg az ablakét egyik nézetben sem.
- A főmenü elérhető (nav elem aria-label-lel), a vásárlás végigmegy a platform űrlapján.
A platform témakészítési irányelve ezeken felül 44 px-es érintési célterületet vár a gomboktól és linkektől telefonon – ezt automatikus teszt nem méri, kézzel ellenőrizd.
Amire a sablonban figyelj
| Mi | Hogyan |
|---|---|
| Címsor-hierarchia | Minden oldalon egy h1. A kezdőlapon a home.has_hero_heading mondja meg, ad-e a nyitókép h1-et; ha nem, az Üres alap rejtett h1-et tesz ki a bolt nevével. |
| Kártya címsorszintje | A snippets/card.liquid a level változót kapja (2 vagy 3): a szekció címe alatt h3, különben h2 – ne égesd be. |
| Képek alt szövege | A product_image és gallery hely maga adja; saját img elemnél te írod (a termék címe). |
| Feliratok | Minden felirat a szótárból (t szűrő), így a képernyőolvasó és a fordítás is azt kapja. |
| Fókusz, állapotok | A saját linkjeid és gombjaid fókusz-, hover- és letiltott állapotát a stíluslapodban te adod meg; az axe a hiányzó fókuszjelzést nem mindig jelzi, nézd meg billentyűzettel. |
| Kontraszt | A --shop-link változót a platform úgy adja, hogy a háttéren elérje a 4,5:1-et; a saját színpárjaidat te ellenőrzöd. A kereskedő arculat-beállításainál az admin kontraszt-figyelmeztetést ad. |
| Mobil menü | Használd a mobile_menu vagy drawer_menu platform-helyet a saját menü-megoldás helyett: a panelt a platform adja és tartja karban. |
Teljesítmény és futási korlátok
| Mi | Korlát / viselkedés |
|---|---|
| Egy sablon megjelenítése | legfeljebb 1 másodperc; a túllépő szekció kimarad, a hibát a bolt naplózza |
| Elemzési korlát | 1 000 000 token sablononként |
| Memória | 50 MB a megjelenítés alatt |
| JavaScript | nincs a témában; az interaktív részeket (menü, galéria, kosár) a platform komponensei adják |
| Stíluslap | inline kerül minden oldalra – tartsd kicsin; a kép- és betűfájlok külön, a médiatárból töltődnek |
| Termékképek | a product_image hely lusta betöltéssel; az első (fölső) képen használható a fetchpriority="high" attribútum |
| Betűk | csak saját kiszolgálású woff2; a böngésző csak a használt fájlokat tölti le |