Najnowsze wpisy
Strona 9
-
Stylowalne ikonki SVG
To, że SVG jest lepsze od fontów z ikonami, jest już raczej dość powszechną wiedzą. Ale jeden problem związany z SVG wydaje się nas prześladować od lat i wciąż nie widać rozwiązania na horyzoncie: ikony SVG w zewnętrznym pliku są średnio używalne. Nie da się ich ot tak wczytać z zewnętrznej domeny (same origin policy, FTW!), nie da się stylować ich części, a do niedawna w ogóle nic się nie dało z nimi zrobić…
Wszystkie ikony użyte w tym artykule pochodzą z Devicon.
-
Komu tosta?
Ostatnio Google ogłosiło, że zamierza wprowadzić nowy element HTML,
toast/std-toast. Nie trzeba chyba mówić, że wywołało to poruszenie w środowisku… -
HTML nie żyje, niech żyje HTML!
To już oficjalne: HTML5 przestaje istnieć!
W dniu dzisiejszym W3C ogłosiło rozpoczęcie współpracy z WHATWG na rzecz rozwoju jednego, wspólnego standardu HTML i DOM. Wydarzenie to poprzedziło o wiele skromniejsze głosowanie nad porozumieniem wewnątrz WHATWG.
Dla normalnego webdevelopera zmienia się tak po prawdzie dość mało, można by powiedzieć: logo przy standardzie. Niemniej, jak podkreślałem to nieraz, pomiędzy wersją HTML od WHATWG i wersją HTML od W3C istnieją subtelne różnice (jak np. kwestia podejścia do problemu algorytmu outline’u). Pozostaje mieć nadzieję, że wspólne prace WHATWG i W3C doprowadzą do tego, że niektóre rzeczy w końcu, po latach nieowocnych dyskusji, zostaną albo całkowicie usunięte ze standardu HTML, albo gruntownie przeprojektowane.
Bo na razie to w sumie nie wiadomo, czy pić z radości, czy jednak ze smutku…
-
Światowy Dzień Świadomości Dostępności
Dzisiaj obchodzimy Światowy Dzień Świadomości Dostępności (Global Accessibility Awareness Day – GAAD)!
Jak sama nazwa wskazuje, dzień ten jest poświęcony krzewieniu wiedzy na temat problemu dostępności związanej z technologią i oprogramowaniem. Co prawda w ten dzień chyba najszerzej dyskutuje się o problemach związanych z dostępnością stron internetowych, ale poruszane są także inne aspekty dostępności cyfrowej, jak choćby ta związana z aplikacjami desktopowymi i mobilnymi.
Nie byłbym sobą, gdybym nie zdecydował się nieco uświetnić ten dzień. Dlatego też współstworzyłem 2 artykuły dotyczące dostępności stron internetowych (tym razem po angielsku): Practical web accessibility guide oraz Web accessibility testing - DIY!. Myślę, że ten drugi jest nawet ciekawszy, bo jest luźno oparty na tym, w jaki sposób testuję strony na potrzeby WebKrytyka. Miłego czytania!
-
20 lat WCAG
Dzisiaj przypada niezwykle ważna rocznica: 20-lecie powstania standardu WCAG! I choć dla mnie to dość odległe czasy, które niekoniecznie pamiętam, inni pamiętają dobrze.
WCAG dochrapało się jak na razie trzech dużych edycji: WCAG 1.0, WCAG 2.0 oraz WCAG 2.1. Najbardziej drastyczną zmianą było przejście od 1.0 do 2.0, gdzie nagle cały dokument urósł kilkudziesięciokrotnie, równocześnie stając się bardziej abstrakcyjny (bo nie mówił już dłużej wyłącznie o HTML-u i CSS-ie). Nie można też zapomnieć, że w międzyczasie powstała także ARIA – standard, który ma pomóc wtedy, gdy czysty HTML nie daje już rady. Dzięki połączeniu tych dwóch standardów jesteśmy obecnie w stanie tworzyć bardziej dostępne aplikacje niż kiedykolwiek.
Tylko że niekoniecznie tak się dzieje. WCAG i ARIA odstraszają swoimi rozmiarami i względną złożonością, a sam problem dostępności jest często marginalizowany. Pijąc szklankę coli za 20 lat WCAG, wypijmy też za wyższą świadomość dostępności wśród nas wszystkich, webdeveloperów.
-
Światełko w tunelu
Być może mój pesymizm związany z końcem HTML5 okaże się przesadzony. Wszystko wskazuje bowiem, że negocjacje pomiędzy W3C a WHATWG faktycznie do czegoś prowadzą i wypracowano wstępny zarys porozumienia.
-
Aktualna data bez daty
Dzisiaj na Facebooku ktoś zadał ciekawe pytanie: jak w JS wyświetlić aktualną datę i czas, nie używając
Dateani nie pobierając czasu z żadnego zewnętrznego źródła (nawetinput[type=datetime-local])? Przyjrzyjmy się zatem, jak to zrobić! -
Koniec HTML5?
Dzisiaj, czyli 31 marca 2019, kończy się “czarter” Web Platform Working Group. A wraz z nim prawdopodobnie kończy się także historia HTML5 (i DOM 4). I nie, nie jest to przedwczesny żart primaaprilisowy.
-
Sto lat, WWW!
Dzisiaj Sieć obchodzi swoje 30. urodziny. Wszystkiego najlepszego!
Naprawdę przeszliśmy długą drogę: od prostych dokumentów i ich przeglądarek do platformy zdolnej uruchomić praktycznie dowolny język programowania, która w dodatku jest niemal niezależna od infrastruktury internetowej. Osobiście pamiętam jeszcze stare, dobre czasy i choć często z niepokojem patrzę na rozwój Sieci, nie mogę odmówić jej jednego: zawsze ostatecznie wygrywa, dzięki swej upartej ewolucji.
Jak będzie wyglądać Sieć za 30 lat? Nie mam pojęcia. Ale wiem jedno: na pewno będzie piękna.
-
Czy div jest dostępny?
14 lutego Ryan Florence napisał na Twitterze, że przyciski w React Native Web (RNW) są dostępne:
Both true:
-
Most devs should just use a
<button>, not<a>,<div>,<span>, etc. -
React Native Web’s div buttons are better buttons than
<button>
- Still keyboard and AT accessible
- Better touch event handling
- Populate
e.relatedTargetunlike<button> - Easier to style
I think a lot of HTML/CSS experts are being overly critical of React because they see the output of the new https://twitter.com and think they know there are fundamental flaws when they see the div soup.
That div soup is accessible.<h2/> <div role="heading" aria-level="2"/> <button/> <div {...allTheRightAttributesAndEventHandlers}/>These are identical as far as accessibility is concerned when implemented correctly.
If you’re critical of this, you don’t actually care about a11y, you care about your niche
So yeah … just use a button, or a RNW button, but not your own div button.
[Obydwa stwierdzenia są prawdziwe:
- Większość devów powinna używać
<button>zamiast<a>,<div>,<span>itd. - Przycisk z React Native Web oparty o div jest lepszy niż
<button>: - Wciąż dostępny z poziomu klawiatury i technologii asystującej.
- Lepsza obsługa dotyku.
- Zawiera
e.relatedTargetw przeciwieństwie do<button>. - Łatwiejszy do stylowania.
Myślę, że wielu ekspertów HTML/CSS jest zbytnio krytycznych względem Reacta, ponieważ widzą oni kod nowego Twittera i myślą, że wiedzą, żę są tam podstawowe błędy, gdy widzą divową zupę.
Ta divowa zupa jest dostępna.
<h2/> <div role="heading" aria-level="2"/> <button/> <div {...allTheRightAttributesAndEventHandlers}/Te kody są identyczne, jeśli bierzemy pod uwagę poprawnie zaimplementowaną dostępność.
Jeśli jesteś krytyczny wobec tego, tak naprawdę nie dbasz o dostępność, ale o własną niszę.
Więc tak… po prostu użyj przycisku albo przycisku z RNW, ale nie swojego własnego przycisku na
div.]Takie podejście jest nie tyle niewłaściwe, co szkodliwe. Postaram się pokrótce przybliżyć, czemu tak uważam.
-