ホームページビルダー19/クラシック版(サイトのレイアウトを変更)

昨日から今日にかけて、入学式がアチラこちらで行われてます。

小さいお子さんのはじける笑顔。
ちょっぴり学生服が照れくさい中学生の愛らしい笑顔。
将来に向けて頑張るぞ~と燃えてる高校生もステキですよね~。

 

ちょっと前に大学生になった息子の時を思い出してみると

 

「え・・・ちょっと難しいんちゃうん??」
「これ反対?長いほうを・・・・」

「そーじゃないでしょ」
「これを・・・・・ココにとおして・・・」

ネクタイの結び方をネットで検索して・・・・ユーチューブ見ながら練習。

汗だくになったのでした。

しかも入学式の前の晩。

 

 

(お父さんに教えてもらってないんかい!!)と内心ムカつきながら
親子で四苦八苦したのが昨日のようです。

 

 

そんな息子でも半年前からアルバイトで塾の講師をしているらしい。
スーツとネクタイ、革靴を着用が義務つけられているらしく、

今は、チョチョイのチョイでネクタイを結べるようになったらしいです。

 

 

siteid_side_icon_21

 

さて、気を取り直して本題に入ります。
サイトのレイアウトを変更してみましょうね。

デザインチェンジでサイト全体のレイアウトを変更することができます。

フルCSSテンプレートから複数のページのサイトを作っておきます。

hpb19

ページが開いているときは、ビジュアルサイトビューを表示させてきます。
編集画面→ 「デザイン変更」をクリック。

hpb19

 

 

レイアウトを選択

hpb19 

※デザインチェンジすると、リスト項目を変更していたり、画像を編集したものは
初期のテンプレートの状態になるので、気をつけましょう。

 

hpb19 hpb19

 テンプレートによってレイアウト変更タイプの数が変わります。

たとえば・・・

hpb19

1種類しか変更できないものから5種類変更できるテンプレートもあるので
用途やご自身で使いやすいものを選ぶと良いと思います。

 

変更しました。

メニューバーとリンクバナー、インフォメーションの位置が変わりました。
 

hpb19

元の形は、これでした。

2hpb19

ホームページビルダー

「フルCSSテンプレート」がレスポンシブデザインに対応しています。
 ホームページビルダー19は、「WordPress」テンプレートに加えて、今回、「フルCSSテンプレート」もすべてレスポンシブデザインとなっています。
「フルCSSテンプレート」で作成すれば、スマートフォンでの表示も最適化されるので、一度の作業でパソコン向け、スマートフォン向けサイトの開設、更新が可能です。

 教則本オススメ♪

初めてホームページビルダーを買われた方
添付されている本だけではうまく作れなかった方に
ぜひお薦めしたい本です。
とっても丁寧に書かれているし我流で作っていた方も
目からうろこの情報もあるのです。

見やすいホームページにするためのレイアウト

ページの内容をどのように配置するかは、ホームページを作る上で、特に難しいと感じる点だと思います。

http://basicdesign-note.com/easytoread-layout/

こちらのサイトが詳しく書いてあったので
記述しておきます。

要約すると・・・・

  1. レイアウトの意味と目的をまずは知っておこう。
  2. 見やすい配置をする上で考えるべき事
  3. 情報の「整理整頓」の方法と「優先順位」の決め方。
  4. ユーザーの視線をうまく「誘導」する。
  5. よく見られるナビゲーションの位置
  6. 作成するサイトにとって最適なナビゲーションの位置とは?
  7. 情報と情報の「間(ま)」について

    ということです。

関連記事

ホームページ・ビルダー20が10月2日に発売

 ホームページ・ビルダー20が10月2日に発売

hpb20
Pocket

当ブログの記事に共感していただけたら、嬉しいです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です