Editoria11y pre Drupal

Základné funkcie

Modul pre Drupal prepojuje knižnicu nástroja na kontrolu s redakčným backendom a pridáva mnohé serverové nástroje na reportovanie, správu a konfiguráciu

Drupal editor s inline tipmi
Problémy sú detegované počas načítania na frontende aj pri písaní v editoroch CKEditor a Gutenberg.
Tip upozorňujúci, že odkaz je pomenovaný len „kliknite tu".
Tooltipy získajú tlačidlá na skok do editora, ignorovanie upozornenia (pre aktívneho používateľa) alebo označenie ako OK (pre všetkých používateľov). Opakujúce sa upozornenia ponúkajú akcie na úrovni stránky alebo celého webu.
Rozhranie nástroja na tvorbu vlastných testov zobrazujúce polia pre názov a obsah tipu, ako aj selektory a výnimky prvkov.

Submodul CSA pridáva:

  • Nástroj na tvorbu vlastných testov
  • 40+ vývojárskych testov
  • Kontrola kontrastu
  • Prehľadávače webu
  • Analýza čitateľnosti
  • Rozdelená konfigurácia pre vývojárov/editorov
Reportovací dashboard zobrazujúci nedávne problémy a stránky s najviac problémami.
Celositeový dashboard poskytuje filtrovateľné a exportovateľné správy o upozorneniach a odmietnutiach.

Inštalácia a kľúčové kroky nastavenia

Balený inštalátor na Drupal.org obsahuje niekoľko modulov:

  • Editoria11y: základný nástroj na kontrolu obsahu a dashboard.
  • Editoria11y CSA: vývojárske testy a nástroje na údržbu dashboardu.
  • Editoria11y Export: nástroje na CSV reportovanie.

Nainštalujte ako akýkoľvek iný modul a potom vykonajte tieto kľúčové kroky:

  1. Skontrolujte oprávnenia. Dôveryhodní autori by mali mať oprávnenia „Označiť ako OK", „Označiť ako ignorované" a „Zobraziť dashboard".
  2. Skontrolujte kľúčové stránky na repetitívne alebo nepomocné upozornenia. Buď ich označte ako OK v tooltipe, alebo upravte konfiguráciu na ignorovanie prvkov podľa selektora.
  3. Hľadajte tipy, ktoré je ťažké vidieť — mimo obrazovky, orezané, skryté za inými prvkami alebo na skrytých prvkoch. Na ich opravu použite tipy v sekcii „Oprava umiestnenia tipov" nižšie.
  4. Ak web už obsahuje obsah a máte predplatné CSA, navštívte záložku „recheck" na dashboarde a prehľadajte web na predbežné načítanie správ webu. Toto je voliteľné, ale staršie stránky sa nebudú zobrazovať v správach, kým ich neprehľadáte alebo nenavštívi prihlásený používateľ.

Pozrite si video predstavenie konfiguračných možností (v2.4).

Skryť nepomocné upozornenia

Dobrá konfigurácia potláča nepomocné upozornenia, aby sa autori obsahu mohli sústrediť na problémy, ktoré by mali opraviť.

Aj keď môžete testy úplne vypnúť, zvyčajne je lepšie skryť upozornenia na konkrétnych prvkoch alebo stránkach.


Počas každého testovacieho behu Editoria11y zhromaždí jednu sadu prvkov z nastavenia „Kontrolovať obsah v týchto kontajneroch" a potom ju niekoľkokrát filtruje. Takto vyzerá testovací beh:

  1. Zrušiť kontrolu, ak konfigurácia zabraňuje kontrole na tejto stránke alebo pre tohto používateľa.
  2. Zhromaždiť prvky v určených oblastiach stránky, napr.:
    body > *:not('.ed11y-element')
    Pre používateľov Editoria11y CSA sú to oblasti na záložke Vývojárske testy.
  3. Odstrániť prvky zodpovedajúce selektorom ignorovania, napr.:
    .widgets, .utility-menu
    Pre používateľov Editoria11y CSA sú to selektory na záložke Vývojárske testy.
  4. Spustiť testy a synchronizovať výsledky s dashboardom.
  5. Ak je aktívna rozdelená konfigurácia a používateľ je editor obsahu, filtrovať výsledky pre vývojárov:
    • Odstrániť výsledky z testov nastavených na „Len pre vývojárov".
    • Odstrániť výsledky prvkov mimo určených obsahových oblastí, napr.:
      main, footer
    • Odstrániť výsledky prvkov zodpovedajúcich selektorom ignorovania obsahu.
    Note that there is not a second "gather" phase. The developer page regions must include the content regions.
  6. Otvoriť panel a zobraziť upozornenia, ak konfigurácia zodpovedá nastaveniu automatického otvorenia.

