無料でウェブサイトを作る方法チュートリアル | Website World

ウェブサイトの作り方

ウェブサイトの作成方法を学ぶ 無料のウェブサイトビルダー数週間ではなく、数時間で!無料のショッピングカートとPOSソフトウェア、Webデザインウィザード、そして内蔵の一括メール送信機能を備えた、隠れたコストのないオールインワンのWebサイトサービスです。

ウェブサイトを作る5つのステップ

弊社でウェブサイトを作成するには、次の 5 つの簡単な手順があります。

  1. 無料トライアルにサインアップ
  2. ページの追加、削除、名前の変更
  3. コンテンツを追加する
  4. ウェブサイトをデザインする
  5. ライブ配信

1. 30日間の無料トライアルにサインアップする

サインアップ 無料トライアルウェブサイト による:


  • サービスや製品をベースにしたビジネス向けに、常に増え続ける既成テンプレートの中から、Webデザインテンプレートを選択します。このテンプレートは後から簡単に変更できます。この例では、デモウェブサイトとして「Minimal ContentBox (100% Wide)」というウェブサイトテンプレートを使用しています。


  • オンラインショップ、サービスプロバイダー、ブロガー、不動産業者など、構築したいウェブサイトの種類を選択してください。これにより、選択した業種に適したページがウェブサイトに自動的に追加されます。この例では、ショッピングカートが組み込まれた「Shop/Retail eCommerce」オプションを選択しています。

  • 無料のウェブサイトトライアルを開始するには、ウェブサイト名と連絡先の詳細を入力してください。

メールアドレスの確認と、ウェブサイトへのログイン方法、そして仮パスワードが記載されたメールが送信されます。ログインすると、新しいウェブサイトを完全に管理できる「ウェルカムダッシュボード」が表示されます。


2. ウェブサイト上のページを追加、削除、または名前変更する

新しいウェブサイトには、選択したテンプレートの種類に応じて異なるページがあらかじめ用意されています。これらのページは、ウェブサイト内で簡単に追加、削除、または名前変更することができます。

  • 新しいページの追加

ウェブサイトに新しいページを追加するには、「ようこそダッシュボード」の左側にある「ページの追加」ボタンをクリックするか、「Web ページ」ボタンをクリックして「ページの追加」を選択します。

次に、追加するページの種類を確認するよう求められます。この例では、「シングルページ(ドラッグ&ドロップ)」オプションを選択します。

次に、メニュー ボタンに表示されるテキスト、ページ見出し、SEO ファイル名など、そのページに関する情報を入力します。

「今すぐ新しいページを追加!」ボタンをクリックすると、新しいページに移動します。また、画面左側のメニュー表示とウェブサイトのメニューバーにも自動的に追加されます。

  1. SEOの観点から、ウェブサイトからページを完全に削除することは推奨されません。代わりに、ページの表示設定を変更して、検索や閲覧をブロックし、メニューから削除してください。削除する必要がある場合は、必ずURLを実際のページにリダイレクトしてください。
ただし、現在ウェブサイトは試験運用中なので、ページを削除しても問題ありません。削除するには、「ウェブページ」ボタンをクリックします。すると、サイトマップページが開き、現在のページがすべて表示されます。この例では、「購読」ページを削除します。まず、隣にある歯車アイコン(赤い矢印)をクリックします。

すると、このページに関するオプション画面が開きます。「このページを削除」ボタンを選択してください。警告メッセージが表示されます。「今すぐページを削除」ボタンをクリックし、画面の隅にある「X」をクリックして画面を閉じてください。

  • ページ名の変更も、Webページのサイトマップページから行うことができます。「Webページ」ボタンをクリックし、今回は「ショッピング」ページの歯車アイコンを選択します。編集する部分は、ボタンテキスト、ページ見出し、SEOファイル名です。ウェブサイトが公開された後は、SEOファイル名を変更しないでください。変更するとウェブサイト上のリンクが壊れ、検索エンジンは新しいファイル名を新しいページと認識します。その結果、そのページが持っていたSEOのメリットは失われます。ただし、サイトがまだトライアルモードであれば、ペナルティなしでファイル名を変更できます。

