ウェブ制作会社ICS代表。筑波大学非常勤講師。HTML/CSS/JavaScriptを用いたユーザビリティーを意識したUI構築が専門で、3D表現・クリエイティブコーディングが得意。著書『フロントエンドの知識地図』など技術書14冊を執筆。趣味でタイムラプス撮影。
東京都品川区
Joined April 2007
- Tweets31.8K
- Following1K
- Followers31.7K
- Likes26.1K
Pinned Tweet
羽田空港の過密ダイヤをタイムラプスで撮影。
こんなに離着陸が規則正しいとは驚き。
パイロットすごい！
カメラ: SONY α7RⅢ
レンズ: SIGMA 135mm f1.8 Art
#タイムラプス #timelapse
池田 泰延 retweeted
新着記事のお知らせ
Tailwind CSS入門 - ICS MEDIA
日本語： ics.media/entry/261016/?utm_…
English: ics.media/en/entry/261016/?u…
フロントエンドカンファレンス関西2026の発表スライドを公開しました！
HTML-in-Canvasで作る未来のWeb UI表現 - Speaker Deck speakerdeck.com/clockmaker/h…
#fec_kansai
発表動画も公開しました！
モーションの演出やブラウザの挙動など、画面で見た方が利点がわかりやすいので、YouTubeでの視聴がオススメです！
youtube.com/watch?v=CRnSDIaG…
イベントの感想レポートより。
フロントエンドカンファレンス関西2026に参加してきました｜小泉岳人 note.com/rich_hyssop406/n/n9…
今回の発表では、スライドの動きをこだわったので、取り上げていただき嬉しい限りです！
#fec_kansai
Studioも不正アクセス被害に。
私は使ったことないのですが、ウェブ業界に影響大きそうです。
【重要】不正アクセスによる情報流出に関するお詫びとお願い（第一報） | 最新情報 | Studio studio.design/ja/whats-new/u…
フォントのリガチャで実現しているのですね！
技術的に面白いですし、利用者にとっても手軽で素敵です。
Hey Japanese learners! I built a font that renders Furigana or Romaji above Kanji, with ligatures to support words. You can apply it anywhere to get furigana notations for free.
Give it a try, and I hope it will be helpful :)
furifont.antfu.me/
YouTubeは英語音声（オートダビング）を有効にしました。
流暢な英語で発表していて、自分でもビックリします（笑） 自分はぜんぜん英語をしゃべれません。
英語で視聴したい海外の方々もどうぞご覧下さい。
youtube.com/watch?v=CRnSDIaG…
これホントそう！
入力フォームはmaxlength で実装するな、ということ。
ペーストしたとき、テキストが上限でちょん切られるから。
デジタル庁のデザインシステムで良い例が示されている。
エンジニアは楽してmaxlengthを使いがち。
#fec_kansai
生成AIの利用で、ウェブアクセシビリティの問題が増えている。
・WAI-ARIAを使っていないページより、使ってるページは平均エラー数が多い
・要因の一つに、Vibe coding があるのではないか
#fec_kansai
aria-label 属性の文言が可視テキストを上書きするのは課題がある。
違う文言が指定されていると、音声コントロールで、操作に問題が出てくるから。
#fec_kansai
①HTML <canvas>タグだとfillText()メソッドぐらいしかなく、文字組を作るのは大変。
②CSSだと美しい文字組が簡単に作れる。
③HTML-in-Canvasなら、CSSの見た目を<canvas>タグに持ってこれる。
④つまり、Canvasの弱点を補える、という解説でした。
#fec_kansai #fec_kansai_ookini – at Osaka-shi Kita-ku, Osaka
ご清聴ありがとうございました！
多くの方々に聞いて頂けて嬉しかったです。
発表資料は動画化して公開します。
しばしお待ちを。
#fec_kansai #fec_kansai_ookini
🐙おおきにルーム🌾
🕒 10:45〜11:15
池田泰延さん（@clockmaker）によるレギュラートーク
「HTMLを着たCanvas 2D - HTML-in-Canvasで作る未来のWeb UI表現」
がスタートしました！🎤✨
#fec_kansai #fec_kansai_ookini
HTML-in-Canvasの詳しい記事はこちら。
何を解決するのか、注意すべきことは何かを紹介しています。
ics.media/entry/260825/
#fec_kansai #fec_kansai_ookini
HTML-in-Canvasに対応したJSライブラリ
VFX-JS amagi.dev/vfx-js/
Canvas UI canvasui.dev/
Three.js threejs.org/
PixiJS pixijs.com/
#fec_kansai #fec_kansai_ookini
