Web制作に役立つ情報一覧

斜め上を行く最新Webオンラインツール、素材50選

2023/10/23(Mon) 08:59

「ほったらかしで、デザインの作成が完了」「配色に悩んだときの救世主」「時間のかかっていたデザイン作業が一瞬で終了」そんな噓のようなツールが、AIの進化によって日々、世界中で公開されています。このまとめでは「これはやられた！」と思わずうなってしまう、最新オンラインツールや素材55個をご紹介。

https://photoshopvip.net/152597

赤色は何種類ある？色見本・カラーコード60選【事例・デザイン素材も】

2023/10/20(Fri) 09:07

赤色は「行動」や「情熱」、「攻撃性」といった意味合いを持つ色です。この記事では、赤色のもつ意味や効果や、40種類の赤色を集めた色見本をHEXカラーコード付きでご紹介します。赤色の効果的な使い方を学ぶ事例や、すぐに使えるデザイン素材と一緒も参考として活用してみましょう。

https://photoshopvip.net/152484

Webサイトやスマホアプリで注目されているUXデザインの知識やテクニックが網羅された解説書 -UXデザイン100の原則

2023/10/16(Mon) 08:56

Webサイトやスマホアプリをデザイン・実装するときに取り組むべきUXデザインにどのように対応していくのか、必要な知識を一通り身につけることができるオススメの解説書を紹介します。

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

たった一行のCSSで複数カードの水平グリッドを簡単に揃えられる！ CSSのサブグリッド（subgrid）の基礎知識と使い方

2023/10/13(Fri) 08:38

CSSのサブグリッド（subgrid）がChrome 117でサポートされ、Safari, Firefoxではすでにサポートされていたので、これで主要ブラウザのすべてで利用できるようになりました。

https://coliss.com/articles/build-websites/operation/css/about-css-subgrid.html

商用でも完全に無料！ レトロで温もりのあるかわいい日本語フリーフォント「しっぽり太ゴシック」「しっぽり太ゴチック」

2023/10/12(Thu) 08:56

「しっぽり明朝」「しっぽりアンチック」など、人気のフリーフォントをリリースされているフォントダスさんから、読みやすくて目に優しい太ゴシック体と太ゴチック体の2つのフリーフォントがリリースされました！

https://coliss.com/articles/freebies/shippori-gothic-and-gochic-b2.html

CSSの新しいプロパティ「form-sizing: content;」が便利！ フォームのサイズを入力された文字量に合わせて自動変更

2023/10/11(Wed) 08:49

今まではJavaScriptを使用しないとできなかったことが、たった1行のCSSで簡単に実装できるようになります。フォームのtextareaに文字を入力すると、その文字量に合わせてサイズを自動で変更するCSSの新しいプロパティを紹介します。

https://coliss.com/articles/build-websites/operation/css/auto-resizing-text-input-with-form-sizing.html

その一手間で、デザインはかなりよくなる！ ロゴのアイデアやテクニックが詳しく解説された良書 -イメージをカタチにするロゴデザイン

2023/10/10(Tue) 09:02

こういうロゴデザインの解説書を待っていた人も少なくないと思います。自分が考えたものをカタチにしたい、クライアントの要望をカタチにしたい、そんなイメージが伝わるロゴの作り方を解説したデザイン書を紹介します。

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

古いリセットCSSからはもう卒業！ モダンブラウザに最適化された新しいリセットCSS -A (more) Modern CSS Reset

2023/10/06(Fri) 08:36

モダンブラウザをターゲットにしたWeb制作では、リセットCSS自体が必要ないかもしれません。とは言っても、設定しておきたいスタイルや一部のブラウザ用に設定しておきたいスタイルがあります。現在のWeb制作に合わせて制作されたリセットCSSを紹介します。なぜそうするのか、なぜそれを使用しないのか、CSSの知見やテクニックも満載です！

https://coliss.com/articles/build-websites/operation/css/a-more-modern-css-reset.html

【商用可】レトロかわいい「ハチドリ」のイラスト素材400枚無料ダウンロード

2023/10/05(Thu) 08:55

鳥類のなかでもっとも小さい「ハチドリ」は、宝石のようにきらめく体をもち、SNSなどで動画がアップされると人気の的です。最小のものはスズメバチと同じ大きさで、高速で羽ばたくことでも知られ、1秒間に何十回も羽ばたきます。

https://photoshopvip.net/151896

知っておくと便利！ CSSだけで要素がスクロールできるかどうかを検出する方法

2023/10/04(Wed) 08:59

CSSだけで要素がスクロールできるかどうかを検出する方法を紹介します。先日紹介したスクロール駆動アニメーション（Scroll-Driven Animations）はスクロール可能なオーバーフローがある場合にのみアクティブになるため、要素がスクロール可能かも検出することができます。

https://coliss.com/articles/build-websites/operation/css/solved-by-css-scroll-driven-animations-detect-if-can-scroll-or-not.html