An Event Apart 2022 Denver afsluttet i går. Og selvom jeg ikke var i stand til at nå alle tre dage denne gang, fangede jeg gårsdagens handling - og det var den fantastisk. Jeg er ikke særlig social eller udadvendt, men dette var den første konference, jeg har været til i mindst et par år, og det var utroligt forfriskende at se folk personligt.
Jeg tog selvfølgelig noter! Jeg tænkte, at jeg ville poste dem her, fordi deling er omsorgsfuldt. Det var i hvert fald, hvad min seks-årige fortalte mig den anden dag, da han bad om en bid af min dessert i går aftes.
Jeg vil opdele dette efter højttaler. Retfærdig advarsel: Jeg handler om håndskrevne noter og en smuk visuel fyr, så mine noter har en tendens til at være mindre... strukturerede end de fleste. Og disse noter er bare ting, der skilte sig ud for mig. De er måske ikke engang oplægsholderens hovedidé, men de fangede min opmærksomhed!
Chris Coyier: Hjemmesider er gode nu
Chris har holdt denne tale før (vi koblede det sammen blot i sidste uge), men denne gang udvidede det væsentligt, især med detaljer om beholder relative enheder som, når det kombineres med clamp(), sørge for mere nøjagtig reaktion, fordi værdierne er relative til containeren snarere end viewporten. Så du ved, hvordan vi ofte bruger viewport-bredde (vh) enheder til væsketype?
font-size: clamp(1rem, 1rem + 2vw, 2rem);Nå, vi kan bruge en beholder relativ enhed som containerforespørgsel inline-størrelse (cqi) i stedet hvor 1cqi er lig med 1 % af beholderens inline-størrelse (her er udkastet til spec om det):
font-size: clamp(1rem, 1rem + 1cqi, 2rem);Chris talte også en del om præstationsfordelene ved vært på kanten. Det er nok ikke nogen overraskelse, for det er han skriftlig om det link. mere end et par gange. Selv som en, der allerede havde læst disse artikler, var jeg ærligt talt ikke klar over det komplette koncept med databehandling ved kanten.
Ideen er vildledende simpel: globale CDN'er kan tjene aktiver hurtigt, fordi de hoster dem geografisk tæt på brugeren. Det er ret almindelig praksis for visning af rasterbilleder. Men det har udvidet sig til statiske filer, såsom de samme HTML-, CSS- og JavaScript-filer, der driver et websted - byg dem på forhånd og server de allerede kompilerede og optimerede filer fra det hurtige globale CDN. Det er hele Jamstack-konceptet!
Men hvad hvis du stadig kræver et serversvar fra det? Det er ikke særlig kant-y, er det? Nå, nu har vi behandlere, der er i stand til at køre på en enkelt URL, der henter data på forhånd og injicerer dem forud for gengivelse - direkte fra CDN. Selvfølgelig sker der ekstra arbejde i baggrunden. Alligevel er det faktum, at vi dynamisk kan hente data, injicere det, præ-bygge det, tjene det statisk On Demand, og få det til at køre geografisk tættere på brugeren gør dette lynhurtigt.
Tolu Adegbite: Sådan vinder du i ARIA og påvirker webtilgængelighed
Gud var det en fremragende præsentation! Tolu Adegbite underviste mig så hårdt i WAI-ARIA, at jeg havde svært ved at notere alle de ædelstene, hun delte – roller! stater! Mærkning! Beskrivelser! Alt var ekstraordinært godt dækket, og ting, som jeg ved, jeg vil vende tilbage til igen og igen.
Men en bestemt ting, der fangede min opmærksomhed, er tilgængeligheden af inline SVG. Selvom SVG er relateret til andre typer designaktiver, adskiller det faktum, at det er markup i slutningen af dagen, det, fordi det er ikke altid identificeret som et billede.
Assisterende teknologi er mere tilbøjelige til at læse inline SVG som et billede ved at give det en passende tilgængelig rolle og etiket:
Miriam Suzanne: Kaskadende lag af betydning
Hej, endnu en CSS-Tricks alun! Miriam har brugt en masse tid og kræfter på Cascade Layers specifikation. Hun skrev også en stor gammel guide om dem her på CSS-Tricks og talte om dem på An Event Apart.
Det, der har bidt sig mest i mig, er, hvor stort et mentalt skift det her er. Konceptet er ikke kompliceret i sig selv. Erklære @layer øverst i CSS-dokumentet skal du angive lagene i rækkefølge efter specificitet, og derefter skrive stile i disse lag. Men for en gammel dinosaur som mig, der har skrevet CSS i et stykke tid, bliver jeg nødt til at vænne mig til, at Cascade Layers gør det muligt for en simpel klassevælger at slå noget ud, der normalt har en højere specificitet, som et ID.
🤯
Miriam mindede også rummet om, at Cascade Layers kun er ét værktøj, vi har i vores specificitetsadministrerende værktøjsbælte, foruden vælgere, der påvirker specificitet (f.eks. :is(), :where()og :has()).
Åh, og dette er en interessant godbid. Da Miriam gik gennem historien om specificitet i CSS, huskede hun det !important blev oprindeligt designet som et værktøj til brugere til at tilsidesætte brugeragent- og forfatterstile. Men et eller andet sted nede i linjen har vi adopteret det for at tvinge forfatterstile til toppen. Cascade Layers hjælper med at fjerne undskyldning nødt til at bruge !important fordi de giver os magten til at "prioritere lag , beskytte arv".
Det er smukt sagt, Miriam!
Dave Rupert: Fjerner blokeringen af din tilgængelighedsefterslæb
Forestil dig at vågne op en dag til hundredvis af GitHub-meddelelser om rapporterede problemer på dit websted. Hvor begynder du overhovedet? Måske lukke din bærbare computer og få en rodbehandling i stedet for? Det skete for Dave! En automatiseret tilgængelighedsrevision returnerede en massiv bunke fejl og tildelte dem som billetter, som Dave kunne rette.
Men han bemærkede et mønster efter at have taget et Excel-regneark med disse problemer, flyttet dem til Notion for at få et bedre overblik, skjult unødvendige kolonner, kategoriseret alt og vist resultaterne i logiske grupper. Mange af de rapporterede problemer var det samme problem, der blev gentaget på flere sider. Bare fordi en automatiseret test returnerer en håndfuld fejl, betyder det ikke, at de alle er unikke. Det reducerede en pæn del af billetterne.
Han fortsatte med at vise, hvordan - med relativt lille indsats - efterslæbet af problemer faldt med næsten 50 %.
Der er meget at hente, især med hensyn til hvordan vi bearbejder og organiserer vores arbejde. Den største takeaway for mig er, da Dave sagde, at vi skal lægge vægt på individer og interaktioner frem for processer og værktøjer. Værktøjer som det, der scanner for tilgængelighedsfejl, er nyttige, men de fortæller måske ikke hele historien. I stedet for at tage dem på deres ord, er det værd at stille spørgsmål og få mere kontekst, før du dykker ned i rodet.
Som en bonus gav reorganiseringen af problemerne i Notion Dave mulighed for at gruppere problemer på en måde, der klart viser, hvilke svækkelser hans produkt aktivt diskriminerede imod, hvilket gav ham større empati for disse savner, og hvordan man prioriterer dem.
Endnu en virtuel session af Hui Jing Chen afsluttede dagen, men indrømmet, jeg gik glip af omkring halvdelen af den, fordi jeg havde en samtale på gangen. Samtalen var det værd, selvom jeg er ærgerlig over, at jeg gik glip af præsentationen. Jeg vil se videoen af den, når den er offentliggjort!
