ヘルプ 障害情報 登録する

Webサイト作成に無限の可能性!待望のTokyoレイアウト追加

Jimdoレイアウト追加

Jimdoのレイアウトには、世界各国の都市名が付けられているのをご存知かと思います。その中で、日本のユーザーさんは疑問に思ったことはありませんか?そう、東京がないじゃないかと!

 

日本の首都がこれまでなかったのに大阪のレイアウトがあったのは、Jimdoの本国、ドイツのスタッフの中に大阪へ留学していたメンバーがいたからだそうです。今回、満を持して新しいレイアウト「Tokyo」が追加になりました!

日本人がデザインした日本人向けのレイアウト

Jimdoレイアウトデザイナー Jill Heyer

"TOKYOレイアウトは日本のJimdoExpert として活躍する服部制作室の服部 雄樹さんと、JimdoJapanチームと一緒に作成をしました。全体的にシンプルにまとめたデザインと日本らしい文体を意識したので、今までのレイアウトとは違った雰囲気を出せるものに仕上がったと思います。

Jimdoレイアウトデザイナー — Jill Heyer

JimdoExpert 服部 雄樹さんとJimdoJapanチーム
JimdoExpert 服部 雄樹さんとJimdoJapanチーム

トップページにのみ表示される背景画像

今までJimdoで提供していたレイアウトでは、タイトルの位置も背景画像も全ページ統一のデザインでした。先日の機能変更で各ページに個別の画像を設定できるようになり、利用方法の幅も広がりましたが、Tokyoレイアウトはまた一味違ったデザインになっています。

 

Tokyoレイアウトの最大の特徴のひとつは「背景画像がトップページのみ」(ページ上部)に表示されることです。サブページ(お問い合わせなど)には背景画像が表示されず、ページの上部からすぐにコンテンツを追加できるデザインです。

 

新しく画像を追加してメインの画像として利用したり、画像を追加しないでシンプルな構造でページの中身を見せたり、今まで以上に各ページを自由に編集できます。

ートップページ、他ページ

シンプルなブログ表示

Jimdoでブログを使っている方々の傾向を調べたところ、なるべくシンプルな仕上がりにしたいと思い、ブログの表示ページを他のレイアウトとは違ったデザインにしました。

Tokyoレイアウト ブログ一覧表示
レイアウト:Tokyo
Pragueレイアウト ブログ一覧表示
レイアウト:Prague

一覧で見たとき、タイトルをすっきり表示させることが可能です。ブログ表示で、〔概要の表示数〕を「0」に設定すると、各タイトルが1行で収まるようになっています。

サイトの新着情報一覧などに使いやすい仕様になっていますので、トップページに表示させたい場合も便利です。

ブログ一覧表示 概要の表示数について

シンプルなデザインをぐっと引き締めるサブナビゲーション

TOKYOレイアウトはロゴエリアをページの左上に設置し、その右にナビゲーションを用意しています。とてもシンプルなレイアウトですが、そのシンプルさをぐっと引き立てるのが「サブナビゲーション」。

 

メインナビゲーションエリアの下に引いた帯の上にサブナビゲーションのページが表示されます。ドロップダウンメニューのようにメインナビにマウスを移動しなくても、サブページが常に表示されているのでサイト内にどのようなページがあるかわかりやすく表示されます。

Tokyoレイアウト サブナビゲーション

TOKYOレイアウトを活用するちょっとしたコツ

1. サブナビゲーションの配置変更

TOKYOのサブナビゲーション(2、3階層)のデフォルト設定は右寄りになっていますが、こちらはスタイルから左寄りにも中央にも設定できます。

2. プリセットからお好みのデザインを選択

Tokyoレイアウトは3種類のプリセットがあり、蒼・紅・青緑のカラーを選べます。もちろん、〔スタイル〕からお好きな色を設定することもできます。

3. サイトにさりげなくオリジナリティを加えるロゴ

Tokyoレイアウトはコンテンツエリアが目立つように比較的ロゴエリアを狭くしています。ロゴを設定する時は縦長のものより横長や正方形のロゴをおすすめします。

4. 一行で収まるシンプルなナビゲーション

