ヘルプ 障害情報 登録する

ウェブサイトを1日で完成させる8つの方法

いざウェブサイトを作りはじめると、たくさんの悩みが出てくると思います。

 

どんな色を使おう…… きれいな写真を用意しないと…… など、ひとつひとつの準備に時間がかかったり、細部までこだわってしまってなかなかサイトが完成しない! というかたも多いのではないでしょうか。

 

今回は、ウェブサイトをスピーディーに完成させるための8つのポイントを紹介します。登録してしばらく進められていない、というかたは、すぐに実践してみてくださいね。1日でサイトを完成させてしまいましょう!


1. レイアウトを悩みすぎない

Jimdoのレイアウトは全部で40種類あります。結局どれが使いやすいんだろう? と、作り始める前に悩んでしまうかたもいるかもしれません。Jimdoではブログやサポートセンターでレイアウト選びの参考になる情報をアップしています。何度でも変更できるので、ぜひ参考にしながら選んでみてください。

Jimdo 編集画面 レイアウト選択
管理メニューのデザインから、レイアウトを変更可能

「サイドバーがあるほうがいい」など、はっきりと好みがわかっている場合には、機能で絞って検索ができるJimdoのデザインフィルターがおすすめです。

違いがあまりわからないときには、選びかたを紹介した記事や、世界でいちばん多く使われているレイアウトを紹介したJimdoのレイアウトTOP3 なども参考にしてみてください。

 

あとからレイアウトを変更しても、中身の文章や画像が消えることはありません。プレビューで確認しながら別のレイアウトを試すことができるので、ある程度中身ができてからのほうが、完成のイメージに近いものを選びやすいでしょう。

 

なので最初はあまり悩まず、作成に取りかかってみてください。

<ワンポイント>
Jimdoのレイアウトは、すべてレスポンシブデザインです。デバイスを問わず、最適なデザインに自動調整してくれます。ウェブサイトを作るときには、スマートフォンからの見た目も確認しながら作ってみてくださいね。

2.サイトマップを設計しておく

サイトマップとは目次のこと。サイトにどんなページが必要か、そのページはトップページなのかサブページに置くかなど全体の構成を設計しましょう。まずは紙に書いて整理をするのがおすすめです。

サイトマップ:歯科医院の例
例)サイトマップ・歯科医院の場合
  • サイトマップを設計する
  • 設計したサイトマップをもとにナビゲーションメニューを設定する
  • 各ページの編集をはじめる

この流れでウェブサイトを作ると、途中で何をすればいいのか迷うことなくスムーズに進められます。はじめてWEBの業種別ホームページ作成講座では、歯科医院以外にもレストランや会計事務所を例に、サイトの作りかたを解説をしています。

参考にしてみてください。

(コラム内の画面キャプチャは旧管理メニューの表示となっています、ご了承ください)

3.イメージカラーを決めておく

Jimdoでは背景・ナビゲーション・見出しなど、それぞれにスタイルで色を設定できるので、編集するたびに悩まないよう、ウェブサイト全体のイメージカラーを決めておくと進めやすいでしょう。

 

ですが、色やデザインの知識がないと、どの色が自分の事業に合っているのか、どう組み合わせればきれいかなど、わからないですよね。そんなときは、サンプルのイメージで好みを探したり、プロが書いたコラムを読んでみることをおすすめします。

Design Seeds
Design Seeds

Jimdoおすすめのカラーサンプルサイト & 勉強法

  • ColorHunt (カラーハント)
    まるでインスタグラムのように、ユーザーが作ったカラーパレットを眺めることができます。create のページから自分でパレットを作ってみることもできるので、サイトをどんな色で作るか試すのに最適です。

  • Design Seeds(デザイン シード)
    上の画像のように、写真と、それを構成するカラーパレットの画像を載せているサイトです。ハッシュタグをつけてSNSで投稿したユーザーの写真に、配色をつけて完成させています。新しいインスピレーションが得られそうです!

  • はじめてWEBのエキスパートコラムを読む
    業種別ホームページカラーガイド(連載中)や、自分のホームページに合う色の選びかたなど、色に関する記事がたくさんあるので、ぜひ参考にしてください。

お気に入りの色のカラーコードをメモしておけば、その色をJimdoのサイトに設定することができます。カラーコードとは何か・Jimdoでどのように設定するのかは、ワンポイント講座「カラーパレットを使いこなそう」でご覧ください。

組み合わせに悩んでしまったときは、プロの知識を頼りにしてみましょう。

(コラム内の画面キャプチャは旧管理メニューの表示となっています、ご了承ください)

4. 定型ページを使ってみる

定型ページは、だれでもきれいなページを作れるように、サンプルのコンテンツが配置されたテンプレートです。文章や画像を差し替えるだけでページが完成します。

 

設定した定型ページをベースに、好きなようにコンテンツを移動させたり、削除したりすることもできます。いちから構成を考えたり、バランスに悩む必要もなくなります。これをベースにあなただけのオリジナルのページを作ってみてください。

定型ページを利用する:選択画面
定型ページを利用する:設定後

この定型ページは、ページにコンテンツがなにもない状態のときに使えます。詳しい利用方法はブログをご覧ください。

5.フリー素材サイトできれいな画像をゲットする

写真はウェブサイトの印象を決める、とてもたいせつな要素です。

プロに頼むと高いからとりあえず自分で撮った写真を使う。というかたもいるかもしれませんが、サイズが合っていないと汚く見えてしまいます。そんなときはフリー素材サイトの写真を使ってみましょう。

 

ページに大きく表示される背景画像は特にこだわりましょう。1600 x 1000 ピクセル 以上のきれいな写真を使うことをおすすめします。以下を見ると違いが一目瞭然ですね。

