CSS Flexboxを使ったヘッダーの作り方を解説した記事です。
Flexboxを使えばロゴとナビゲーションが横並びになったヘッダーを作るのは簡単ですが、さらに別の要素が加わった場合や並び順を変えたい場合などのコーディング例も紹介しています。
この記事の作者がgithubに公開しているheaders.cssの紹介もありました。たくさんのバリエーションのシンプルでレスポンシブなヘッダーが用意されていて役立ちそうです。
図1 CSS Flexboxを使ったヘッダーの作り方
https://medium.com/sketch-app-sources/website-animation-types-trends-that-will-dominate-your-screen-in-2020-2021-292cad930eed
ウェブサイトに使われるアニメーションの種類とトレンドをまとめた記事です。
背景アニメーション
動くロゴ
液体の動き
動くタイポグラフィー
読み込み中のアニメーション
ホバー効果
アニメーションするギャラリー＆スライドショー
図2 ウェブ上のアニメーションの種類とトレンド
https://css-tricks.com/comparing-browsers-for-responsive-design/
レスポンシブデザインのための、複数画面サイズでの表示チェックツールをまとめています。
インストールして使うデスクトップアプリもありますし、ブラウザ上で動くもの、ブラウザ拡張機能もあります。