The web platform is evolving quickly, with UI features to improve developer experiences, create new responsive capabilities, and enable more accessible interface defaults. Get a high level overview of what you can get excited about in the UI space and look out for on the web platform for CSS and HTML.
Speaker: Una Kravets
Watch more:
Watch all the Technical Sessions from Google I/O 2023 →
Watch more Web Sessions →
All Google I/O 2023 Sessions →
Subscribe to Google Chrome Developers →
#GoogleIO
Want to learn more about these announcements? 🤔 Ask the Chrome Dev team in the comments below. 👇👇🏻👇🏿👇🏽 👇🏾👇🏼
Mano, porque não tem dublagem em Português? logo o canal do Google, poderia pelo menos colocar dublagem. E não seu burro, não estou falando para o vídeo estar em português na integra, estou falando de Faixas de Audio que existe no Youtube para "dublar" o próprio vídeo.
Are there transcripts or accompanying blog posts?
This is HUGE! I remember coming across a few issues fairly recently that would have been muuuuch easier to overcome with some of these new features presented here
The CSS :has property have saved my life this week
WOOOOOW!!! I can't wait 😄
Thank you, Una!
Personally text wrap balance looks really bad visually.
What is the difference between dialog and popover and when should we use one or the other?
"Look at these fancy features" -> developer gets excited, sees that Safari Support starts with 16 or not at all… realizes he has to wait another 2 years until less people use Safari 14.1 and is disheartened.
Cool stuff, but one major thing essential for form styling is still missing out in Chrome: subgrid support.
Nice!
But still no `:wrapped` pseudo selector for elements which are wrapped while resizing the parent element (flexbox, grid, inline). This feature has been requested for over 10 years, check stackoverflow please.
Fabulous summary of a wonderful set of new css features. It’s great to have less JS in my life.🎉
Woohoo! All of the latest CSS developments in the past year compressed into one video! EXACTLY what the world needs! @Una, you're the best!
Finally this solution with 100vh, no messing around anymore for cross browser support. awesome. top layer also nice
Why dom manipulation is only limited to JS? We need browser to support direct calling of Web apis without js
9:18 damn, really killshot SCSS here lol
Remeber last year and your shouts about subgrid? Gues what? We're still waiting 😉
Dynamic viewport height finally, gosh. {insert Michael thank-you.gif}
This is all so cool. So many of these I've been using complex javascript to do, for example the radial menus, doing my own trigonometry and stuff. It's great to see these things being implemented. At the same time it's bittersweet, because using these also would also leave a significant number of browsers (and therefore users) unsupported. I'll set a timer for a couple years to use these.
I am currently attempting to make a simple browser…..this is absolutely demotivating for me. 🥲
this is amazing
Stop rendering white then black when user opt for dark-mode.
Edit: A flashing white when using dark-mode is simply annoying. Can we do something about it?
10:59 What's the use of CSS scope here? As we have CSS nesting and we can do the same using it?
Will it be possible to use colour mix with CSS and SVG-CSS blend modes? I did quite a lot of experiments and noticed that in Safari the colours are just popping, whereas Chrome and Firefox turning them into gray mess supposedly because of linear sRGB interpolation.
Does anyone know what monospace font is used for the code in this presentation?
Now let's wait 3 years for Safari & Firefox to implement these
Can't wait for firefox to catch up so we can start using these..
All these innovations are very cool, but could you buy an Apple and Firefox campaign? So that all popular browsers are updated at the same time, and we don’t wait 3–5 years for degenerates from Apple to deign to introduce new features into their damn browser.
finally dynamic viewport units! The dynamic viewport was painful experience to overcome
We now have math and try/catch mechanics in CSS … 😂👌
nice use of the word 'duplicitous'
I am not sure how I feel about adding runtime support for things that were ment to execute at build-time (like CSS scopes) and native support for common components like popover (which is not even an element) or selectmenu.
What happens if these features fall out of fashion? What happens if we need something new? The advantage of managing this with JS was that the developers could extend a ~~minimalist~~ already bloated set of elements with whatever they needed and have complete control over it.
Edit: I am starting to suspect that Google is trying to bloat and slow down the web platform to make Flutter a more attractive option
Finally a select menu . goddamn .
Awesome time to be a web developer, thank you Una.
that's dope, i'm so happy about these new updates
FINALLY Display: none animation support
Whoa! So much great stuff! Thanks for a great video, Una, as always!)
З.і.: пасхалочку з кольорами українського прапору помітив)) Дяки)) Все буде Україна!)
Love the new architectural foundations. Sass features in native css.
Please make it better so that Arc browser will be even better.
This lady's parents LOVED the game uno, but the mum had a little but of sense and decided to change her name to Una. *camouflage *
Super exciting stuff!