2021年、Web制作・デザインに役立つ記事の総まとめ

Post on:2021年12月27日

Web制作全般

Web制作者にとって今年一番の出来事は、IE11のサポートがいよいよ終わろうとしていることです。正式には2022年6月16日がその日ですが、現時点でGoogle検索をはじめさまざまなサイトやサービスでIE11のサポートが終了しています。

6月16日以降はWindows更新プログラムの適用後、IEを起動することはできなくなり、Edgeが起動されるようになります。EdgeのIEモードは、2029年までサポートされる予定。
参考: IE11サポート終了 – 発表に関連する FAQ

2021年版、フロントエンドとバックエンドのデベロッパーに必要なスキルやツールをまとめたロードマップ

レスポンシブ対応のレイアウトを実装する最新テクニックを解説、モバイルファーストとデスクトップファーストの現状

UI/UX関連

2021年総まとめ、UIとUXの印象がよくなるデザインの知識とテクニックのまとめ

デザインに少し手を加え、フォームを改善する実践的なUIのテクニックのまとめ

デザインのテクニック・インスピレーション

2021年、ロゴデザインのトレンド -最近のロゴに使われているデザインテクニックのまとめ

グラデーションの真ん中辺りがグレーにくすむのを避ける方法、美しいグラデーションを作成する方法

Photoshop, XD, Figmaなどの使いこなし術

Adobe恒例のバージョンアップは毎年の楽しみですが、PhotoshopとIllustratorがブラウザで利用できるようになるとは完全に想定外でした。また12月にはオンラインのモバイルデザインアプリAdobe Creative Cloud Express（要登録だけど無料）もリリースされ、さらなる機能強化も予定されています。

新ツールや新機能だけでなく、M1対応で起動が劇的に速くなったり、既存のバグが修正されるなど、今年のバージョンアップはかなりよかったです。

Adobeの新機能「スーパー解像度」がすごすぎる！古い写真画像でも驚くほど美しく拡大できる

webpファイルをPhotoshopで開く・書き出すことができる機能拡張 -WebPShop

フォント・タイポグラフィ

先週の公開からさらに追加、新作フォント90種類以上が追加されています！

2022年用、日本語のフリーフォント573種類のまとめ -商用サイトだけでなく紙や同人誌などの利用も明記

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

カラー

2022年のトレンドカラーはラベンダー「ベリーペリ（Very Peri）」、HTMLのコードは「#6667ab」

HTML

最近の実装に合わせたHTMLテンプレート、基本のコードとすべての要素の役割も解説

CSS: 基礎知識

来年はCSSに大きな変化が起きようとしています。メディアクエリが登場した時のことを覚えている人も多いと思いますが、コンテナクエリが登場します。現在はブラウザのサポートが十分ではありませんが、エバーグリーンブラウザ（最新版に自動アップデートされるブラウザ）によりまもなく利用できるようになると思います。