SEOとは
検索結果で上位に表示させるための集客方法の１つです。SEO設定はサイポンでできる設定項目ですが、SEO対策はコンテンツ制作者が行うものになります。
※SEOに関しては弊社にてサポートはしておりませんのでご了承ください。

SEO設定をするには

1. 「このサイトを開く」をクリック。
   
   
2. 「SEO設定」をクリック。
   
   
3. 必要事項を入力。
   ※設定項目の詳細はこちら
   

    

4. 「保存する」をクリック。
5. 以上が、SEOの設定手順です。

SEO設定項目の詳細

ページタイトル

ページタイトルはブラウザのタブに、「ページタイトル/サイトタイトル」の順番で
表示されます。

また、共通ヘッダーを入れた場合に表示される名前になります。

ページURL

URLの一番最後に表示されます。

description

keywords

検索エンジンに掲載

テキストを縦書きにするには

1. テキストパーツをクリック。
2. 「方向」ボタンをクリック。
   
3. 「縦書き」をクリック。
   
4. 「OK」で確定。
5. 以上が、テキストを縦書きにする手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

テキストを横書きにするには

1. テキストパーツをクリック。
2. 「方向」ボタンをクリック。
   
3. 「横書き」をクリック。
   
4. 「OK」で確定。
5. 以上が、テキストを横書きにする手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

画像を設定するには

ファイルをアップロードして設定

1. 画像をクリック。
2. 「画像」をクリック。
3. 「ファイル」をクリック。
4. 画像ファイルをドラッグ。
   画像の場所を参照する場合は、「画像を参照」から参照してください。
5. 「OK」をクリック。
6. 以上が、ファイルをアップロードして画像を設定する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

使用中の画像を設定

1. 画像をクリック。
2. 「画像」をクリック。
3. 「使用中」をクリック。
4. 「このページで使用中」をクリック。
5. ドロップダウンよりページを選択。
   他のサイトのページも、ドロップダウンから選択することができます。
6. 画像を選択。
7. 「OK」で確定。
8. 「OK」をクリック。
9. 以上が、使用中の画像を設定する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

フリー素材から設定

1. 画像をクリック。
2. 「画像」をクリック。
3. 「フリー素材」をクリック。
4. 「写真」をクリック。
   「イラスト」「シルエット」についても設定方法は同様です。
5. 「カテゴリ」を選択。
   一覧から探すことも可能ですが、キーワード検索で絞り込みをしたほうがより早く画像を
   見つけることができます。
6. 「キーワード」を入力。
   複数のキーワードの場合は「子ども　勉強」など、スペースで区切ってください。
7. 「探す」をクリック。
8. 画像を選択。
9. 「OK」で確定。
10. 「OK」をクリック。
11. 以上が、フリー素材から画像を設定する手順です。
    公開サイトへ反映するには「サイト更新」をクリックしてください。

画像の拡大表示

・公開画面で、画像を拡大表示することができます。
・公開画面で画像を選択し、表示された画像をクリックすると更に拡大されます。
・拡大表示画面を閉じる場合は、画像の外側をクリックしてください。

1. 画像をクリック。
2. 「クリック」をクリック。
3. 「拡大」をクリック。
4. 「OK」をクリック。
5. 以上が、公開画面で画像を拡大表示する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

設定した画像をもとの画像に戻したい場合

「戻す」ボタンを使う

もとの画像を保存しておく

1. 保存しておきたい画像をクリック。
2. 「画像」をクリック。
3. プレビューをクリック。
4. 画面中央に表示されたプレビュー画像をデスクトップにドラッグ。
   フォルダを作成して、その中へドラッグすることもできます。
5. デスクトップに保存。
   このあとはフォルダにまとめるなどして保管してください。
6. 以上が、もと画像を保存しておく手順です。
   保存した画像を使用する場合はこちら → 「ファイルをアップロードして設定」
   公開サイトへ反映するには「サイト更新」をクリックしてください。

ALT属性について

ALT属性とは

Googleなどの検索エンジンは、見た目で画像の中身を判断することができないため、画像の中身を
説明するテキストが必要です。

その検索エンジンに認識されやすくするために入れるテキストのことをALT属性といいます。

ALT属性のメリット

・画像が表示されない場合はテキストで表示されます。

・視覚障がい者の方が、スクリーンリーダーや音声ブラウザを利用した際に読み上げられます。

・SEO効果も期待できます。

ALT属性設定の注意点

画像の情報と一致しない不自然なキーワードが入っていると、迷惑行為と見なされる場合がありますのでご注意ください。

ALT属性の設定

1. 画像をクリック。
2. 「ALT属性」をクリック。
3. テキストを入力。
   画像と無関係なテキストを入れると、迷惑行為とみなされる場合があるため入れないようにしてください。
4. 「OK」で確定。
5. 以上が、ALT属性の設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

ALT属性の解除