ウェブサイトに加えた変更を保存するには、緑色の「公開」ボタンをクリックしてください。このボタンをクリックしただけではサイトは公開されませんが、変更内容がトライアルサイトに保存されます。

3 - ウェブサイトにコンテンツを追加する

ウェブサイトに追加できるコンテンツには、テキストとグラフィック/写真の 2 種類があります。

  • ページにページタイトル、サブ見出し、段落テキストを追加する

ページを編集してタイトル、見出し、段落テキストを追加するには、画面左側の「Webページ」タブでページ名をクリックします。すると、編集するページが開きます。この例では、Innova Studioのドラッグ&ドロップエディターを使用して、以下に示すように「会社概要」ページを編集します。

「会社概要」ページが開いているので、サブ見出しと段落テキストを追加できます。これは、デフォルトでページ中央にある段落テキストボックス内をクリックするか、右側の列から必要なテキストの種類を含むスニペットを選択することで行うことができます。

既存の段落スニペットボックスにテキストを追加し、その上にある見出しH2スニペットボックスをクリックしてドラッグしました。そして、この画像のように、見出しスニペットにタイトルを追加しました。

ページタイトル、つまり見出し1(h1)を変更するには2つの方法があります。1つ目は、ページ名を変更する前の手順の指示に従うことです。2つ目は、青いメニューから「SEO」タブを開き、「ウェブページのメタタグを最適化」を選択することです。

すると、ページ タイトル (ページ見出し) を含む SEO メタ タグを編集できるページが開きます。

  • ウェブページに画像をアップロードして追加する
既存のテキストブロックに画像を挿入するには、画像を挿入したい場所にカーソルを置き(赤い矢印)、編集バーの「+」記号(紫色の矢印)をクリックします。 - カーソルをテキストの横に置くと、テキストの位置が変わりますのでご注意ください。テキストの横に画像を配置したい場合は、スニペットボックスを使用することをお勧めします。 - 挿入する内容(画像、リンク、フォームフィールド)を選択するボックスが開くので、「画像の挿入」を選択します。デバイスから画像をアップロードするには、「参照」ボタンをクリックしてデバイス上の画像ファイルを開き、画像(JPEGファイルが最適です)をダブルクリックして、青い「アップロード」ボタンをクリックします。

CMSの画像ウィザードが開き、必要に応じて編集できる状態になります。画像の現在のサイズ、既存のファイル名、切り取り、回転、サイズ変更、JPGへの変換などのオプションが表示されます。この画像を「会社概要」ページに収まるようにサイズ変更します。「サイズ変更」ボックスのドロップダウン矢印をクリックし、画像サイズとして「448x448」を選択します。必要に応じてファイル名を変更し、「変更を保存」をクリックします。

別のボックスが開き、画像の位置、枠線、画像の周囲のパディングなど、画像の編集オプションを選択できます。この例では、デフォルトの枠線、配置、パディングを選択し、青い「今すぐ写真を挿入」ボタンをクリックします。

画面右側にあるドラッグ&ドロップウィジェットを使って、画像または画像とテキストブロックをページに追加することもできます。利用可能なオプションから最適な画像の種類を選択し、ページ上の希望の場所にドラッグ&ドロップしてください。画像にマウスを合わせて「画像を変更」アイコンをクリックしてください。

最適なオプションを使用して画像を選択してください。

  • 以前にアップロードした既存の画像を使用する
  • デバイスから画像ファイルを選択してください
  • デバイスから画像ファイルをドラッグアンドドロップします
  • すでにウェブサイトにある画像の画像場所の URL を貼り付けて画像をインポートします