綺麗な画像を使う:良い例
良い例)素材サイトの大きな写真を使用
綺麗な画像を使う:悪い例
悪い例)サイズが合わない写真を使用し伸びている

サポートセンターでは、Jimdoおすすめの 写真素材提供サービスを紹介しています。Jimdoで用意しているストックフォトや、ぱくたそ写真ACのように、好みの写真が検索できる外部のサービスも有効活用し、ウェブサイトのイメージに合うものを選んでください。

<ワンポイント>
各サービスの利用規約を必ず確認し、ご利用ください。また容量の大きな画像を使用するとウェブサイトが遅くなることがあります。TinyPNG ような無料のツールを使って、容量を軽くすることもできます。

6. アイコンを使って完成度をアップ!

一通りサイトができてきたら、もう一歩完成度を高めるために、アイコンを設定してみてください。文字だけよりもユーザーの目に止まりやすいのでサイトの内容が伝わりやすくなりますし、なにより見た目が美しくなります。

 

ショッピングカートのアイコンを見れば、ほとんどのかたがオンラインショップを連想しますよね。このようにユーザーを自然に、「購入」「問合せ」などの行動に導くことができます。

 

選びかた・使うときのポイント・無料で使えるフリー素材のサイトは、こちらのブログで紹介しています。

7.ページコピー機能を使う(有料版のみ)

同じようなページをいくつも作りたい! というときには、ページコピーの機能がおすすめです。一度作ったページをコピーして他のページを作れば、ウェブサイト内の一貫性・統一性も出るうえ、時間も大幅に短縮できます。

ページコピー機能:このページをコピー
コピーしたいページの「このページをコピー」をクリック
ページコピー機能:コピー後
中身も同じ状態のコピーページができます

8.他のJimdoサイトにヒントをもらう

「こんなサイトを作りたい」と頭の中でイメージができていれば、あとは形にしていくだけなので手を動かすのも早くなります。イメージを具体的にするには、お手本を見つけることが近道です。

 

他のユーザーさんの事例を見ることで、Jimdoではどんなサイトを作ることができるのかどんな色や構成が自分好みなのかを知ることができます。日本だけでなく海外のものも含めて、いろんなJimdoサイトからヒントをもらってみてください。

特に、その一年で最も輝くJimdoサイトを表彰するJimdo Best Pagesの受賞サイトは、美しさだけでなくウェブサイトの目的をきちんとはたしているレベルが高いものばかりです。審査員のコメントと合わせて紹介していますので、ぜひ参考にしてみてください。

(ページの下部より、2014 / 2015 の受賞サイトも見ることができます)


ウェブサイトは完成させることがゴールではありません。

こつこつと内容を充実させ、長く運用をしていくことが、検索順位を上げることにもつながります。この記事を参考に、まずは今のウェブサイトを完成させてみてくださいね。



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

コメント: 7
  • #1

    ks (土曜日, 28 1月 2017 17:54)

    文字の書き込み時反応が遅い。例えば「平成29年1月27日」と入力するのに変換する前に「へいせい」で入力が止まることが多々ある。文字削除して再度入力することが多々。

  • #2

    スマイル・フィルム・TN (木曜日, 13 7月 2017 09:59)

    原稿の作成が終了しました。HPに登録する方法が分かりません。ご指導お願いします。

  • #3

    JimdoJapan サポート 若山 (木曜日, 13 7月 2017 10:33)

    スマイル・フィルム・TN 様

    お世話になっております。作成された原稿の内容を Jimdo のホームページに反映させるような状況でございますか? Jimdoでは「原稿」をそのままページにすることはできません。

    Jimdoでのホームページの作成方法について以下のページに流れをまとめておりますのでぜひご覧ください。

    ■はじめて Jimdo をご利用される方へ
    https://jp-help.jimdo.com/jimdo-firststep/

    ■Jimdoワンポイント講座
    https://portal-jp.jimdo.com/study/one-point/

    よろしくお願いいたします。

  • #4

    諸井寿夫 (火曜日, 18 7月 2017 09:30)

    あるページ更新するとホームも更新される。
    ダブって掲載不要で、削除すると一緒に消える
    何故でしょうか。毎回でなく、たまにですが。
    教えてください。

  • #5

    JimdoJapan サポート 若山 (火曜日, 18 7月 2017 12:52)

    諸井寿夫 様 >

    ご連絡いただいた症状は、全ページで共通で表示されるエリアに情報を掲載したことに伴うものであると見受けられます。

    ■Jimdoの画面構成
    https://jp-help.jimdo.com/基本情報/jimdoの基本構造/

    ↑こちらのページにある「サイドバーエリア」に追加したコンテンツは、すべてのページに表示されます。この「サイドバーエリア」以外に記載したものは、そのページでのみ表示されます。一度ご確認をお願いいたします。

  • #6

    吉田成彦 (土曜日, 26 8月 2017 11:01)

    表を作成してますが、保存したら罫線が出ません。入力の文字だけになります。

  • #7

    JimdoJapan サポート 若山 (月曜日, 28 8月 2017 19:48)

    吉田成彦 様

    表の罫線ですが、「罫線のサイズ」と「罫線の色」を設定することができます。「罫線のサイズ」を1以上、「罫線の色」を透過ではなく、背景色とも異なる色に設定をしていただけますでしょうか。もし、それでも罫線が表示されない場合は、お手数ではございますがサポートまでお問い合わせ( https://jp.jimdo.com/support/jimdofree/ )をお願いします。

    ■参考:サポートセンター 表
    https://goo.gl/cBNb9s