Odmietnutie upozornení

Testy možno konfigurovať v knižnici ako chyby alebo varovania („manuálne kontroly"). Varovania možno odmietnuť. Z päty každého tooltipu sú k dispozícii dva typy odmietnutí:

  • „Ignorovať" je uložené ako predvoľba používateľa: upozornenie je teraz skryté pre aktuálneho používateľa, ale len pre neho.
  • „Označiť ako OK" skryje upozornenie pre všetkých používateľov.

To, či môže používateľ odmietnuť upozornenie, je kontrolované na úrovni roly v oprávneniach Drupalu. Väčšina autorov by mala mať povolené odmietať upozornenia. Nemá zmysel priradiť niekomu manuálnu kontrolu, ak nemôže označiť položku ako skontrolovanú.

Ignorovanie prvkov

Tieto dve konfiguračné nastavenia sú najdôležitejšie!

Nastavte prvé tak, aby zahŕňalo všetky časti obsahu stránky, ktoré môžu autori upravovať. Napr. ak môžu upravovať oblasť obsahu main, .sidebar a .footer-column-two, nastavte tieto selektory ako oblasť kontroly obsahu.

Druhé použite na „vyradenie" podsekcií. Napr. ak main obsahuje rôzne widgety a vložený obsah, ktoré môžu upravovať iba vývojári, uveďte tieto: .widget-1, .social-embed;

Ak používate rozdelenú konfiguráciu, uvidíte podobný pár nastavení na záložke Vývojárske testy:

Developer check area

Kľúčová vec, ktorú treba vedieť o oblastiach kontroly pre vývojárov, je, že nie sú nezávislé od oblastí kontroly obsahu. V rozdelené konfigurácii sú kontrolované oblasti pre vývojárov a potom sú tieto výsledky filtrované podľa oblastí obsahu. Akékoľvek oblasti vylúčené pre vývojárov budú vylúčené aj pre editorov obsahu. Nevylučujte editovateľné oblasti obsahu!

Niektoré testy umožňujú presnejšiu konfiguráciu na skrytie len určitých upozornení na postihnutých prvkoch. Hľadajte ich pod:

  • Obsahové testy: Odkazy na kontrolu
  • Obsahové testy: Vložený obsah na kontrolu
  • Obsahové testy: Detekcia dynamického a shadow obsahu
  • Vývojárske testy: Kontrast

Skryť pre konkrétne stránky alebo používateľov

Najjednoduchší spôsob je odovzdanie CSS tried alebo ID do týchto možností:

Prvá zabráni spusteniu kontrol a panel sa nezobrazí.

Druhá spustí kontrolu minimalizovanú a automaticky označí (pre aktuálneho používateľa) všetky problémy ako „Ignorované", aj keď sú to chyby. To umožňuje beh testov a aktualizáciu dashboardu bez obťažovania používateľa.

Ak chcete tieto nastavenia použiť na kontrolu, ktorí používatelia vidia kontrolu, možno budete musieť upraviť tému na výstup triedy, napr. .user-247

Správa celositových výsledkov

Prehľadávanie a aktualizácia výsledkov

Editoria11y je nástroj na monitorovanie v reálnom čase, nie prehľadávač. Jeho celositové správy sa aktualizujú, keď autori zobrazujú stránky, takže pravidelné prehľadávanie zvyčajne nie je potrebné. Modul CSA obsahuje prehľadávač, ale mal by byť potrebný len v týchto troch situáciách:

  1. Pri prvej inštalácii Editoria11y na existujúci web s mnohými stránkami. Stránky musia byť navštívené, aby sa zobrazili na dashboarde, takže rýchle úvodné prehľadanie šetrí čas.
  2. Väčšie aktualizácie tém alebo modulov môžu opraviť (alebo spôsobiť) problémy na mnohých stránkach, ktoré sa nezobrazí, kým nie sú navštívené alebo prehľadané.
  3. Hromadné akcie v administrátorskom rozhraní ako mazanie stránok alebo presmerovaní zvyknú zanechávať výsledky zo stránok, ktoré už neexistujú alebo sa presunuli. V takýchto prípadoch pomáha použiť akcie údržby na záložke „Obnoviť" na aktualizáciu URL adries stránok a detekciu a odstránenie vymazaných stránok.

Počas prehľadávania neopustia vaše dáta váš web. Prehľadávač CSA nie je cloudový nástroj; na načítanie a kontrolu stránok vášho webu používa váš prehliadač. Nevýhodou tohto prístupu je, že prehliadače pozastavujú karty na pozadí. Počas prehľadávania budete musieť mať počítač zapnutý a aktívny. Plánujte otvoriť nové okno pre prehľadávač a nechajte ho ako aktívnu kartu v tomto okne počas práce. Môžete pokračovať v práci v inom okne. Prehľadávač aktualizuje svoj odhad po každej dávke stránok.

Zobrazenie správ

  • Nedávne umožňuje prehľadávanie podľa jednotlivých upozornení. Umožňuje veci ako filtrovanie na nájdenie všetkých výskytov rovnakého typu upozornenia, alebo sledovanie, ktoré upozornenia sa často objavujú v nedávnom obsahu, alebo ktorí autori stále robia rovnaké chyby.
  • Stránky zobrazuje počty upozornení na stránku, zoskupené podľa stránky. Umožňuje nájsť stránky s najviac problémami a filtrovať podľa atribútov stránky, ako sú typ obsahu a stav publikovania.
  • Upozornenia zobrazuje problémy podľa typu.
  • Odmietnutia umožňuje monitorovanie, či autori odmietajú správne, a obsahuje tlačidlá „obnoviť" na obnovenie odmietnutých upozornení.
  • Export obsahuje verzie správ o stránkach, upozorneniach a odmietnutiach, ktoré možno filtrovať na prípravu CSV stiahnutí. Poskytuje submodul CSV Export
  • Obnoviť obsahuje nástroje na údržbu dashboardu na odstránenie upozornení z vymazaných stránok, odstránenie upozornení z parametrizovaných pseudo-stránok ako /search?query=example, aktualizáciu uložených názvov a URL adries stránok a spustenie manuálneho prehľadávania. Poskytuje submodul CSA

Oprava skrytých alebo mimo-obrazovkových tipov

Modul poskytuje polia pre dve konfiguračné možnosti knižnice na zmenu umiestnenia tipov:

Niektoré témy majú stĺpce alebo widgety, ktoré skrývajú horizontálne alebo vertikálne pretečenie. Knižnica automaticky detekuje, keď by prepínač spadol mimo viditeľnú časť stránky. Informovanie knižnice o tom, že určité kontajnery skrývajú pretečenie, znamená, že sa tiež pokúsi umiestniť tipy pre prvky v týchto kontajneroch vnútri ich hraníc.

Niektoré témy majú widgety, ktoré prepínajú viditeľnosť obsahu, ako sú akordeóny, karty a prezentácie. Tipy vnútri týchto prvkov budú tiež skryté. Poskytnutie zoznamu selektorov pre tieto widgety znamená, že Editoria11y krátko pozastaví, keď sa používateľ pokúsi skočiť na tieto tipy pomocou tlačidla ďalší alebo predchádzajúci. Témy a moduly Drupalu môžu potom sledovať pokyny zo sekcie knižnice o práci s tipmi na skrytom obsahu na zobrazenie skrytého obsahu.

Napíšte vlastnú konfiguráciu

V PHP: modul Drupal poskytuje hook_editoria11y_alter_config na zmenu obsahu drupalSettings.editoria11y v module alebo téme. Napríklad:

Modifikácia drupalSettings pomáha iba vtedy, ak je JS modulu už nastavený na odovzdávanie tejto hodnoty knižnici. Na pridanie ďalších parametrov musíte priamo modifikovať JS objekt options. Modul kontroluje jednu globálnu JS premennú editoria11yOptionsOverride. Ak je táto nastavená, odovzdá objekt options funkcii editoria11yOptions, ktorú ste poskytli vo vašom module alebo téme. Teraz môžete nastaviť ľubovoľné z parametrov knižnice.

Napíšte vlastné testy

Najprv v konfigurácii modulu pridajte 1 k možnosti „Vlastné testy", aby vedel, že má sledovať testy.

Potom vytvorte JS knižnicu Drupalu s vašimi testami vo vašej téme alebo module, pomocou príručky knižnice na písanie vlastných testov.

Tu je funkčný príklad z Princetonu vlastného testu na upozornenie na Safe Links. Všimnite si, že pristupuje ku triede Editoria11y cez Drupal.Ed11y.

Získanie pomoci

Pozrite si stránku kontaktov pre možnosti komunitnej podpory. @itmaybejj je zvyčajne online na Drupal Slacku, keď slnko svieti na západnej pologuli.

Väčšina úrovní príspevku CSA zahŕňa ročné stretnutie, ktoré môže zahŕňať priamu pomoc s nastavením a konfiguráciou