Jenga ufunikaji unaozingatia kazi za mteja
Orodhesha njia na matokeo yanayotoa thamani: kupata huduma, kutafuta, kuongeza bidhaa, kukodi, kujisajili, kuomba msaada, au kulipa. Kwa kila moja, itaje vipengele vinavyoweza kubadilika au kushindwa: urambazaji, vichujio, kadi, meza, picha, matangazo, fomu, vitambaa (drawers), na widget zinazochanganywa. Jaribu upana ambapo yaliyomo yako yanapokuwa na vizuizi, si orodha ya mifano ya simu za sasa. Jaribu papo hapo chini, kwa, na papo juu ya kila breakpoint (mipaka).
Jumuisha simu za upana mwembamba na za upana wa kati, upana unaofanana na kompyuta kibao, kompyuta kibao ndogo (laptop), desktop mpana, na mandhari ya landscape pale inapoathiri kazi.
Tumia vichwa vya habari virefu, matokeo ya bila kitu, makosa ya uthibitisho, beji za bei, anwani kamili, na lebo ndefu pale hali hizo zinapotokea.
Thibitisha urejea wa muundo, usomaji, na zoom
Thibitisha ukurasa una mipangilio sahihi ya viewport (dirisha la mtazamo), kisha angalia kuvinjari kwa usawa kwenye ngazi ya ukurasa. Picha zisimamayo, sehemu za kuingiza pana, margin hasi, paneli za nje ya skrini (off-canvas), na matangazo ni vyanzo vya kawaida. Kigezo cha WCAG 2.1 Reflow kinaelezea yaliyomo yanayoinuka kwa msururu (vertical-scrolling) kwa upana sawa na piksela 320 za CSS, ikijumuisha viewport ya piksela 1280 kwa 400% zoom. Ikiwa kigezo hicho kiko ndani ya wigo wako, jaribu hali halisi ya zoom. Ramani, video, au jedwali la data linaweza kuhitaji mpangilio wa pande mbili (two-dimensional layout), lakini rudisha kuchanja ndani ya kipengele na ruhusu ukurasa unaozunguka kuendelea kurejea.
Kagua vichwa, yaliyomo kuu, viambatisho vya futi (footers), baa zilizo na msimamo wa kubaki (sticky bars), dialogi, na muhtasari wa makosa kwa kila mpaka uliyojaribu.
Panga upya taarifa kwa skrini nyembamba; usifute kwa kimya kinachohitajika, maelezo ya bei, au njia ya msaada.
Lazimisha yaliyomo na fomu
Operesheni za yaliyomo zinaweza kusababisha kushindwa kwa muundo bila uhifadhi wa CSS. Jaribu kichwa kirefu kilichoidhinishwa, beji kadhaa, picha iliyokosekana, kichujio kilichoangaziwa, tangazo kubwa la kisheria, na eneo lililotimia na kivinjari. Wakati safu zinavyojikunja, thibitisha kuwa mfululizo wa kusoma na sheria za kibodi bado zinaeleweka. Maliza fomu halisi kwenye kifaa kidogo: fungua udhibiti, rekebisha kosa, na tuma. Jaribu vidonge vya wahusika wengine kwenye ukurasa unaofanana na uzalishaji kwa sababu kontena zao, hali ya ridhaa, fonti, na mitindo vinaweza kubadilisha matokeo.
Onyesha urefu wa juu unaowezekana na mchanganyiko, lakini usijumuishe data za mteja au malipo kama ushahidi wa QA.
Fungua taarifa, chat, matangazo, na ujumbe wa uthibitisho pamoja; hakuna kinachopaswa kufunika kitendo kuu au shamba lenye umakini.
Fanya njia zote za kuingiza kazi
Skrini kubwa haimaanishi pointer ya mbeu ya panya, na skrini ndogo haimaanishi kugusa pekee. Kipengele cha hover media kinaangalia kama kuingiza kuu kinaweza kufanya hover kwa urahisi, hivyo hover inapaswa kuboresha badala ya kuwa njia pekee ya kuchukua hatua au maelezo. Jaribu matumizi ya kibodi na pointer kwenye desktop, kugusa na kusogeza kwenye kifaa kinagusa, na vifaa vyenye mchanganyiko wa kuingiza pale inafaa. Angalia vitufe vya kufunga vyenye ukubwa mdogo, steppers, chips, kalenda, na vitendo vya alama. WCAG 2.2 Target Size (Minimum) inabainisha lengo la ukubwa wa piksela 24 kwa 24 za CSS kwa kutaja isipisho, pamoja na nafasi na viungo vya ndani. Ni kigezo chenye wigo na isipisho, si ahadi kwamba kila udhibiti wa piksela 24 ni rahisi kwa kila mtu.
Piga tab kupitia ukurasa. Umakini unapaswa kubaki wazi, kufuata mpangilio unaofaa, na kuingia na kutoka kwenye menyu na dialogi kwa utabiri.
Fanya kitendo muhimu kinachofichuliwa kwa hover kupatikana pia kwa umakini, kugusa, au udhibiti unaoonekana, na zuia tabia ya kugusa ya mara ya kwanza isiyofaa.
Thibitisha mali na utendaji chini ya vikwazo
Picha inaweza kuendana na kontena yake na bado kuwa faili isiyofaa kwa kifaa. Angalia kwamba media inabaki ndani, inaweka nafasi ya muundo inapofaa, inahifadhi kukatwa muhimu, na inaomba wagombea faida (suitable candidates). Srcset na sizes huwapa vivinjari taarifa ya kuchagua kati ya vyanzo vya picha zilizotolewa; havatahi hakikishi ombi fulani. Tumia throttling ya DevTools kugundua matatizo mapema, lakini udhibiti wake wa CPU na mtandao unaiga kondisi kulinganishwa na kompyuta ya maendeleo. Reka muundo muhimu kwenye kifaa halisi na muunganisho halisi. Chunguza fonti, media za hero, carousels, kazi upande wa mteja, na scripts za wahusika wengine kwa ucheleweshaji, mabadiliko ya mpangilio, au kuguswa kunakozuiliwa.
Chukua ruta, viewport, muunganisho wa kweli au uliokisiwa, na kilichokuwa polepole au kisicho imara; linganisha kwa hali sawa.
Pale palipo salama, chelewesha embeds zisizo za lazima kwenye utekelezaji wa jaribio ili kugundua kama kazi kuu inaendelea kutumia.
Rekebisha kama kazi hai ya kuimarisha upatikanaji (uptime)
Kwa Status Is UP, utayari wa muundo unaojibu ni uboreshaji wa uptme wa kuzuia: tambua njia ya kifaa inayowazuia watumiaji, rekebisha chanzo chake, thibitisha ukarabati, na zuia kurudiwa. Si dai kwamba tahadhari ya ufuatiliaji inaweza kutathmini kila hitilafu ya muundo au mwingiliano. Prioritiza kwa athari ya kazi na upenyo wa watumiaji. Kabla ya utoaji, jaribu upana unaoambatana na safari iliyobadilishwa kwenye vifaa halisi. Panga urudisho wa mabadiliko kwa mabadiliko ya urambazaji ulioshirikiwa, mitindo, script, malipo, au ujumuishaji. Baada ya utoaji, rudia hatua za uthibitisho na ambatisha ushahidi kwenye rekodi ya mabadiliko.
Taja ruta, kifaa au viewport, mwelekeo, kuingiza, hali, matokeo yaliyotarajiwa, matokeo halisi, na picha iliyokatwa (redacted capture).
Tayari suluhisho kwa sehemu, kanuni ya muundo, token, au utoaji wa picha kuliko kuziba kwa njia moja tu; toa mmiliki na mpango wa kuondoa isipisho.
