雀荘のランディングページを作ってみた

HTMLとCSSだけで簡単なWebページを作ってみました。

• 架空の雀荘のランディングページです。
• HTMLとCSSで作った静的ページです。

実際につくったWebページはこちら：東金の雀荘こしあん

必要な技術

必要な技術を一覧にまとめました。

• ヘッダーの固定
• navメニューの横並び
• 画像を丸く切り抜く
• グーグルマップの埋め込み
• タップすると電話をかけるリンク
• CSSで改行する
• レスポンシブ化

意識したこと

• HTMLタグを適切に使用する（header、main、footer）
• スタイル、配置がうまくいかない時は、一度「background-color」で要素に色をつけてテストする。
• わからないことはひたすらググる。

まとめ

Progateを終えたら「シンプルなWebページをマネして作ってみる」と力がついていきます。最初から覚えようとせず、マネからやってみるといいと思います。よければ参考にしてみてください。

架空の雀荘サイト