あとりえ「パ・そ・ぼ」コーナー ★ Jimdoで作ろう、ステキなページ


トップページの例 B


トップページの例 デザインB

 

トップページに多くの内容を盛り込むデザインです。

本文部分を、縦にカラムで2分割、それぞれを 横に区切っています。

 

この例の特徴

 

・ トップページに、多くの情報を載せるデザイン

   トップページに、サイトの概要と最新情報を載せる例です。

   サイトを訪れた人がこのページだけで、情報を得ることができます。

   上下のスクロールが多くなりますが、クリック移動は少なくてすみます。

 

・ 上部に画像つきメニューを置いたこと。

   Jimdoのテンプレートの左サイドバーのメニューとダブっています。

   Jimdoの別デザイン 上部に横にメニューがあるタイプなら、

    メニュー直下に画像を並べることができるかもしれません。

    まだ、試していませんが・・・。

 

・ カラムで縦割りにした本文それぞれを横に区切ったこと。

   右サイドバーが有るようなデザインです。

   それぞれの部分でカラム幅は調節できません。 

   縦には柔軟なデザインが可能です。

 

・ Jimdoのブログ機能の記事を 下部にピックアップして掲載。

   これは、カラム表示はできませんし、文字サイズなども既定のままです。

 

 

トップページに、多くの情報を載せるデザインのポイントは、

・ トップページだけで、サイトの内容を一覧できること

・ サイトの更新した部分がはっきりわかること

・ 新しい情報は、このページに集約していること

 

Jimdoでは、全ページ共通のサイドバーがありますので、あとの部分を縦2カラムにわけて使います。

 

このデザインでは、左メニューのテンプレートを採用。 

 メニューとサブメニューが左上にまとまっているのが使いやすい。

 更に、上部にイラスト付きのメニューの要望があったので、メインメニューと同じ物を作りました。

 

本文部分は、縦にカラムで2分割、それぞれを 横に区切っています。

 

 


Jimdoで作ってみよう

Jimdoでホームページ(Webサイト)を作ってみましょう!

 

あとりえ「パ・そ・ぼ」で、実習中です。

 

こちらもどうぞ → キュートな野鳥たち

---------------------------------------------------------------

トップページのデザイン

まずは、レイアウトを選びます。

今回の条件は、

・ 左サイドバー

・ メインメニューの下にサブメニューが表示される

・ 2カラム

・ すっきり


人間工学的に言うと、視線はZで移動します。トップ左上にサイトのタイトルを持ってきてオリジナル画像(ロゴ風)にしましょう。

サイドバーは、右か左かは好き好きです。

マウスを右手で持っているので、右のほうが近いし、画面を横切らないのでいいかもしれません。

今回は、試しに左にサイドバーをおいてみました。

ちなみに私のブログでは、右サイドバーが多いですね。

ホームページは、左にメニューがあります。

 

 

 

 

 

これは、すっきり 左サイドバー
色は変更できないらしい。
第一候補です。


メニューの構成

 

メニューの構成は重要です。

 

従来のサイト作成では、ページの配置を変えるとリンクを貼り替える作業が大変でした。

Jimdoのような「CMS」システムでは、それがいとも簡単にできるます。

メニューの前後や上下移動、表示・非表示が簡単に変更でき、即ビジュアルで確認できます。

納得がいくまで、調整しましょう!

消さずに非表示にして置けるので、作業メモを書くページにも使えます。

 


コンテンツ

 

 

コンテンツの例

 

キュートな野鳥たち

 

 

TOPページには、どんなコンテンツを載せればいいでしょうか?

Topページはすっきりしてページのイメージを伝えればいいと考える人もいれば、目次(メニュー)の役割が主のもの、TOPページにすべてをてんこ盛りにして多くの情報を伝えたいと考える人もいます。

 

ただし、TOPページにFlash画像だけ、それもスキップボタン無しは、よくありません。

見る側は、散々待たされた挙句、見たい内容があまりなかったら 2度と来ないでしょう。

映画の公式ページはこのタイプも多いけれど、スキップできるようになっています。

 

主にメニューのページの例

 あとりえ「パ・そ・ぼ」の Webページへようこそ!

トップページの例B
トップページの例B

あとりえ「パ・そ・ぼ」のWebページへようこそ!
あとりえ「パ・そ・ぼ」のWebページへようこそ!



以上では、本文を2カラムに分けて作ってみました。左サイドバーと合わせると 3カラムです。

 

以下は、カラムわけにしていないコンテンツです。

 

