あとりえ「パ・そ・ぼ」コーナー ★ 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利用メモ

8月の風物詩と花暦

  

  2018年 8月

  暑中お見舞い 申し上げます

 

  7/7~8/7~8/31 暑中・残暑見舞い

  スイカの画像 

 

  平成28年 『富岡八幡宮例大祭
 2008年の様子を どうぞ!

 ⇒ MyHPより

 2017 年 花火大会予定
 これまでの様子を どうぞ!

 ⇒ Myブログ:花火大会

 



8/19は、『あとりえ「パ・そ・ぼ」コーナー』の誕生日です。

→ 2012/8/19 Jimdoサイト作成開始

 

今月のテーマ ~ オリジナルTシャツを作ろう

自分で撮ったお気に入りの写真やイラストで、
オリジナルのTシャツやMyグッズを作りましょう!
 
 夏の陽射しに すてきだね! 

8月の花暦 デュランタ  8月です!


7月の風物詩と花暦



7月のテーマ ~ 暑中見舞いを作りましょう。

 
オリジナルの暑中見舞いを 作りましょう!
 
住所録から 宛名面を!
文面はデジカメ写真やイラスト使って、アイデアが勝負 

 

7月の花暦 カリブラコア 7月です!


6月の風物詩と花暦

  

  2018年 6月

   

  梅雨

  虫歯予防

  時の記念日

  

 

 



 

6月のテーマ ~ 動画を撮ってみんなに見せよう


動画は今一番人気! 見るだけでなく 撮ったらみんなに見せたいね!
ビデオカメラ、デジカメ、そしてスマホから簡単に、UPできます。
お手軽なのは、YouTube、さっそくやってみました。

 ⇒ MyYouTube ~ koishi0904 さんのチャンネル
専用ソフトで、きれいな映像のムービーアルバムを作ろう
 ⇒ プチ・ムーバム ・ Myブログのムービー

 

6月の花暦 ベロニカグレース 6月です!


5月の風物詩と花暦

  

  2018年 5月

 

  子供の日

  母の日

  五月晴れ

  

 



5月のテーマ ~ デジカメもっと上手に! Myフォトアルバムへ

どんどん高機能で使いやすくなる デジカメ! 撮ったままになっていませんか?

メールで送ったり、Webアルバム・SNS・ブログなど、
 いろんなところでみんなに見せて 楽しみましょう!

 

5月の花暦 カラー  5月です!


Jimdoサイトをリニューアル

2018/4/7

4/5に思いついて、このサイト あとりえ「パ・そ・ぼ」コーナーを リニューアルしています。

 

あとりえ「パ・そ・ぼ」には、

 目次風の Yahoo!geocitiesのサイト『あとりえ「パ・そ・ぼ」の Webページへようこそ!』

 メインの @Niftyのサイト 『あとりえ「」へようこそ』

があります。

どちらも、改良を加えながら長く使ってきましたが、

内容やレイアウトは パソコン画面で見るように作っていますので、

最近のスマートフォンでの閲覧にはむいてない個所もでてきました。

また、Flashのサポートが終了したため、Flashページは他の方法に変更する必要もあります。

 

  ここらで心機一転 リニューアルをしてみます。

   目次風ページを、Yahoo!から あとりえ「パ・そ・ぼ」コーナー(Jimdo)に変更です!

 

従来のページは そのまま継続の予定ですが、一部改良します。

 

今回のリニューアルに伴い、他のブロブやSNSなどの、リンクの修正が必要になります。

 たくさんある~~。 がんばります。(*^_^*)♪

 

    ~ ~ ~ ~ ☆ ~ ~ ~ ~ ☆ ~ ~ ~ ~

 

4/7 

・ フッター 基本設定で、「http://pasobo.a.la9.jp/」に変更

・ ページ追加(外部サイトへ直接リンクは、利用不可)

   あとりえ「パ・そ・ぼ」サイトへ

   Myブログたち最新記事

 

4/6 作業開始、「ホーム」をリニューアル

・ 内容をほぼそっくり、ここの「ホーム」にコピーし整形した。

・ メニューの表をカラムにしてみた。

・ 固定部分と 毎月差し替える部分を切り離して作成。

・ カレンダー画像の表示をJimdoのコンテンツを利用するようにやり直した。

 

4/5 準備と計画

 急に思いついて、このサイトを リニューアルすることにしました。

 これまで長年利用してきた Yahoo!サイトは、気に入っていましたが

  数年前から CM表示が2カ所に増えた。

  レイアウトがスマートフォンでは見づらい。

 何とかしなければ!

 内容をほぼそっくり、ここの「ホーム」にコピーし整形しました。

 

 また、メインサイト(@Nifty)も、改良を加えながら長く使っています。

 昨年 Flashがサポートされなくなりました。

 多くの人は、わざわざブラウザの設定変更してまでは閲覧しないでしょう。

 画像のギャラリーは、HTML5とJavaScriptなどで、作り替えてもいいのですが、

 Jimdoサイトで お手軽リニューアルしようと思います。

 



2017/1/6

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



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