Web制作に役立つ情報一覧

2025年、Web制作者がチェックしておきたいCSSの新機能のまとめ: カスタマイズ可能な新しいコンポーネント編

2025/12/17(Wed) 08:57

今年もCSSの進化が早かった1年でした。一昔前にはJavaScriptや複雑なCSSを使用しないとできなかったことがたった一行、もしくは数行のCSSで簡単に実装できるようになりました。2025年、Web制作者がチェックしておきたいCSSの新機能: カスタマイズ可能な新しいコンポーネント編を紹介します。

https://coliss.com/articles/build-websites/operation/css/css-in-2025-components.html#google_vignette

CSSアンカーポジショニング入門 anchor()・anchor-size()の使い方

2025/12/17(Wed) 08:55

CSS Anchor Positioning（CSSアンカー位置指定）は、要素の位置やサイズを「特定の要素（アンカー）」を基準にコントロールできる仕組みです。その中心となるanchor()関数では位置を、anchor-size()関数ではサイズを相対的に指定できます。主要ブラウザでも対応が進み、2026年中には全モダンブラウザで使用可能になるでしょう。

https://ics.media/entry/251215/

デザインにおいてクライアントからのヒアリングに注目した、これまでになかった実践的な解説書 -デザインはヒアリングからはじまる

2025/12/15(Mon) 08:57

クライアントとのやり取り、チームでのヒアリングが思うようにいかないと悩んでいる人にお勧めの良書を紹介します。私はクライアントとのやり取りやヒアリングは好きな方ですが、本書を読んで「なるほど」と思うことが多々ありました。クライアントとのやり取りがある人は一度目を通しておくことをお勧めします。

https://coliss.com/articles/book-review/isbn-9784839988067.html

2025年、日本語の新作フリーフォントのまとめ！ 今年も新しいフリーフォントがたくさんリリースされました

2025/12/12(Fri) 08:59

2025年もいよいよ年の瀬です、今年リリース・アップデートされたひらがな・カタカナ・漢字が使える日本語の新作フリーフォントを紹介します。漢字も揃った手書きフォントをはじめ、バリアブル、ゴシック、丸ゴシック、明朝、筆文字、ドットフォントなど、今年も盛りだくさんです！

https://coliss.com/articles/freebies/japanese-free-fonts-dec-2025.html

色の美しい世界にときめいて、色の知識も深まる、かわいくて小さな極上本 -誰も知らない色の物語

2025/12/08(Mon) 09:11

さまざまな色が紡ぐ物語、おとぎ話に登場する色、花や草木、宝石などの色、神話や歴史に登場する色、色には色の数だけ物語があります。心が惹かれる150色の物語が収録された、かわいくて小さな本を紹介します。自分へのご褒美として、大切な人へのプレゼントとしてもぴったりな一冊です。

https://coliss.com/articles/book-review/isbn-9784295023319.html

CSSで最近よく使うOKLCHカラーについて理解を深めよう、異なる色でトーンを合わせたり、単色のシェードも簡単

2025/11/28(Fri) 08:51

CSSでは、さまざまなカラーモデルで色を設定できます。16進数によるHEX値、rgb()によるRGB値、hsl()によるHSL値、lab()によるLAB値、oklch()Oklch値、oklab()によるOklab値など、現在ではすべてのブラウザにサポートされています。中でも最近では、トーンを合わせたカラーを簡単に作ることができるOKLCHカラーの人気が高まっています。このOKLCHカラーについて紹介します。

https://coliss.com/articles/build-websites/operation/design/about-oklch-color.html

Photoshop 2026のすごい新機能ガイド AI合成・調和など別次元に進化

2025/11/19(Wed) 08:51

Photoshop 2026 では、これまでの延長線とは少し違う、使い方の前提が変わるアップデートが入りました。一番分かりやすい変化は、AIまわりの機能が整理され、クレジット制が本格的に動き出したことです。ただし複雑に感じる必要はありません。

https://photoshopvip.net/167933

これなら超簡単！ CSSのclamp()によるレスポンシブ対応のフォントサイズを数クリックで定義できるツール -Size Matters

2025/11/14(Fri) 08:56

フォントサイズをレスポンシブ対応にするときに、最近よく使用されている実装方法はclamp()関数による流体タイポグラフィです。CSSのclamp()関数を使用するとフォントサイズの最小値と最大値を定義してその間の値を流動的にすることができ、デバイスのビューポートサイズが増えた現在に欠かせないテクニックです。

https://coliss.com/articles/build-websites/operation/work/fluid-type-scale-generator.html#google_vignette

写真が“化ける”無料Photoshopエフェクト27選【2025秋 最新版】

2025/11/12(Wed) 08:56

スマホで撮影したその写真、フォトショップならだれでも簡単にプロのような仕上がりにできます。それが、Photoshopの無料写真エフェクト素材。画像を放り込むだけで、まるで映画や雑誌の誌面のような世界観をつくることができる便利アイテム。この記事では新作エフェクトを中心に、実施に使い方を試したサンプル付きで27個まとめてご紹介します。

https://photoshopvip.net/167856

商用でも完全に無料！ クレジットも不要、日本人向けの生成AI時代ならではの新しい写真素材サイト -Studio.Stock

2025/11/11(Tue) 08:51

まさに次世代の写真素材サイトがローンチしました！商用でも完全に無料、クレジット表記も不要、生成AIによる日本人のための写真素材で、写真のモデルは日本人、風景も日本風、被写体・構図・光・質感のすべてが「今のデザイン感覚」に合うものが厳選されており、あらゆるクリエイティブ制作で安心して利用できます。

https://coliss.com/articles/freebies/next-generation-stock-photo-site-studiostock.html