過去にCSSアニメーションで作った、楽しげなトランジションアイデア集です。
よければ見ていただけたら嬉しいです。
https://t.co/aS6LXsU9di https://t.co/FButOms5nH December 12, 2025

Figmaデザインで英語の大文字禁止って本当？
検証してみた

「Figmaでは直接大文字を入力せず、CSSの text-transform: uppercase; に対応するため、小文字入力して設定で大文字に見せるべき！」とよく聞きます。

僕もポストしたことがありますし、同様の記事をよく見ます。

理由は「スクリーンリーダーが正しく読み上げないから」です。でも、これって本当？

いま、Web制作におけるデザインデータの「それダメ！」を集めています。適当なことは書けないなと思い自分のバージョンアップも含めて検証しました。

検証結果...完璧ではない！

検証1：「LINE WORKS」
→「ラインワークス」…読めるじゃん！

検証2：「ABOUT US」
→「アバウト ユーエス」…おしい！

Chromeのリーディングモードで確認しただけですが、すべての英単語が正しく読まれるわけではないと判明。

完全アウトではないけど、安全とは言い切れないというのが実感でした。

参考情報
ウェブアクセシビリティ支援の専門企業 BOIA の2024年5月の記事では、「一部の古いスクリーンリーダーやTTS（テキスト読み上げソフト）では、大文字を1文字ずつ読み上げる場合がある」とのこと。

個人的な結論
・Figmaでは大文字を直接入力しない
・CSSで見た目を大文字に変更が安全

つまり、前ほど気を配る必要はないが、安全のためにFimgaデザインデータも直接入力せず、基本設定画面の「大文字と小文字の設定」から大文字し、CSS側も「text-transform: uppercase;」を使いましょう。

...が、2025年12月段階であくまで個人的な正解なのかなと感じました。

※あくまでデザインデータとCSSの管理の話です。アクセシビリティ的に「大文字が良い／悪い」という話ではないです。 December 12, 2025

学校で学ぶ機会がちょこちょこあったので、最近個人的にhtmlを勉強してみてるのですが、楽しい　cssが思った通りに反映してくれてると嬉しいな December 12, 2025

学校で学ぶ機会がちょこちょこあったので、最近個人的にhtmlを勉強してみてるのですが、楽しい　cssが思った通りに反映してくれてると嬉しくなるな December 12, 2025

新しい技術を学びたいあなたに！✨

次世代セレクタや コンテナクエリ、
スクロールアニメーションなど、
最新のCSSをフル活用した
インタラクティブなUI制作を
実践的に学べます！

今すぐチェック👇
https://t.co/IrDy3EI767 December 12, 2025

CSS小技✨
transition: all は危険🤔
background も border も勝手にヌルッと動く。
動画の左は全部アニメ、右は transform だけ動いて
他は instant💻
この差を知らないとUIが崩れることも😟
実務は transform / opacity の個別指定が安全👍

#CSS #Codejump https://t.co/BkrxUey5iZ December 12, 2025

@NANADESIGN_777 ええありがとうございます😭全然デザイン上げてないのでそのうち上げたい…!と思ってます💪🎀
WordPressでもCSSとかカスタムできますもんね🥲✨コーディングなら任せてください笑！
オフ会行くのでもしお話しできたらこちらこそよろしくお願いします(⸝⸝⍢⸝⸝) December 12, 2025