サンプルサイトーヒーロー編第2回: ヒーローセクション 「ヒーロー」セクションでは、カーテンアニメーションを実装しています。このアニメーションは、ページが読み込まれた際に視覚的なインパクトを与える効果を狙ったものです。 カーテ… 続きを読む →
サンプルサイトーヘッダー編第1回: ヘッダーとナビゲーション4回に分けて部分的に作成して4回目には1枚のLPが完成するようになっています。 模写サンプルサイト elementary001 続きを読む →
サンプルサイトーヒーロー編第2回: ヒーローセクション 「ヒーロー」セクションでは、カーテンアニメーションを実装しています。このアニメーションは、ページが読み込まれた際に視覚的なインパクトを与える効果を狙ったものです。 カーテ… 続きを読む →
サンプルサイトーセクション編第3回: gridセクション 1. グリッドレイアウトの基礎 このページは、CSSのgridプロパティを使ってレイアウトが整えられています。グリッドレイアウトは、行と列を使ってページを分割し、それぞれ… 続きを読む →
Figma模写 #3:音楽系ランディングページをHTML/CSSで再現してみようFigma模写シリーズ第3弾は、アーティストのプロモーションサイトを想定した音楽系ランディングページに挑戦します。 視線を惹きつける大胆なヒーロー画像、ストリーミングサービスの導線、シンプルなフォーム… 続きを読む →