Câteva lucruri pe care le-am luat dintr-un eveniment în afară de 2022 în Denver PlatoBlockchain Data Intelligence. Căutare verticală. Ai.

Câteva lucruri pe care le-am luat dintr-un eveniment în afară de 2022 din Denver

Un eveniment aparte 2022 Denver împachetat ieri. Și deși nu am reușit să ajung în toate cele trei zile de data aceasta, am prins acțiunea de ieri - și a fost minunat. Nu sunt foarte sociabilă sau sociabilă, dar aceasta a fost prima conferință la care am fost în cel puțin câțiva ani și să văd oameni în persoană a fost incredibil de revigorant.

Am luat notițe, desigur! M-am gândit să le postez aici pentru că distribuirea este îngrijorătoare. Cel puțin, asta mi-a spus copilul meu de șase ani zilele trecute când mi-a cerut o mușcătură din desert aseară.

Voi descompune asta în funcție de difuzor. Avertisment corect: Mă refer la notițe scrise de mână și un tip destul de vizual, așa că notele mele tind să fie mai puțin... structurate decât majoritatea. Și aceste notițe sunt doar lucruri care m-au remarcat. Poate nici nu sunt ideea principală a prezentatorului, dar mi-au atras atenția!

Chris Coyier: Site-urile sunt bune acum

Rezoluție înaltă

Chris a ținut această discuție înainte (am legat-o doar săptămâna trecută), dar de data aceasta l-am extins substanțial, în special cu detalii unități relative ale containerului care, atunci când este combinat cu clamp(), asigură o capacitate de răspuns mai precisă, deoarece valorile sunt mai degrabă relativ la container decât la fereastra de vizualizare. Deci, știți cât de des folosim lățimea ferestrei (vh) unități pentru tipul de fluid?

font-size: clamp(1rem, 1rem + 2vw, 2rem);

Ei bine, putem folosi o unitate relativă a containerului, cum ar fi interogare container inline-size (cqi) în schimb, unde 1cqi este egal cu 1% din dimensiunea în linie a containerului (aici este proiectul de specificații despre asta):

font-size: clamp(1rem, 1rem + 1cqi, 2rem);

Chris a vorbit destul de mult despre beneficiile performanței gazduire la margine. Probabil nicio surpriză pentru că el este scris despre aici mai mult de câteva ori. Chiar și ca cineva care citise deja acele articole, sincer nu mi-am dat seama de conceptul complet de calcul la margine.

Ideea este înșelător de simplă: CDN-urile globale pot servi bunuri rapid pentru că le găzduiesc aproape geografic de utilizator. Aceasta este o practică destul de standard pentru difuzarea imaginilor raster. Dar s-a extins la fișierele statice, cum ar fi aceleași fișiere HTML, CSS și JavaScript care alimentează un site - creați-le în avans și serviți fișierele deja compilate și optimizate din CDN-ul global rapid. Acesta este întregul concept Jamstack!

Dar ce se întâmplă dacă mai aveți nevoie de un răspuns de la server? Asta nu e foarte avantajos, nu-i așa? Ei bine, acum avem handlere capabile să ruleze pe o singură adresă URL care să preia date în avans și să le injecteze înainte de randare - direct din CDN. Sigur, se lucrează suplimentar în fundal. Totuși, faptul că putem prelua în mod dinamic date, le putem injecta, le putem preconstrui, le putem servi static la cerere, și să ruleze din punct de vedere geografic mai aproape de utilizator face acest lucru uluitor de rapid.

Tolu Adegbite: Cum să câștigi la ARIA și să influențezi accesibilitatea web

Câteva lucruri pe care le-am luat dintr-un eveniment în afară de 2022 în Denver PlatoBlockchain Data Intelligence. Căutare verticală. Ai.
Rezoluție înaltă

Doamne, aceasta a fost o prezentare excelentă! Tolu Adegbite m-a instruit atât de mult pe WAI-ARIA încât mi-a fost greu să notez toate pietrele prețioase pe care le împărtășea — Roluri! State! Etichetare! Descrieri! Totul a fost extraordinar de bine acoperit și lucruri la care știu că voi reveni din când în când.

Dar un lucru specific care mi-a atras atenția este accesibilitatea SVG-ului inline. Chiar dacă SVG este legat de alte tipuri de active de design, faptul că este un marcaj la sfârșitul zilei îl deosebește deoarece nu este întotdeauna identificat ca o imagine.


An illustrated brown and white tabby kitten looking lovingly into the camera.



  