Jimdo利用メモ

「はじめてWEB 読も読もキャンペーン」

2017/9/7 「はじめてWEB  読も読もキャンペーン」というメルマガがきました。

 

はじめてWEBメルマガを読んで
あなたの好みにあった
『テーマ別セレクト本』をもらおう

 

どんな本があるのか興味津々。

 

テーマ別セレクト本の内容は、はじめてWEBのエキスパートコラムと連動した6つのテーマでセレクトした書籍全35種類です。
今回、エキスパートコラムと連動したテーマとして、

色、ツール、こころ、写真、ことば、画
を選びました。
趣味・アート・教養から、ホームページ制作に役立つ実用書まで、さまざまなジャンルの本になります。
2017年9月7日(木)10:00~ 最終締め切り 2017年10月25日(水) 23:59

 当選を気をもみながら待つのは嫌なので、面白そうな本をさっそく図書館で借りて読むことにしました。

 ⇒ 「はじめてWEBキャンペーン」   ~ My本棚「pasoboのバインダー」

 

 

商品をAmazon画像で紹介テスト

2017/10/28

今年初めの Jimdoの 仕様変更で、 他ブログの写真はリンク表示できなくなった。

  これはすごく不便で、その後の ページ作成・更新のモチベーション 大幅ダウン。

 

同様に、たくさんのウィジェットが表示されなくなって、2017年初頭は修正作業に膨大なマンパワーを取られた。

その後、Twitterのウィジェットは、コードを差し替えたので表示しています。

 

その時には確認していなかったAmazonの、商品 テキストと画像は 表示するでしょうか?

既に貼り付けているコードは 表示しています。

新しくのリンクコードを以下の コンテンツ(HTML、ウィジェット)に 貼ってみます。


ティモシーとサラ ちいさなとしょかん (えほんとなかよし) 大型本 – 2015/2/10 芭蕉 みどり (著)

新旧のJimdoブログのテスト

 Jimdo のブログの仕様が 変わったとのこと。

 

Jimdoで一番ユニークで便利なのが、従来の「ブログ表示」コンテンツを使ってどこにでも貼れるブログです。

始めてその使い方がわかった時には感激しました。

一般のブログとは全く違う シュールな機能 (*^_^*)♪

タグと組み合わせて フィルタリングしたブログ記事を、ページの好きなところには置くことができる。

それがなくなっちゃうのでしょうか?

ブログ表示を利用されている方へ
「ブログテーマ」 のリリースに伴い、「ブログ表示」コンテンツの提供を終了しました。
すでに「ブログ表示」を利用している場合は、引き続きご利用いただけます。
ただし、[ ブログ ] > [ 基本設定 ] > [ ステータス ] からブログの機能自体を無効にすると、再度ブログを有効にした際には「ブログ表示」コンテンツの追加はできなくなっています。
これまでの「ブログ表示」を引き続き利用されたい場合は、誤ってブログを無効にされないよう十分にご注意ください。なお、ブログの有効・無効にかかわらず、すでに設置済みの「ブログ表示」については削除されません。

 「ブログ表示」コンテンツがなくなる! では同様に使いたい場合はどうすれば?

試しに、すでにある ブログコンテンツをコピペしてみます。 → うまくいきました。

 

Jimdoから届いたメールは以下のとおり

2017/10/24

 新機能:ブログテーマとは?
新機能が続々とリリースしている Jimdo のブログ機能ですが、今月新たに「ブログテーマ」という機能がリリースしました。
ブログテーマとは一体どんな機能なのか?すでにある「ブログカテゴリ」とはどう違うのか?どんな使い方をするのか?など、さまざまな疑問にお答えするため、今回は「ブログテーマ」についてご紹介したいと思います。すでに「ブログテーマ」を利用されている方も、まだ利用されていない方も、この機会にぜひご一読ください。

ログイン方法の変更に対応した

2017/9/5

【重要なお知らせ】Jimdo へのログイン方法が変わりました

というメールが届いたので、

指示通り 新しいアカウントを作成して、

アカウントと既存のホームページを接続した。

以上

 

リンクの修正作業しました

2017/8/30

リンクのページのメンテナンスを行いました。

リンク切れや 別のURLへの移動など、かなりの数を修正。

おかげで 懐かしいサイトを見ることもできました。

 


2017/1/6

flicker のウィジェットは削除しました。



あとりえ「パ・そ・ぼ」コーナー ★ Jimdoで作ろう、ステキなページ