Kristýna Marková Kristýna Marková

Letem frontendovým světem, vol. 15

Poslední dny před zaslouženým vánočním odpočinkem neleníme a nasáváme poslední frontendové novinky roku 2023. Pojďme se společně podívat, co náš tým zaujalo nejvíce.

20. prosince 2023|3 minuty čtení

CSS Wrapped 2023

2023 byl pro CSS skvělým rokem. Tento článek od Chrome luxusně shrnuje CSS vlastnosti, které letos CSS obohatily. Za zmínku stojí například Media Query Scripting, které detekuje použití Javascriptu. Díky tomu již nebude potřeba využívat Javascript pro odebírání no-js třídy na HTML. Která CSS vlastnost letos zaujala vás?

Horizontální oddělovače mezi select options

Chrome 119+ a Safari 17+ umožňují přidávat mezi options <hr> pro vizuální oddělení položek. Alternativně lze použít obalení options do <optgroup>, kde je však potřeba uvést label. Bez uvedení labelu totiž vznikne pouze prázdný řádek, což položky také oddělí, ale výsledek není tak pěkný. Podpora napříč prohlížeči je zatím slabá.

Text-wrap: pretty

Chrome 117 uvedl novou CSS vlastnost text-wrap: pretty, která zamezuje zalamování sirotků na nový řádek. Dle oficiální ukázky předchází také zalamování sirotka s předložkou (tedy 2 slova). Co se týče českých textů, pro ty bohužel zalamování nefunguje. Avšak zalomení dvojice číslovky a textu, jako například "15 let", na nový řádek funguje i v češtině. Vlastnost má zatím slabou podporu, tak se třeba v budoucnu dočkáme zkrášlení textu i v české verzi. 🙂

Zajímají tě novinky ze světa frontendu?

Přihlas se k našemu newsletteru nebo nás sleduj na sociálních sítích.

Browserstack accessibility tool

Pokud znáte a používáte Browserstack pro testování webových stránek a aplikací na různých zařízeních v různých prohlížečích, jistě oceníte i novinku pro testování přístupnosti.

Jednoduše si stáhnete rozšíření pro testování přístupnosti a to následně otevřete v DevTools. Samotné testování se potom dělí na tři části: Workflow scanner (testování v reálném čase bez nutnosti opakovaného skenování stránky v různých stavech), Assisted test (snadná identifikace problémů s přístupností pro pokročilejší uživatelské interakce, jako je navigace pomocí klávesnice) a Screen reader launcher (přímé testování webových stránek pomocí skutečné čtečky obrazovky na různých platformách, jako jsou Mac, Windows a Android).

Tématem přístupnosti se v Superkoders hodně zaobíráme. Pokud by vás zajímalo víc, sledujte mě na LinkedInu, kde se snažím pravidelně přidávat zajímavosti právě z tohoto oboru.

Podpora :has selektoru ve standardní verzi Firefoxu

A na závěr update jedné z novinek z minulého dílu LFS14. Firefox již od verze 121 podporuje selektor :has, který ještě při psaní minulého dílu fungoval pouze ve verzi Nightly.

Závěrem

Teď víte o všem, co se v posledním měsíci roku 2023 ve světě frontendu událo. Nezapomeňte nás sledovat, aby vám nic neuniklo ani v roce 2024!