Web制作に役立つ情報一覧

UIデザインの最近のトレンド、近未来的なかっこいいグラデーションを実装するCSSのテクニック

2021/12/03(Fri) 09:03

近未来的なかっこいい印象を与えるグラデーションを使用した、テキスト・ボタン・背景のスタイルを実装するCSSのテクニックを紹介します。白地のテキストをわずかに輝かせたり、ダークモードに映えるグラデーションでテキストやボタンを目立たせたり、カードに美しいグラデーションの背景を実装したり、少し色味を変えてライトモードに使用してもかっこいいグラデーションです。

https://coliss.com/articles/build-websites/operation/css/css-tricks-dark-futuristic-web3-look.html

新作の日本語フォント「藍と白のゆきぐに」がリリース！ 無料版もあるのが嬉しい、ロゴタイプみたいなかわいいフォント

2021/12/02(Thu) 08:55

「はんなり明朝」「こころ明朝体」「こども丸ゴシック」などのフリーフォント、そして「森と湖の丸明朝」「海と山のろごごち」をリリースしているTyping Artさんから、新作の日本語フォント「藍と白のゆきぐに」がリリースされました！

https://coliss.com/articles/freebies/font-ai-to-shiro-no-yukiguni.html

この実装方法は巧い！ コンテンツが少ない量でもフッタを一番下に配置するCSSのテクニック

2021/12/01(Wed) 08:50

ページのコンテンツが少なくても、フッタを一番下に配置するCSSのテクニックを紹介します。コンテンツが多ければ、成り行きで配置されます。フッタの高さは自由で、CSS GridやFlexboxやcalc()は使用せず、追加のラッパーも必要ありません。シンプルなHTMLに、数行のCSSで簡単に実装できます。

https://coliss.com/articles/build-websites/operation/css/clever-sticky-footer-technique.html

Webデザイナーがペンタブを使って感じた4つのメリット！苦労したことや対策も

2021/11/30(Tue) 08:54

デザイナーのみなさん、PCで作業をするときはマウス派ですか？ トラックパット派ですか？ それともペンタブ派ですか？以前から「イラストはあまり描かないけど、ペンタブを使いこなせたらきっと作業効率上がるんだろうな〜」と思ってはいたものの、なかなか慣れなくって結局マウスに戻るということを繰り返していました。

https://liginc.co.jp/573517

なんとなく色を決めてない？「けっきょく、よはく。」から続くシリーズ待望の第4弾がついに発売！ 配色に着目したデザイン書「いろいろな、いろ。」

2021/11/29(Mon) 08:53

「いろいろな、いろ。」 第4弾となる本書は、配色に着目したデザイン書。デザインですぐに使いたくなる配色のテクニックが満載です！

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

モダンCSSでよく使用されるレイアウトを実装するまとめ

2021/11/26(Fri) 09:03

ヘッダ・フッタ・コンテンツ・サイドバー、フルページのレイアウト、最下部のフッタ、中央配置、カードなど、一般的なWebサイトやスマホアプリのUIをモダンCSSで実装する方法を紹介します。

https://coliss.com/articles/build-websites/operation/css/useful-layouts-using-modern-css.html

テクニカルSEOの監査を行う方法

2021/11/26(Fri) 09:03

SEOにおけるテクニカルな要素は、検索のパフォーマンスにとって非常に重要である。これらを理解し、維持することが、Webサイトのランキング上昇につながり、トラフィックを増加させ、売り上げの向上に寄与するのだ。テクニカルな要素を無視することは、検索結果に表示されなくなるリスクを意味する。

https://www.seojapan.com/blog/how-to-conduct-a-technical-seo-audit

わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ

2021/11/23(Tue) 08:54

この記事では、Webデザイン制作を楽にする最新オンラインツール43個をまとめてご紹介します。コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど、クリエイティブな案件で活用したい新しいツールを揃えています。

https://photoshopvip.net/132219

CSSの難しさが分かるようになった人にお勧めの解説書、さまざまなレイアウトを実装する再利用性を向上させるCSSの設計方法 -Every Layout

2021/11/22(Mon) 08:51

CSSって面白いと思い始めた人、CSSの難しさが分かるようになった人、そしてCSSが大好物な人にお勧めの解説書を紹介します。本書は、CSSの経験を積んでいるデベロッパー向けの解説書です。レスポンシブデザインを実現するレイアウトについて実装だけでなく、設計・管理・考え方について詳しく解説されています。

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

CSSでメディアクエリはもう必要ないかも -メディアクエリなしで実装するテクニックのまとめ

2021/11/19(Fri) 08:52

Webサイトやアプリをレスポンシブ化するためにメディアクエリに頼っているのであれば、CSSの機能を見直して、昔ながらのブレークポイントを新しい流動的なアプローチで実装ができないか検討する時期かもしれません。

https://coliss.com/articles/build-websites/operation/css/media-queries-probably-dont-need.html