サイト内にどんなページがあるかわかりやすくするために、ナビゲーションは一行で収まる長さをおすすめします。特にTokyoレイアウトはサブナビゲーションが2行目に表示されるのでトータルでバランスが取れるように意識してください。

Tokyoレイアウトの編集事例

シンプルなだけに、デザインの自由度・可能性は無限です。レイアウト変更後は、「少し寂しいかも…?」と思われるかもしれないですが、そこからのプラスアルファが、Tokyoレイアウトに深みを出していく面白さです。以下に、いくつかの編集事例とサンプルをまとめました。

  • ナビゲーション下のカラーバーを常に表示させたい!
    Tokyoレイアウトでは、上部のカラーバーはサブナビゲーション項目(2.3下層)を設定した際に表示されます。ですが、サブナビゲーションを作らない方もいるはず。そんな方でもカラーバーを表示させられる方法を、弊社神森が紹介しています。詳しくはこちら。
  • 他の方が作ったサイトを見てみたい!
    Benefit  Travel:(提供:JimdoExpert 赤間 公太郎さま)※サンプルサイト
    IT Dr.APOZIRA:(提供:JimdoCafe 武蔵)
    ※他にも、Tokyoレイアウトでホームページを作成された方などいらっしゃいましたら、JimdoJapanでぜひご紹介させてください!

TOKYOレイアウトはシンプルを追求して作られたレイアウトなので使い勝手は抜群です。

 

法律事務所などの士業からサブページが多くなるアパレル、画像を多く見せるポートフォリオでも活用できると思います。「デザインを新しくしたいな〜」と思ってる方は、ぜひこの新しいTokyoレイアウトをお試しください。これからも新しいレイアウトを追加していく予定なのでご期待くださいね!


コメントをお書きください