Tehnologia de asistență are mai multe șanse să citească SVG în linie ca o imagine, oferindu-i un rol și o etichetă accesibilă adecvată:


  

Miriam Suzanne: Straturi în cascadă de !mportanţă

Câteva lucruri pe care le-am luat dintr-un eveniment în afară de 2022 în Denver PlatoBlockchain Data Intelligence. Căutare verticală. Ai.
Rezoluție înaltă

Hei, un alt alum CSS-Tricks! Miriam a petrecut o grămadă de timp și efort pe Specificații Cascade Layers. Ea a scris și un mare ghid despre ele aici la CSS-Tricks și am vorbit despre ele la An Event Apart.

Ceea ce mi-a ramas cel mai mult este cat de mare este schimbarea mentala. Conceptul nu este complicat, în sine. Declara @layer în partea de sus a documentului CSS, enumerați straturile în ordinea specificității, apoi scrieți stilurile în acele straturi. Dar pentru un dinozaur bătrân ca mine, care scrie CSS de ceva vreme, va trebui să mă obișnuiesc cu faptul că Cascade Layers fac posibil ca un simplu selector de clasă să învingă ceva care de obicei are o specificitate mai mare, ca un act de identitate.

🤯

Miriam a reamintit, de asemenea, camerei că Straturile în cascadă sunt doar un instrument pe care îl avem în centura noastră de instrumente de gestionare a specificității, în plus față de selectoarele care afectează specificitatea (de exemplu, :is(), :where(), și :has()).

Oh, și acesta este o informație interesantă. În timp ce Miriam a parcurs istoria specificității în CSS, ea și-a amintit asta !important a fost conceput inițial ca un instrument pentru ca utilizatorii să înlocuiască stilurile de agent de utilizator și de autor. Dar undeva în continuare, l-am adoptat pentru a forța stilurile de autor să ajungă la vârf. Straturile în cascadă ajută la eliminarea scuză nevoie de utilizare !important pentru că ne oferă puterea de a „prioritizează straturile și proteja moștenirea. "

Asta e frumos spus, Miriam!

Dave Rupert: Deblocarea Backlog-ului de accesibilitate

Câteva lucruri pe care le-am luat dintr-un eveniment în afară de 2022 în Denver PlatoBlockchain Data Intelligence. Căutare verticală. Ai.
Rezoluție înaltă

Imaginați-vă că vă treziți într-o zi cu sute de notificări GitHub despre probleme raportate pe site-ul dvs. De unde începi? Poate închideți laptopul și obțineți un canal radicular? Asta i s-a întâmplat lui Dave! Un audit automatizat de accesibilitate a returnat o grămadă masivă de erori și le-a atribuit drept bilete pentru ca Dave să le repare.

Dar a observat un model după ce a luat o foaie de calcul Excel cu acele probleme, le-a mutat în Notion pentru o vizualizare mai bună, a ascuns coloanele inutile, a clasificat totul și a afișat rezultatele în grupuri logice. Multe dintre problemele raportate au fost aceeași problemă repetată pe mai multe pagini. Doar pentru că un test automat returnează o mână de erori nu înseamnă că toate sunt unice. Asta a redus o bună parte din bilete.

El a continuat să arate cum – cu un efort relativ mic – stocul de probleme s-a redus cu aproape 50%.

Sunt multe de adunat acolo, mai ales în ceea ce privește modul în care ne procesăm și ne organizăm munca. Cea mai mare concluzie pentru mine este când Dave a spus că trebuie să punem accent pe indivizi și interacțiuni în detrimentul proceselor și instrumentelor. Instrumente precum cel care scanează erorile de accesibilitate sunt utile, dar este posibil să nu spună întreaga poveste. În loc să-i iei în cuvinte, merită să pui întrebări și să câștigi mai mult context înainte de a te scufunda în mizerie.

Ca bonus, reorganizarea problemelor din Notion i-a permis lui Dave să grupeze problemele într-un mod care să arate clar care deficiențe discriminează în mod activ produsul său, oferindu-i mai multă empatie pentru acele greșeli și cum să le prioritizeze.


Încă o sesiune virtuală a lui Hui Jing Chen a încheiat ziua, dar, desigur, am ratat aproximativ jumătate din ea pentru că aveam o conversație pe hol. Conversația a meritat, deși sunt supărat că am ratat prezentarea. Voi urmări videoclipul când va fi publicat!

Timestamp-ul:

Mai mult de la CSS Trucuri