サイト構築
フォント好きは要チェック！ 和文フォントと欧文フォントの混植をブラウザ上で簡単に試すことができる便利サイト -MOBULA
Post on:2026年5月21日
フォントの混植とは、日本語のテキストは和文フォントで、英語のテキストは欧文フォントで表示したり、またよくあるのがひらがなフォントに漢字が揃っているフォントを混植したり、2つのフォントを組み合わせて使用することです。 通常 […]
HTMLの新しい要素「<install>」はJavaScriptなしで、Webアプリのインストールが簡単にできるようになります
Post on:2026年5月20日
安定版のサポートはまだ先ですが、Chrome 148+でフラグを有効にすることで、HTMLの新しい要素「<install>」が利用できるようになっています。 <install>でインストールボタン […]
Web制作者の腕試し！ 指定されたレイアウトをCSS Flexboxで実装するパズルゲーム -flexboxle
Post on:2026年5月19日
flexboxleは、CSS Flexboxをマスターするための毎日楽しめるパズルゲームです。CSS FlexboxのプロパティやTailwind CSSのクラスを使用してHTMLを記述し、目標のレイアウトに合わせて要素 […]
職人技が光る美しいアイコン素材！ CSSの各プロパティや値をデザインしてアイコン化 -Cascade Icons
Post on:2026年5月18日
コードを理解するデザインツール向けに、CSSの各プロパティや値をデザインしてアイコン化したCascade Iconsを紹介します。 display: flex;, display: grid;はもちろん、position […]
TextExpanderの代替にEspansoを使ってみたらかなり良かった！ Mac, Win, Linux対応の無料アプリ -Espanso
Post on:2026年5月14日
これまではmacOSでTextExpander（買い切り版の古いやつ）を使用していたのですが、先日macOSの通知で「macOSの次のバージョンからIntel用アプリが使用できなくなる」と告知をされたので、代替アプリをい […]
これは便利！ ロード時に表示するスケルトンを実際のUIから抽出して自動生成してくれるフレームワーク -Boneyard
Post on:2026年5月13日
Webサイトやスマホアプリのロード時に、実際のUIから抽出したピクセルパーフェクトのスケルトンを自動生成してくれるフレームワークを紹介します。 React, Vue, Angularなどに対応しており、数行のコードを記述 […]
Web制作者は要チェック！ コンテナクエリの進化、動画の遅延読み込みなど、Chrome 148で新しく追加されたCSSの機能
Post on:2026年5月12日
5/6にアップデートされたChrome 148に追加された、CSSとUIに関する新しい機能を紹介します。 今回のアップデートで注目すべきは、コンテナクエリをcontainer-typeを設定しなくてもコンテナ名のみで機能 […]
最小限のHTMLとモダンCSSで実装！ コンテンツをボーダーで囲って、ボーダーの上部にタイトルを配置するテクニック
Post on:2026年4月23日
テキストや画像をボーダーで囲って、ボーダーの上部にタイトルを配置したいと思ったことはありませんか？ 以前はこれをCSSで実装しようとしてもかなりトリッキーな実装でした。またfieldsetとlegendでも実装できますが […]
CSSで実装されたLiquid Glassの美しいUI要素やコンポーネントをコピペで使えるUIキット -Liquid Glass UI Kit
Post on:2026年4月22日
iOSにLiquid Glassが採用されてから早半年が過ぎました。 慣れない当初は使いにくさを感じていましたが、Liquid Glassを採用しているアプリが増え、最近では逆にLiquid Glassを採用していないア […]
AIO: 無料とは思えないほど充実した機能！ あなたのWebサイトがAI検索や生成AIに対応しているかをチェックできる -Is Your Site Agent-Ready?
Post on:2026年4月21日
去年くらいからAIOというワードを目にするようになったと思います。AIOとはAI最適化（AI Optimization）のことで、簡単に説明すると、AI検索や生成AIに信頼されるコンテンツを設計することを意味します。 信 […]
sponsors