コメント: 31
  • #1

    プチ・TOKYOもどきなサイト (水曜日, 25 5月 2016 18:30)

    TOKYOは、背景画像とページタイトルに思わず惹きつけられてしまう!、、そんな素敵なレイアウトだと思います。

    今後も日本人向け&日本の都市名が付いたレイアウトの登場に、期待しています!

    P.S.
    5月24日の18時40分頃にログインしたところ、旧レイアウトが選べなくなっていたので、そのことが少し残念です。
    (せっかく、強烈な個性をお持ちのスペシャルレイアウト全てを見ようと楽しみにしていたところでしたので・・。)

  • #2

    masashi kitamura (水曜日, 25 5月 2016 19:55)

    ミニマル、シンプル、フラット。そんな方向性のデザインは大歓迎です!

  • #3

    村井芳裕 (木曜日, 26 5月 2016 05:39)

    今までは、日本の企業(ザックリ過ぎ?)向けのサイトは一工夫必要でしたが、TOKYOのおかげで一気に作りやすくなりました。

  • #4

    JimdoJapan (木曜日, 26 5月 2016 15:54)

    >>プチ・TOKYOもどきなサイトさま

    とても嬉しいお言葉、ありがとうございます!
    ぜひご活用頂き、更に魅力を見つけて行っていただければ幸いです。

    また、旧レイアウトが選べなくなっていたという件ですが、一時的に発生していたもので現在は選択できるようになっております。大変ご迷惑をおかけし申し訳ありません。

    本日、旧レイアウトに関するお知らせをアップしておりますので、最新のお知らせをご確認頂ければ幸いです。

    今後ともよろしくお願いいたします。

  • #5

    JimdoJapan (木曜日, 26 5月 2016 15:57)

    >>masashi kitamura さま

    ありがとうございます!どんなサイトにも使いやすいですし、自由度が高く嬉しいですよね。どんどん活用していただければと思います^^

  • #6

    JimdoJapan (木曜日, 26 5月 2016 15:59)

    >>村井芳裕 さま

    嬉しいコメントありがとうございます!まさに日本人に向けたレイアウトになっています。企業、個人、何にでもご活用くださいませ!

  • #7

    田村 (木曜日, 26 5月 2016 23:16)

    縦文章機能も欲しいものですね。

  • #8

    Fujita Yukihisa (日曜日, 29 5月 2016 21:57)

    新しいレイアウト「Tokyo」は、シンプルで使いやすいですね。
    さっそく、使ってテストしてみてますが、気になった点があります。
    Internet Exolorer バージョン 11.0.31で表示すると、ある、ウィンドウサイズ(横幅をワイドに拡げていくと)の時に、メニューの右端が見切れてしまいます。 ウィンドウサイズによって、メニューに位置を自動に調整してくれる機能のバグ(仕様?)でしょうか。
    同じウィンドウサイズでも、Google Chromeだと見切れないんですがなぜでしょう。

  • #9

    曽根清次 (月曜日, 30 5月 2016 12:43)

    高齢者(60歳以上)の福祉団体で「健康で元気な毎日」をスローガンに活動しています…(^o^)
    ①健康うんどう教室(リンパ体操を含む) ②タブレット交流サロン ③ノルディック&ウォーキング ④デジタル読書会 ⑤清掃活動=チーム新橋SLS48に賛同 等のコミュニケーションづくりに挑戦していますヨ〜〜‼️
    ※年会費:1,000円 ご参加頂ければ幸いです…(^o^)

  • #10

    Jimdoサポート (火曜日, 31 5月 2016 12:20)

    >> Fujita Yukihisaさま

    IE11の件につきましては、お手数をおかけいたしますが、本現象の発生手順などの詳細をお書き添えの上、Jimdoサポートまでお問い合わせをいただきますようお願いいたします。

  • #11

    JimdoJapan (火曜日, 31 5月 2016 17:53)

    >>曽根清次 さま

    平素よりJimdoをご利用いただきありがとうございます。
    そういった活動にJimdoをお役立ていただき幸いです。
    ページの作成で何かお困りのことがありましたら、気軽にサポートページやお問い合わせをご活用くださいませ。

    ・サポートページ(検索してご利用ください)
    http://jp-help.jimdo.com/
    ・お問い合わせ
    http://jp-help.jimdo.com/contact

  • #12

    JimdoJapan (火曜日, 31 5月 2016 17:57)

    >>田村 さま

    貴重なご意見をいただきありがとうございます。
    縦文章、欲しい方も多いかもしれませんね!
    今後のサービス向上に生かしていきたいと思います。

    今後とも、Jimdoをよろしくお願いいたします。

  • #13

    鈴木 (火曜日, 07 6月 2016 09:43)

    tokyoレイアウト いい感じです。

    トップページの背景画像のサイズの大きさを知りたいです。

    よろしくお願いします。

  • #14

    大人のピアノ倶楽部 (木曜日, 09 6月 2016 09:17)

    新しいレイアウトに引っ越す際、の引っ越し方法は何か簡単に出来る方法はありますか? 一から入力しなおすのでしょうか?宜しくご指導お願い致します。

  • #15

    okuikenji (木曜日, 09 6月 2016 14:06)

    すいません
    簡単に引越しする方法を教えてください
    やり方はどうしますか

  • #16

    岡田永治 (木曜日, 09 6月 2016 14:39)

    どうすれば引っ越せるのですか。教えて下さい。

  • #17

    JimdoJapan (木曜日, 09 6月 2016 15:16)

    >> okuikenjiさま,岡田永治さま

    いつもご利用いただきありがとうございます。
    レイアウトの引越し方法についてですね!

    ▼レイアウト移行のマニュアル
    http://jp.jimdo.com/2016/05/31/change-layout/
    詳しくはこちらをご参照ください。

    右側の管理画面の「レイアウト」から、プレビューで試したあと「保存」を押すと決定できます。

    変更自体はこのように簡単にできるのですが、それぞれのレイアウトによってフォントやロゴ位置の設定が異なりますので、引越し後に修正していただいた方が良いかと思います。

    気軽にサポートセンターまでお問い合わせください!
    ▼お問い合わせ先
    http://jp-help.jimdo.com/contact

    何卒、よろしくお願いいたします。

  • #18

    株式会社シンプル東京 (木曜日, 09 6月 2016 19:17)

    旧レイアウトから新レオアウトへの変更を進めていますが、どうすれば良いのかわかりません。つまり、やり方が分からないのです。また、変更途中で内容が壊れたりしたらと思うと、修正できません。セミナーを受けたいと思っても、新規の方限定や、セミナー申し込み時間に申し込もうとしても、1分足らずで満員になり受けられません。ですので、素人向けに詳しい手順(写真入り)を貴社のホームページでお教え下さい。宜しくお願いします。

  • #19

    日髙みさお (木曜日, 09 6月 2016 19:27)

    旧レイアウトから新レイアウトへの変更したいです。
    どうすれば良いのかまったくわかりません。おっしゃっておられることもわかりません。年間契約しているだけでは悔しいです。以前仙台で大原武氏に指導うけました。それからなにも進化できません。セミナーを受けたいと思ってます。どうしたら活用できるようにレクチャーをうけられるのでしょうか?

  • #20

    美容サロン経営者 (金曜日, 10 6月 2016 08:37)

    新レイアウトに美容サロン向けがないので、旧レイアウトを選択しました。今後に期待してますよ。

  • #21

    奥田一恵 (金曜日, 10 6月 2016 14:07)

    新しいjimdoにしたいのですがすぐ登録するが出ていますが、新たにjimdoに名前マスワード登録するのですか。それとも新しいスタイルに置き換え構成を修正するのですか?その時旧jimdoの写真なども使えるのですか?

  • #22

    MIYOKO WALCOTT (土曜日, 11 6月 2016 05:07)

    無料サービスの新レイアウト、TOPPAGE
    のポートフォリオの写真、地名などは自分の好みで変更できますか?

    お返事をお待ちしております。

  • #23

    安田秀敏 (土曜日, 11 6月 2016 17:43)

    旧レイアウトから新レイアウトへの変更を進めたいと思っておりますが、どうすれば良いのかわかりません。
    費用の発生とか、条件があれば教えてください。

  • #24

    原紀雄 (土曜日, 11 6月 2016 21:29)

    旧レイアウトから新レイアウトへの変更を進めたいと思っておりますが、どうすれば良いのかわかりません。
    費用の発生とか、条件があれば教えてください

  • #25

    瀬部 嵐 (日曜日, 12 6月 2016 10:56)

    僕も、Tokyoレイアウトに変更してみました。

    http://arashi0712.jimdo.com
    ↑よかったら見てください。

  • #26

    GIMPresso (日曜日, 12 6月 2016 18:44)

    Jimdoが日本に紹介されたその日に登録した1人です。(実際の運用は少しあと)フリー版使ってるから文句は言えないけど.....
    新レイアウトTOKYOもいいけど、旧レイアウトから新レイアウトに変えるとレイアウトが崩れてしまいます。
    一から作り直しの部分が多いです。特に画像関係のレイアウトが崩れると
    作り直しに時間掛かるから新しいレイアウトに移れない現状があります。
    新しくて機能性は上がっても、旧レイアウトが維持出来なければ実質的に使い物にならない....。まして、一度変更したら元に戻せないなんて言われると旧レイアウトしか選択肢はありません。
    レイアウトの互換性を考えたアップデートをお願いしたい.....。

  • #27

    イワマアキラ (火曜日, 14 6月 2016 10:30)

    やしお市民大学事務局の今年度の課題No1が、HPの全面改訂!先輩が仮に作ってくださったもの・・少人数で更にパソコンに慣れてないシニアのな方ばかりの事務局。大変ですが、今月中にはHPも変えます。
    Jimdoの各サイトを参考に!でも、レイアウトデザイナー — Jill Heyer氏のよう方、欲しい!

  • #28

    北村久美子ちちぶふとり工房和田寿子 (水曜日, 15 6月 2016 09:21)

  • #29

    岩崎隆 (水曜日, 15 6月 2016 21:34)

    不得意な分野(デジタル、IT)も何とか頑張ってついていくだけの63歳男子です。

  • #30

    伊高 絹子 (月曜日, 25 7月 2016 21:16)

    TOKYOは理想的なレイアウトですね。jimdoはホームページ作成初心者でもサクサク使えて、とても助かります(^^)。

    アパレルのデザインのお仕事を作ったばかりのホームページでご案内しています。
    http://www.designer-aid.com/

  • #31

    久兵衛 (火曜日, 22 11月 2016 15:20)

    tokyo レイアウトを使っています。シンプルでとても気に入っています。

    ブログの日付けの位置を変更されましたか?なぜか、今まで右側にあった日付けが左側に表示されるようになりました。(あと、背景色がつきました。)

    今までの右側表示のほうが見やすいと思いますがいかがでしょうか。
    なお、9月までの分は従来どおり右側表示になっています。