コーポレートサイトのページコンテンツを複数ページ構成にしました

Nuxt.jsで一年ほど前に実装した頃から1ページ構成だったサイトを複数ページ構成にひとまず変更しました。

目次

メニューの実装

メニューの開閉はフラグで管理、クラスの付与を行う形式で表示/非表示はCSSで行っています。

スマートフォンとパソコン向けに2レイアウトパターンにしているのですが、自分のiPhone12 Pro Maxでは画面サイズが大きくてメニューが1行構成になっています。

Nuxt.js でサイトマップを追加

サーバーサイドレンダリングで構成させているのでSEO対策も必要のため、サイトマップ構築のためにNuxt.js を使った開発環境でsitemap.xmlを追加するためのモジュール(@nuxtjs/sitemap)を追加しました。

参考 :

まだ、検索結果には反映されていないですが、Nuxt.jsで静的ページ構成のサイトを作った時のGoogle検索結果なども気になるので、今後もう少し手厚くやっていきたいと考えています。

今後どうしていくか

各ページともビジュアルが少ないのでトップにイメージ画像を追加したり、何か映える意味のあるコンテンツを追加するなど、もう少し見栄えが出るような何かを思いついたら追加する予定です。