Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Browser and UI #1 CSS
Search
ken7253
February 24, 2025
Programming
200
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Browser and UI #1 CSS
Browser and UI #1 CSS にて発表したスライドです。
ken7253
February 24, 2025
More Decks by ken7253
See All by ken7253
見出しとはなにか
ken7253
0
0
Firefoxにコントリビューションして得られた学び
ken7253
2
200
バンドルサイズを半減させた話 @Browser and UI #3
ken7253
0
93
CSS polyfill とその未来
ken7253
0
320
Browser and UI #2 HTML/ARIA
ken7253
2
380
PEPCは何を変えようとしていたのか
ken7253
3
640
レビューのやり方を(ちょっと)整理した話
ken7253
1
640
オーバーロード関数の話 @Mita.ts #2
ken7253
0
190
フロントエンドカンファレンス北海道参加レポート
ken7253
0
110
Other Decks in Programming
See All in Programming
AmebaブログはKMPから卒業します
kmars0605
0
340
Engineering Biometric UX Across Android Versions | DroidKnights 2026
ryunen344
1
190
AI時代のFlutter品質設計 — アプリ品質を守るQuality Layers
omatty198
0
360
PumaからFalconに移行したRailsアプリケーションでの実践
falcon8823
0
370
Distance field of Julia set
kinakomoti321
0
310
社内AIエージェント「Askワンバン」における コストチューニングの取り組み
t0yohei
0
170
Railsのためのパスキー実践入門 〜マルチテナントSaaSでの意思決定〜
utakaha
4
3.7k
Vapor Mode でアクセシビリティは 壊れないか検証した話
fuqda
1
330
AI Augmentation Techniques with Liberty
ivargrimstad
1
420
Long Living Tokens, Die, Die, Die! (or: The One Ring is Banned in Modern)
sylph01
0
420
Claude Code ハーネスDeep Dive – 君はどこまで制御する? -
takateeen_knj
6
4.5k
AIがコードを書いてくれる時代、我々は何を確かめるのか
yosuke_furukawa
PRO
13
5.8k
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
Site-Speed That Sticks
csswizardry
13
1.6k
How to build a perfect <img>
jonoalderson
1
6.2k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.9k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
400
Game over? The fight for quality and originality in the time of robots
wayneb77
1
330
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
10k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
18k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
68
60k
Accessibility Awareness
sabderemane
1
290
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
510
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
430
Transcript
Browser and UI #1 CSS
ブラウザの標準化まわりを追うのが趣味 最近はReactを使ったアプリケーションを書いています。 ユーザーインターフェイスやブラウザが好き。 https://github.com/ken7253 https://zenn.dev/ken7253 https://bsky.app/profile/ken7253.bsky.social ken7253 Frontend developer
JSConfのイベントにてPEPCについて話します!
TSKaigiのCfP応募受付中です!
Browser and UI とはなにか
フロントエンドエンジニアの勉強会 狭義の
フロントエンドエンジニアの勉強会 話していきたいこと ブラウザの仕様・標準化の話 ブラウザの実装について UI・デザインの話 UI実装を支えるツール フォント・画像とかのアセット系の話とかも 狭義の
フロントエンドエンジニアの勉強会 積極的にはやらないこと ライブラリ・フレームワーク論 (サービス全体の)設計論・アーキテクチャ サーバーサイドの話 技術以外の話 狭義の
お願いしたいこと
お願いしたいこと 誰かを不快にさせる行動・発表はしないでください。 ミニマムな開催にご協力をお願いします。 次回以降の会場提供できそうな人は教えて下さい。 また次回やるので来てください!
Opening talk
簡単にCSSの動向を追う方法
最近のCSSの進化 CSS View Transitions Module CSS Anchor Positioning CSS Basic
User Interface Module appearance / interactivity CSS Scrollbars Styling Module scrollbar-color / scrollbar-width CSS Properties and Values API @property CSS Values and Units Module calc-size() / interpolate-size CSS Conditional Rules Module @container
多すぎる…!
簡単にCSSの動向を追う方法
簡単にCSSの動向を追う方法 趣味じゃない人は(たぶん)全部追わなくてもいい 自分の場合mozaic.fmを散歩中に止まらず聞けるようにしたかった 提案段階の仕様とかまで追うのは大変 まとめると大変なので週単位とかで追えるようにしていく
intent to ship
intent to ship みんな大好きintent to ship Twitter or Bluesky で気軽に見れる
blink-devは情報がコンパクトにまとまっているため調査の起点に 仕様を追ってる人は大体見てるイメージ shisamaさんのブログが分かりやすい。 https://shisama.hatenablog.com/entry/2019/01/24/075701
intent to ship
intent to ship(blink-dev)
CSS WG Minutes
CSS WG Minutes 週に1回ぐらいの更新 提案段階などの早い段階から追いたい人向け 議論の内容とかも見れるので経緯とかを知りたい人にも APIというよりかは仕様っぽい話が中心 これだけだとブラウザの実装状況は追えない たまにHTMLやARIAとのミーティングがある
CSS WG Minutes
CSS WG Minutes https://zenn.dev/progfay/articles/visited-selector-privacy :visited 疑似クラスの前提についてはこの記事が分かりやすい。
BCD-watch 毎週月曜日に1回更新 BCD(browser-compat-data)の差分を1週間分出してくれる ブラウザに実装されたタイミングとかで知りたい人向け CSS以外の情報も入ってくる Full Weekly ReportとUniversal Implementations Weekly
Reportがある 解説ブログ書きました。 https://zenn.dev/ken7253/articles/browser-compat-data-watch
BCD-watch
Release Note 頻度はリリース依存 頻度は少ないが(前の2つと比べると)ボリュームが多い ブラウザ毎に追わないといけない チームで時間取って読むと楽しいかもしれない
自分の使い方 定期的にやってること 月曜日とかにBCD-watchのFull Weekly Reportを一通り見る 同じタイミングぐらいでCSS WGのMinutesも読む リリースノートは出てたら軽く流し読み程度 CSS WGのMinutesならissueのリンクが張ってある場合があるのでそれを読む。
BCD-watchならMDNへのリンクと仕様書のリンクがあるのでそれを読む。 そもそもどういう提案なのか知らなかったらblink-devからExplainerを読みに行く。 standards-positionsを見ておくと標準化の合意が得られそうかが分かる。
自分の使い方
ありがとうございました!