1. ALT属性が設定されている画像をクリック。
2. 「ALT属性 設定済」をクリック。
3. テキストを削除。
4. 「OK」で確定。
5. 以上が、ALT属性の解除手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

色調補正

1. 画像をクリック。
2. 「画像」をクリック。
3. 「色調補正」をクリック。
4. 設定を調整。
   上のプレビュー画面で設定結果の確認ができます。
5. 「保存」をクリック。
6. 「OK」で確定。
7. 以上が、色調補正の設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

色調補正の解除

1. 色調補正を解除したい画像をクリック。
2. 「画像」をクリック。
3. 「色調補正」をクリック。
4. 「リセット」をクリック。
   
5. 「保存」をクリック。
6. 「OK」で確定。
7. 以上が、色調補正設定を解除する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

切り抜き

1. 画像をクリック。
2. 「画像」をクリック。
3. 「切り抜き」をクリック。
4. 縦横比を選択。
   
5. ドラッグでサイズを調整。
   青い点にマウスを合わせてドラッグすることで大きさを変えることができます。
6. ドラッグで位置を調整。
   十字のマウスポインタがでたら、ドラッグで枠を移動することができます。
7. 「切り抜く」をクリック。
8. 「OK」で確定。
9. 以上が、切り抜き設定の手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

切り抜きの解除

1. 切り抜きを解除したい画像をクリック。
2. 「画像」をクリック。
3. 「切り抜き」をクリック。
4. 「原寸大」をクリック。
5. 「OK」で確定。
6. 以上が、切り抜き設定を解除する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

塗り潰し

イラスト画像の塗り潰し

1. 画像パーツをクリック。
   
2. 「画像」をクリック。
   
3. 「塗り潰し」をクリック。
   
4. 色を選択。
   

   詳細設定についてはこちらをご参照ください → 「詳細設定をする」

   

5. 「保存」をクリック。
   
   この段階で「リセット」ボタンをクリックし「保存」をすると、元の画像へ戻すことが
   できます。
6. 「OK」で確定。
   
7. 以上が、イラスト画像の塗り潰し手順です。

シルエット画像のカラー変更

1. 画像パーツをクリック。
   
2. 「画像」をクリック。
   
3. 「塗り潰し」をクリック。
   
4. 色を選択。
   

   詳細設定についてはこちらをご参照ください → 「詳細設定をする」

   

5. 「保存」をクリック。
   
   この段階で「リセット」ボタンをクリックし「保存」をすると、元の色へ戻すことが
   できます。
6. 「OK」で確定。
   
7. 以上が、シルエット画像のカラーを変更する手順です。

シルエット画像の透過方法

1. 画像パーツをクリック。
   
2. 「画像」をクリック。
   
3. 「塗り潰し」をクリック。
   
4. 「詳細設定」をクリック。
   
5. 「透明度」のレバーを調整。
   
6. 「保存」をクリック。
   
   この段階で「リセット」ボタンをクリックし「保存」をすると、元の状態へ戻すことが
   できます。
7. 「OK」で確定。
   
8. 以上が、シルエット画像の透過方法です。

表示・非表示の切り替わり方

セクション一覧を表示させるには

コンテナ一覧を表示させるには

コンテナがうまく選択できない場合

◆「コンテナを選択」矢印で選択

1. 選択したいコンテナの中にあるパーツをクリック。
2. 「コンテナを選択」矢印をクリック。
3. 以上が、「コンテナを選択」矢印で選択する方法です。

◆「コンテナ」タブで選択

1. 選択したいコンテナの中にあるパーツをクリック。
2. 操作パネルの「コンテナ」タブをクリック。
3. 以上が、「コンテナ」タブで選択する方法です。

パーツ一覧を表示させるには

編集パネルの表示設定

スマートフォン表示に切り替える

1. 「このサイトを開く」をクリック。
   
   
2. 「編集する」をクリック。

3. スマートフォンのアイコンをクリック。
   
   パソコンのアイコンをクリックすると、パソコン表示に戻ります。
4. 以上が、スマートフォン表示に切り替える手順です。

表示サイズを変更する

1. 「このサイトを開く」をクリック。
   
   
2. 「編集する」をクリック。
3. 「＋」ボタンをクリックすると、編集パネルが拡大表示されます。
   
   「－」ボタンで縮小表示されます。
4. 以上が、表示サイズを変更する手順です。 

自動ズーム機能

1. 「このサイトを開く」をクリック。
   
   
2. 「編集する」をクリック。
3. ウィンドウサイズを小さくすると、編集パネルが自動で縮小。
   自動ズームの表示サイズは、50％、75％、100％です。
4. 以上が、自動ズーム機能の説明です。

書式パネルとは

文字を選択すると表示されます。
パネルでは、フォントの設定や装飾ができます。
また、設定した書式を保存しておくことができます。
文字を選択するときは、パーツをダブルクリックしてからドラッグで選択します。

書式パネルの構成