4. ウェブサイトをデザインする

当社のDIYウェブサイトビルダーを使えば、ウェブサイトのデザインは素早く簡単に行えます。フォントサイズ、色、書体、そしてウェブサイトのメインカラーを変更する方法をご紹介します。
  • フォントの種類とサイズを変更する

フォントの種類とサイズの変更は、ウェブサイト全体の場合はメニューの「デザイン」オプション、個々のページの場合は各ページの「カラーとフォント」オプションから行うことができます。まずはウェブサイト全体のフォントについて見ていきましょう。「デザイン」メニューから「カラーとフォント」を選択してください。

ページを下にスクロールして、「フォント」ボックスのオプションを表示します。ここで、標準フォント、見出しフォント、フォントサイズ、行の高さを編集できます。

  • 特定のウェブサイトページのフォントを変更する

フォントを変更したいテキストをハイライト表示し、編集ツールバーの「フォントファミリー」ボックスの横にあるドロップダウン矢印をクリックします。現在使用しているTinyMCE3510以外のエディタを使用している場合は、表示が異なりますのでご注意ください(右上に現在のエディタ名が表示され、新しいエディタモードに切り替えることができます)。

ご希望のフォントを選択すると、ハイライト表示されたテキストのみがそのフォントに変更されますが、ページの他の部分は変更されません。サイズを変更するには、特定のテキストを再度ハイライト表示し、「フォントサイズ」の横にあるドロップダウン矢印をクリックして、ご希望のサイズ(pt)オプションを選択してください。

  • ウェブサイトの全体的な色を変更する

ウェブサイト全体の色を変更するには、「デザイン」タブを開き、「色とフォント」オプションを選択します。「デザインオプション」ページでは、ウェブサイト上の様々なエリアの色を編集できます。

色には16進コードまたは色番号が割り当てられているため、例えば単に「濃い青」という表現よりも具体的な色を指定できます。色を変更したい項目の横にあるボックスに16進コードを入力し、別のボックスをクリックして保存できます。または、「色を選択」ボタンをクリックし、カラーウィザードから手動で色を選択して「色を使用」ボタンを選択することもできます。

私たちが使用することを選択した色は次のとおりです。


「変更を保存」ボタンをクリックし、「公開」ボタンをクリックして作業を保存します。

  • 個々のWebページのテキスト色を変更する

見出しをハイライトし、「テキストの色」アイコンの横にあるドロップダウンボックスを選択します。すると、あらかじめ選択された色の一覧が表示され、そこから選択できます。また、「その他の色」オプションをクリックすると、他の色を選択することもできます。

「変更を保存」ボタンをクリックし、「公開」ボタンをクリックして、これまでの作業を保存します。

5 - ウェブサイトを公開する

ウェブサイトが公開されたら、新商品、コンテンツ、画像などを追加し続けることができます。ウェブサイトは生き物のように、変化し成長していくものです。唯一注意すべき点は、商品やページを削除することです。削除した商品はサイト上に残し、在庫切れにして非表示にしておくことをお勧めします。


ウェブサイトを公開するには、「公開」ボタンをクリックし、ドメイン名を割り当て、最初の月のウェブホスティング料金を前払いしてください。毎月の自動支払いを設定することをお勧めします。割引を受けるには、1年分を前払いで購入してください。

もしあなたが ドメイン名 取得は簡単です。青い「ドメイン/メール」ボタンをクリックし、「新しいドメインを検索して登録」オプションを選択してください。すると、選択したドメイン名を入力できるページに移動し、空いていれば購入することができます。購入されたドメイン名はアカウントに追加され、新しいウェブサイトに割り当てることができます。

Website Worldのチームがお手伝いいたします!ぜひ当社の トレーニングとチュートリアル ウェブサイトの作成と管理に関する無料のサポートをご利用いただけます。 当社がホストするウェブサイトは超高速です あまりにも!