グローバルナビゲーションと見出しデザインをカスタマイズ！デザインカスタマイズ機能とは？

当システムは「誰でも簡単に使えるホームページ作成ツール」を目指し、定期的・継続的に機能の追加や改善を行っております。
その中でも今回はレベルアップしたデザインカスタマイズ機能についてご紹介します。

グローバルナビゲーションと見出しのデザインを、思い描くイメージに合わせて自由に調整できるカスタマイズ機能です。
デザインの事例や手順まで解説しますので、ぜひこの機会にデザインカスタマイズ機能をご活用ください。

１．デザインカスタマイズ機能でできること

デザインカスタマイズ機能では、文字の見え方や配色などを細部まで設定でき、ホームページの目的やブランドスタイルに沿った最適なデザインを簡単に制作できます。

• 文字表現が自在に
• カラー表現が自由に
• モバイル表示に最適化

①文字表現が自在に

フォントの種類や大きさ、太さを変えて読みやすさや雰囲気をコントロールできます。

従来はゴシック体のみでしたが、デザインカスタマイズ機能を使えば多種多様なフォントからお好きな種類、大きさ、太さが選べます。

②カラー表現が自由に

世界観やブランドに合う細部にこだわった色表現が可能です。

自社のイメージカラーやブランドカラー、ロゴに使用されている色などを設定することで、ブランドイメージを統一でき「自社らしさ」が表現しやすくなりました。

③モバイル表示に最適化

パソコンサイト／モバイルサイトのそれぞれでデザイン表示設定が可能になりました。

スマホの画面は小さいため、パソコンサイトと同じデザインだと文字が小さく読みづらい場合があります。
個別設定により誤タップ防止・情報の見やすさ改善ができ、ユーザーがサイト内を移動しやすくなります。

２．グローバルナビゲーションをカスタマイズするには？

デザインカスタマイズ機能が使える「グローバルナビゲーション」と「見出しデザイン」はどちらもホームページの”見やすさ”と”使いやすさ”を大きく左右する重要ポイントです。

デザイン調整を行うことで、サイトの印象がぐっと洗練され、ユーザーの回遊率アップにもつながります。

２-１．グローバルナビゲーションとは？

グローバルナビゲーションとは、サイト上部に表示されるメニューのことです。

訪問したユーザーが最初に目にする部分であり、サイト内の主要ページへ案内する”道しるべ”の役割を持っています。

わかりやすく・押しやすいナビゲーションは、情報探索をスムーズにし、結果的にサイト全体の滞在時間を伸ばす効果があります。

２-２．グローバルナビゲーションデザイン例

カスタマイズ機能を使うと、以下のようなデザインに調整できます。

• シンプルでミニマルな横並びメニュー
• ブランドカラーを活かした強調タイプ
• 背景色を敷いて視認性を高めたデザイン

自社サイトの雰囲気や目的に合わせて、最適なスタイルを作り上げることが可能です。

２-３．カスタマイズの手順

では実際に、グローバルナビゲーションのカスタマイズの手順を見ていきましょう。
より詳細な編集方法は、サポートサイトにてご確認いただけます。

参考：サポートサイト｜コンテンツ編集 – グローバルナビ編集｜デザインカスタマイズ機能

１．デザイン設定
グローバルナビ左上メニューの「デザイン設定」メニューをクリックすると、グローバルナビのデザイン設定画面が表示されます。
「カスタム」アイコンのついたデザインを選択します。

※「カスタム」アイコンのついたデザインのみカスタマイズ機能がお使いいただけます。

２．編集
グローバルナビ左上メニューの「グローバルナビ編集」メニューをクリックすると、編集画面が表示されます。
グローバルナビ編集画面で、お好みのデザイン設定を行ってください。

３．見出しをカスタマイズするには？

見出し（大（H2）中（H3）小（H4））は、ページ全体の読みやすさと情報整理に直結する重要なパーツです。
今回追加されたカスタマイズ機能により、デザイン面の自由度が大幅にアップし、より「読んでもらえる」「伝わる」ページ作りがしやすくなりました。

ここでは、見出しの役割とデザイン例、そしてカスタマイズ手順をご紹介します。

３-１．見出しとは？

見出しとは、コンテンツの区切りを示すタイトル部分（大（H2）中（H3）小（H4））のことです。

• ページの構成をわかりやすく整理する
• ユーザーが内容を判別しやすくする
• 文章にメリハリをつけ、読み疲れを防ぐ

といった役割があり、ページの”読みやすさ”を支える重要な要素です。

今回のカスタマイズ機能により、デザインと情報整理の両面からページ品質を高められるようになりました。

３-２．見出しデザイン例

本機能を使うと、以下のようなデザインへ調整できます。

• 太字×シンプルなラインで見やすい定番デザイン
• 背景色で囲って目立たせる強調タイプ
• ブランドカラーをアクセントにした統一デザイン

デザインの方向性を統一することで、ページ全体の印象もぐっと洗練されます。

３-３．カスタマイズの手順

では実際に、見出し（大（H2）中（H3）小（H4））のカスタマイズの手順を見ていきましょう。
より詳細な編集方法は、サポートサイトにてご確認いただけます。

参考：サポートサイト｜コンテンツ編集 – コンテンツ追加｜見出しデザインカスタマイズ機能

１．デザイン設定・カラー編集
見出し左上メニューの「デザイン設定」メニューをクリックすると、 デザイン設定画面が表示されます。
「カスタム」アイコンのついたデザインを選択すると、カラー編集ができるようになります。

※「カスタム」アイコンのついたデザインのみカスタマイズ機能がお使いいただけます。

２．フォント編集
見出しをクリックすると、テキストの色や種類、サイズなどのフォント設定を変更できます。

この編集は、「カスタム」アイコンが付いていない既存の見出しデザインでも変更が可能です。

４．まとめ

今回のカスタマイズ機能を活用することで、

• ブランドイメージに沿ったサイトが作れる
• 訪問者の回遊をサポートできる
• 情報が整理され読みやすいページに仕上がる

といったメリットが得られます。

「もっと見やすいサイトを作りたい」「問い合わせ率を少しでも上げたい」という方は、ぜひ新しいカスタマイズ機能をお試しください。