はじめようWeb制作(初級編)第5回

■メニュー構成の検討

前回まででレイアウトも固まりました。いよいよ本格的に作り込んでいくフェーズです。

まずはメニューの構成を決めましょう。別名、ナビゲーションとも言われ、選択することでページが切り替わります。Jimdoでは最初から左端に「ホーム」があります。これをクリックすると、どのページにいても、トップページ(ホーム)へ戻ることができます。これはWebの定石ですので覚えておいてください。

メニューを設定するには「ナビゲーションの編集」機能を使います。

メニューの付近にマウスを持っていくと、以下のような青い帯が表示されるのでクリックして下さい。この青い帯をうまく表示できるようになりましょう。慣れれば、簡単です。

 

 

「ナビゲーションの編集」により以下のポップアップが表示されます。

メニューの管理は全て、これを使って行います。

新規作成、編集、削除、順番の入れ替え等非常に簡単です。

また、新しいメニューを追加するということは、新規ページを作成することを意味します。

 

具体的な設定作業に入る前に、どのようなメニュー構成にするかあらかじめ考えておきましょう。

特段、決まりはないですが、私が指導する際のパターンをご紹介しますので参考にして下さい。

 

左から「ホーム」、「サービス」(または取扱商品)、「会社概要」、「お問い合わせ」くらいの感じでしょうか? 「サービス」や「商品」のページは複数存在してかまいません。また、当サイトのように階層化することもできます。お店の場合、「会社概要」が「お店の紹介」となります。まずはお店や店主の考えを知って欲しいという場合、先頭「ホーム」の次でも良いです。「お問い合わせ」は一番最後が落ち着くように思います。その前に「ブログ」や他の紹介ページを入れてもかまいません。

 

メニューの数は5~8くらいが適当なように思います。

当サイトではホームを入れて6メニューと少な目ですが、サブメニューを導入して詳細化しています。あまりにメニューが少ないとコンテンツ(内容)の薄いサイト(手抜き間??)という印象を与えます。また、多すぎて2行目にも渡ると、見栄えが悪くなるのと、どのページをみたら良いか混乱させてしまいます。

 

 

それでは早速、新規作成。下部の新規作成ボタンをクリックで下図のように「新規ページ」が追加されます。ここで設定したいメニュー名に編集。続いて、「保存」。たった、これだけです。

 

但し、このままではメニューの一番最後に追加されるので、「ナビゲーションの編集」の右側にある矢印で上下に移動することで並び順の変更が可能となります。また、横方向の矢印で頭を引っ込めることで、上位メニューのサブメニューという扱いになります。お知らせ等、取り消し線になっていますが、これはページとして存在しているがメニューとして扱わないという使い方で、右から2番目の目のアイコンで実現できます。

 

矢印の操作で簡単に移動や階層化が簡単に実現できるのはとても便利だと思います。Jimdoの思想として、このように考えながらブラッシュアップしていけるところが最大のメリットであると思います。

 

今回、サンプルとして「はじめようWeb制作」というメニューを追加しました。2行目の一番最後に存在しています。クリックすると下図のように、できたての真っ新なページに切り替わります。

 

同様の操作でメニューをひととおり、登録しましょう!

先に紹介したプレビューで、スマホの場合、どのように見えるかも確認して下さい。

次回、ページの作り込みの解説へ進みます。

 

Jimdo導入支援のご相談は以下まで

メモ: * は入力必須項目です