アメブロのはじめ方・使い方 -...

46
アメブロのはじめ方・使い方 アメブロスキン制作サービス@エレファント http://ameblo.jp/amebaskin/ 1

Upload: doanngoc

Post on 07-Nov-2018

212 views

Category:

Documents


0 download

TRANSCRIPT

アメブロのはじめ方・使い方

アメブロスキン制作サービス@エレファント

http://ameblo.jp/amebaskin/

1

2

アメブロのはじめ方・使い方インデックス

■とりあえずアメブロに登録して、自分のブログスペースを作りたい

【初心者向け】アメブロの作り方・1(登録~作成まで)

■ブログタイトルと説明文、ニックネームの設定がしたい

【初心者向け】アメブロの作り方・2(ブログタイトル等の設定)

■ブログの外見を自分のお気に入りにしたい

【初心者向け】アメブロの作り方・3(カラムとスキンの設定)

■テキスト・絵文字にリンクをはりたい

【初心者向け】テキストにリンクをはる方法3ステップ (こんな感じでリンクを設定する方法)

■アメブロに画像を貼りたい

【初心者向け】ブログにパソコンに保存された画像を貼り付ける方法(その1)

■貼り付ける画像の大きさや位置をコントロールしたい

【初心者向け】ブログにパソコンに保存された画像を貼り付ける方法(その2)

■画像にリンクをはりたい

【初心者向け】ブログにパソコンに保存された画像を貼り付ける方法(その4)

■画像の大きさをきれいに変更(リサイズ)したい

【初心者向け】ブログにパソコンに保存された画像を貼り付ける方法(その3)

■携帯電話からメールで投稿・更新してみたい

【初心者向け】携帯電話からアメブロを更新する方法

■メッセージボードの編集がしたい

【初心者向け】メッセージボードの編集方法

■プロフィール画像の設定がしたい

【初心者向け】プロフィール画像の設定方法

■フリースペースに画像やリンクをはりたい

【初心者向け】フリースペースに画像を貼る方法

■読んでもらえるタイトルのコツ(PDF ダウンロード特典)

記事に興味を持って読んでもらえるタイトルの付け方のコツ

アメブロの作り方・1(登録~作成まで)

必要となるもの:現在使用できて、返信が受け取れるメールアドレス

3

今回は基本の基本、「そもそもアメブロを作るには何が必要で、どうすればいいの?」です。今回は、まず

登録からマイページの作成までです。

1.アメーバのトップページにアクセスして、登録画面に移動します

まずは、アメーバのトップページ(http://www.ameba.jp/ )にアクセスして、「アメーバ会員登録」のアイコン

をクリックします。

2.メールアドレスを登録します

会員登録用のメールアドレスを登録します。ここで登録したメールアドレスに会員登録のためのメールが

届きます(後日変更可能)。

通常、すぐに届きますが、届かない場合は迷惑メールフォルダなどもチェックしてみてください。

アメブロの作り方・1(登録~作成まで)

4

3.届いたメールの URL をクリックして、本登録を完了します。

「【Ameba】会員登録を完了してください」というメールが、さきほど登録したメールアドレスに届きます。メー

ルの指示に従って URL をクリックすると、会員登録の詳細画面が開きます。

ここで、アメーバ ID(メールアドレスとは別に設定します)と、ログインに必要なパスワード、ニックネームの

登録を行います。

「アメーバ ID」は、ブログのアドレスにもなります。このブログの場合、ID が「amebaskin」なので、ブログの

アドレスは「http://ameblo.jp/amebaskin/」となります。これは他の人が使用しているものは使用不可、か

つ一度決めると変更不可なので、気を付けてください。

プロフィール情報はここではごく一部、仮のものとなります。後から内容や公開・非公開も選択可能ですの

で、ここではとりあえず埋めるぐらいで大丈夫です。

アメブロの作り方・1(登録~作成まで)

5

4.マイページの閲覧・利用ができるようになり、アメーバからメールが届きます。

ブログを書いたり、ブログやルームの設定ができる自分用のページ「マイページ」が利用できるようになり

ます。また、「【Ameba】ご登録ありがとうござ いました」というメールが届きますので、これは保管しておき

ます。

このメールにはパスワードが記載されていませんので、パスワードの管理は別途行うようにしてください。

これで、新しいブログの登録ができました。

次回はブログタイトルや説明文、ブログスキンとニックネームの設定など、ブログの基本的な

外観を整える手順についてです。

アメブロの作り方・2(ブログタイトル等の設定)

6

1回目は、アメブロに登録する方法から、マイページを表示させたところまででした。 2回目はもうちょっと

進めて、ブログのタイトルやニックネームを設定していきます。

1.まずは各部名称の確認をしましょう

と言っても、今回は「ニックネーム」「ブログタイトル」「ブログの説明文」の3つだけです。

この3つを、初期設定の状態から順番に変更していきます。

2.設定変更に使うリンクの場所を確認しておきます

マイページの左側にあるボックスに、それぞれ設定ページに行けるリンクがあります。それぞれ、【ルーム

をつくる】・【アメブロの基本設定】という名前のページにリンクしています。

アメブロの作り方・2(ブログタイトル等の設定)

7

3.ニックネームを変更してみましょう

「(あなたの設定したニックネーム)さん」(上の画像ではテストエリア11さん)の横にある、「設定」のリンク

をクリックすると、下の画像のようなページに移動します。

ここでは、ニックネームの変更や性別・誕生日などの設定、情報の公開/非公開が選択できます。

設定が終わったら、ページの下にある「保存」ボタンを押して変更を反映させてください。

元のページに戻るときは、上の「マイページ」をクリックすると戻れます。

4.ブログタイトルと説明文を変更してみましょう

「ブログ」の横にある「設定」リンクをクリックすると、ブログタイトルと説明文などの設定ページに移動しま

す。初期設定のブログタイトルは「(あなたの設定したニックネーム)のブログ」、説明文は「ブログの説明を

入力します」となっています。

「タイトル」欄でブログタイトルの変更が、「説明」でタイトルの下に位置するブログの説明文が変更できま

す。

設定が終わったら、ページの下にある「保存」ボタンを押して変更を反映させてください。

元のページに戻るときは、上の「マイページ」をクリックすると戻れます。

アメブロの作り方・2(ブログタイトル等の設定)

8

5.変更が反映されたかどうかを確認してみましょう

マイページの右上の方にある「自分の公開ページ」欄の「ブログを見る」をクリックすると、自分のブログが

見られます。ここで、変更が反映されているかどうか確認してみましょう。

手順1の画像と比較してみてください。

ニックネームやブログタイトル・説明文の変更は何度でもできます。

選択するスキンによっても印象が変わってくるので、いろいろ変えてみるのもいいかもしれません。

アメブロの作り方・3(カラムとスキンの設定)

9

3回目は、カラム構成とスキンの変更方法について書いていきます。

これで「エントリを書く前にやっておくこと」は終了です。

1.まず、デザインの変更をするページに移動します

マイページの上にある「ブログを書く」タブをクリックし、その後で下に出てくる「デザインの変更」をクリック

すると、下のような画面に移ります。ここで、使いたいスキンデザインの傾向を選び、カテゴリをクリックしま

す。

アメブロの作り方・3(カラムとスキンの設定)

10

2.選んだカテゴリから、好きなデザインを探していきます

今回は「シンプル」を選んでみました。カテゴリに応じたデザインが出てきます。次のページがある場合は

ページ送りのリンクが下の方に表示されるので、お好きなスキンを探していきます。

ひとつのブログスキンには複数のカテゴリが設定されているので、違うカテゴリを選んでも同じスキンが出

てくることもあります。

アメブロの作り方・3(カラムとスキンの設定)

11

3.カラム構成の変更と決定をしましょう

スキンを選んだら、カラム構成を選択します。ページの上部にカラム構成、下に選択しているスキン+カラ

ム構成のプレビューが表示されるので、選んで「適用する」ボタンを押して、決定します。

アメブロの作り方・3(カラムとスキンの設定)

12

4.実際にブログがどうなったかを見てみましょう

「適用する」ボタンを押すと、ブログスキンデザインとカラム構成の両方が保存され、お使いのブログに反

映されます。

今回は「ベーシックスキン」の「3カラム・両サイドメニュー」を選択しました。本来は真っ白なスキンですが、

カラムがわかりやすいように色を載せてあります。

これで、カラム構成とスキンの変更ができました。どちらも、いつでも変更可能なので自分にあったカラム

構成や、好きなスキンを探してみてくださいね。

(スキンをカスタマイズしている場合には、カラム変更が大きな影響を及ぼす可能性もありますが、それは

別の時に解説したいと思います)

テキストにリンクをはる方法3ステップ

13

スキンの設定をしたら今度は中身を作らないといけません。

どんなコンテンツにも付きものの、リンクのはり方について解説していきます。

「テキストにリンクをはる」というのは何かというと、

http://www.yahoo.co.jp/

このテキストは、Yahoo! Japan にリンクしています。

■■■■■■

このように、URL(ホームページのアドレス)・任意の文字列にリンクをはる方法を解説していきます。手順

は3つ。

1.リンクをはりたいテキストを書きます

2.リンクしたい URL を用意します

3.アメブロの入力支援ボタンを押してリンクします

1.リンクをはりたいテキストを書きます

アメブロの編集画面を開いて、リンクをはりたいテキストを書きます。

テキストにリンクをはる方法3ステップ

14

2.リンクしたい URL を用意します

リンクしたいページを開き、アドレスバーに表示されているアドレスをコピーします。

今回は、Yahoo! Japan の URL を用意しました。

3.アメブロの入力支援ボタンを使ってリンクします

アメブロの編集画面で、テキストを入力するエリアの上に並んでいるボタンを使います。

3-1.リンクしたいテキストを選択します

3-2.「リンク」ボタンを押します

テキストにリンクをはる方法3ステップ

15

3-3.「リンクの追加」という新しいウィンドウが出るので、リンクしたい URL を入れます

リンクがはられると、テキストに下線が付き、テキスト色が青に変わります。

これで、リンクがはられました。実際にブログ上で見る時は、スキンのデザインによって下線の有無や、色

遣いが変わりますが、正しくリンクされていれば問題はありません。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

16

アメブロの基本的な使い方、画像を貼り付ける方法についてです。

まずは最初に基本的な貼り方から。

1.アメブロの編集画面を開きます

2.「画像」ボタンを押して、画像フォルダを開きます

3.貼り付けたい画像を指定して、画像フォルダに追加します

4.画像フォルダから画像を選んで、ブログの編集画面に貼り付けます

今回、大事なのは、「アメブロに画像を貼る時は、画像フォルダを経由しなければいけない」ということです。

「方法はわかるけど、画像が保存されている場所がわからない!」という場合の、よくあるケースも後述し

ます。

1.アメブロの編集画面を開きます

2.「画像」ボタンを押して、画像フォルダを開きます

編集画面で「画像」ボタンを押すと、アメブロの「画像フォルダ」が開きます。一度ここにパソコン内の画像

をアップロード(フォルダに移す「あげる」こと)をしないと、画像が貼り付けられません。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

17

押すと、下の画像のような「画像フォルダ」が、別ウィンドウで出てきます。

ここで、パソコン内の画像を参照してアップロードするのが下準備です。

3.貼り付けたい画像を指定して、画像フォルダに追加します

今回は、デスクトップ上に置いてある「画像貼り付け説明用.jpg」という画像をフォルダに追加してみます。

今回貼りたいのはこれです。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

18

まず、手順2の画像を参考に、画像フォルダの「参照…」ボタンを押します。

そうすると、「ファイルのアップロード」という名前の別ウィンドウが開きます。これは、今使っているパソコン

の中にこういうファイルがありますよ、という一覧表です。

ここから、「デスクトップの中にある→画像貼り付け説明用.jpg」というファイルを指定します。選択している

ファイルは、ウィンドウの下にある「ファイ ル名」のところに反映されるので、確認しながら作業してみてくだ

さい。ファイルが決まったら、右下の「開く」ボタンを押します。

「開く」ボタンを押すと、指定した場所の画像が表示されます。タイトルは任意に付けてください。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

19

画像を指定したら、下の「アップロード」ボタンを押します。「画像が追加されました」というメッセージのあと

でフォルダを確認し、無事に反映されていれば、これでブログに貼り付ける準備が完了です。

4.画像フォルダから画像を選んで、ブログの編集画面に貼り付けます

ブログの編集画面を開き、画像を入れたい場所にカーソルを持って行きます。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

20

「画像」ボタンを押して「画像フォルダ」を開き、貼り付けたい画像の下にある「この画像を使う」ボタンを押

します。

カーソルがあった位置に、選択した画像が入りました。

これで、ブログに画像が貼り付けられました。

まずは画像貼り付けの基本のところが、これで押さえられました。

画像がどこに保存されているかわからない!という場合は、とりあえず、マイドキュメント→マイピクチャ、

の中を探してみてください。Windows を使用していて特に保存先を指定しない場合、たいていはこの中に

入っています。

ブログにパソコンに保存された画像を貼り付ける方法(その2)

21

今回は、

・画像を原寸で貼り付ける

・左右や真ん中など、画像を貼り付ける位置をコントロールする

どちらも、「画像フォルダ」から画像を呼び出す際に指定することで、簡単にできます。

使う機能が違うだけで、画面はほとんど一緒なので、順番に説明していこうと思います。

1.ブログの編集画面の「画像」ボタンを押して、画像フォルダを呼び出します

前回の手順1~3を見て、画像フォルダに貼り付けたい画像をアップロードしておいてください。

2.貼りたい画像を選ぶ際、「画像の設定」項目で、サイズを指定します

「オリジナルで表示」にチェックを入れてください。デフォルトは「縮小して表示」になっています。

ブログにパソコンに保存された画像を貼り付ける方法(その2)

22

3.原寸と縮小表示の違いを見てみましょう

上が原寸サイズで貼り付け、下がアメブロの自動縮小機能を使ったものになります。

4.画像の位置を指定して貼り付けてみましょう

画像を貼り付ける際、「左寄せ」「右寄せ」「中央寄せ」の3パターンを指定します。これは、上で解説したサ

イズの指定と一緒に指定することも可能です。

(原寸大の画像にして、真ん中に配置、なども指定できます)

ブログにパソコンに保存された画像を貼り付ける方法(その2)

23

5.位置を指定した画像を見てみましょう

「指定しない」「中央に配置」「左に配置」「右に配置」それぞれをひとつの画像にまとめてみました。

ここでは特に、「位置を指定しない」と、「左右に配置」の違いについて気を付けてみてください。「右に配

置」「左に配置」を指定すると、横にテキストで説明を入れることができます。

画像に対応した一番下の行までテキストを書いて、そのまま改行を入れずに続けていくと、自動的にテキ

ストの開始位置が変わります(テキストの回り込み)。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

24

今回は、「ブログに貼るために写真のサイズを変更(リサイズ)する」です。

その2では、画像をリサイズせずに原寸で貼り付ける方法 を解説しましたが、画像がブログの本文の幅よ

り広い場合、はみ出してしまいます。デジカメのデータを取り込むと、画像の大きさもデータの大きさもかな

りのものです。

ここからブログに適した大きさにリサイズしていくわけですが、今回はフリーウェア(無料で使えるソフト)を

使って解説していきます。

1.フリーウェア・JTrim をダウンロードして、インストールします

2.リサイズしたい画像を JTrim に取り込みます

3.任意の大きさにリサイズして、保存します

基本は3ステップですが、インストールは1回だけなので、2回目以降はもっと簡単です。

1.JTrim をダウンロードして、インストールします

検索エンジンで「Jtrim」を検索し、配布ページに行きます。

中ほどにある「DOWNLOAD」のセットアップ版をダウンロードして、インストールします。

セットアップ版は、落としてクリックするとすぐにインストールができるようになっています。

【JTrim】 http://www.woodybells.com/jtrim.html

インストールしてから起動すると、こんな画面が出てきます。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

25

2.リサイズしたい画像を JTrim に取り込みます

左上のメニューから「ファイル」-「開く」を選んで、編集したい写真を指定します。

指定した写真を開きました。実際にはお皿が複数ありますが、画像が大きいために一部分しか表示され

ていません。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

26

3.任意の大きさにリサイズして、保存します

写真をリサイズしていきます。上に並んだボタンから、「リサイズ」ボタンを選択します。カーソルを当てると、

ボタンの説明が表示されるので、確認してみてください。

画像を、リサイズしたいサイズに設定していきます。アメブロに貼り付ける場合の目安ですが、

・3カラムの場合、横幅400ピクセルまで

・2カラムの場合、横幅550ピクセルまで

はみ出さない上限がこのぐらいの横幅です。下にある「縦横の比率を保持する」のチェックは、外さないよ

うにしてください。この機能をオンにしておくと、縦横どちらかを指定するだけで、きれいにリサイズされま

す。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

27

リサイズされて、写真全体が見えるようになりました。これを「ファイル」>>「名前を付けて保存」します。

ファイル名は、サイズを含めておくといいかもしれません。

たとえばこの写真であれば、「リサイズ例_400px」みたいな感じですね。あとでわかりやすくなります。

ここまででリサイズのやり方は終わりです。サイズのところにちょっと書いた、「3カラムの場合」と「2カラム

の場合」の目安になる横幅の根拠と、実際どうなのかを、次でちょっと解説します。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

28

まずは、3カラムの場合です。このパターンは両側にメニューを配置していますが、本文が右もしくは左側

に寄っていても、幅そのものは同じです。

本文全体の幅が、約430ピクセルです。そして、内側の余白を考慮しなければいけません。

そのため、3カラムの場合、上限がだいたい400ピクセルと覚えておいてください。

ブログにパソコンに保存された画像を貼り付ける方法(その3)

29

2カラムの場合は、サイドメニューが片方にしかないため、本文の幅が広くなります。画像を大きく載せたり、

テキストを読んでもらうことが主眼の場合は、こちらがおすすめです。

本文全体の幅が、約600ピクセルです。そして、内側の余白を考慮しなければいけません。

そのため、2カラムの場合、上限がだいたい550ピクセルと覚えておいてください。

ブログにパソコンに保存された画像を貼り付ける方法(その4)

30

今回は、「画像にリンクをはる方法」です。

1.画像をアメブロの編集画面に貼り付けます

2.貼り付けた画像を選択します

3.リンク先の URL(アドレス)を指定します

つまり、やることは【初心者向け】テキストにリンクをはる方法3ステップ で解説したことを、画像でやるだけ

です。基本は一緒。一度やってみてしまえば、簡単です。

通常だと、アメブロの画像フォルダへリンクされますが、言っている通り、Yahoo! と Google に

リンクさせるにはどうすればいい?ということを解説していきます。

ブログにパソコンに保存された画像を貼り付ける方法(その4)

31

1.画像をアメブロの編集画面に貼り付けます

これは以前解説したので、詳しくはそちらを見てください。

ブログにパソコンに保存された画像を貼り付ける方法(その1)

リンクをはりたい画像を貼り付けます。普段、普通に画像を貼る時との違いはありません。

2.貼り付けた画像を選択します

アメブロの編集画面で、画像をクリックして選択します。真ん中あたりをクリックすると、周りに枠が出てき

ます。この枠が出てくれば、現在、「その画像が選択されている」ということになります。

ブログにパソコンに保存された画像を貼り付ける方法(その4)

32

3.リンク先の URL(アドレス)を指定します

画像を選択した状態(枠が付いている状態)のまま、「リンク」ボタンをクリックします。

そうすると、リンク先を指定するためのウィンドウが出てきます。これはテキストにリンクをはる時と同じ手

順なので、不安がある場合は以下のエントリを参考にしてください。

テキストにリンクをはる方法3ステップ

これで、画像にリンクがはれました。

実際にリンクしている状態の画像は、ブログの方で見ていただけます。

ご自分でも試して、リンクの方法とリンク先の確認をしてみてください。

携帯電話からアメブロを更新する方法

33

携帯電話から、メールでアメブロに記事を投稿して更新する方法です。最初の設定が済んでしまえば、あ

とは登録したメールアドレスに投稿することで、更新ができるようになります。

1.アメブロ側で、更新する携帯電話のメールアドレスを登録します

2.投稿用メールアドレスの通知がアメブロから来ます

3.メールアドレスを登録し、送信してアメブロを更新します

4.メール投稿用メールアドレスの確認方法

1.アメブロ側で、更新する携帯電話のメールアドレスを登録します

「マイページ→ブログを書く→アメブロの設定→メール投稿の設定」で、携帯電話のメールアドレスを設定

します。ここで登録したメールアドレス(1種類)から投稿されたときのみ、更新が反映されるようになります

ので、普段お使いの携帯電話のアドレスを登録してください。

この際、あらかじめ携帯電話で「ameblo.jp」を受信許可設定しておかないと、メールが受け取れません。

またこの時、携帯電話から投稿する際のブログテーマと公開範囲を設定することができます。

2.投稿用メールアドレスの通知がアメブロから来ます

「【Ameba】投稿用メールアドレス設定完了しました」という件名のメールが届きます。本文に、以下の4種

類のメールアドレスが記載されているので、アドレス帳に登録しておくと便利です。

・メール投稿用のアドレス(画像を添付すると画像も反映されて更新されます)

・画像のみ投稿用のアドレス(画像を送ると画像フォルダに保存されます)

・動画付きの投稿用アドレス(動画を添付すると、動画も反映されて更新されます)

・「なう」投稿用アドレス(メールを送ると「なう」に反映されます)

携帯電話からアメブロを更新する方法

34

3.登録したメールアドレスから、アメブロを更新します。

携帯電話から投稿してみました。メール投稿時のテーマは、「メール投稿の設定」で選択したテーマになり

ます。

4.メール投稿用メールアドレスの確認方法

メールアドレスが送られてきたメールをなくした、携帯電話の設定がメールを受け取れない設定になってい

た、などの場合は、「メール投稿の設定」ページで一覧が確認できます。

下の方にスクロールしていくと、一覧があります。

ここで、一通り確認することができます。わからなくなってしまったら、確認してみてくださいね。

フリースペースに画像を貼る方法

35

今回は、サイドメニューのフリースペースに画像を貼ったり、画像にリンクをはる方法についてです。

流れとしては、アメブロに画像を貼り付けてみようシリーズの続きです。途中でわからなくなったら、該当項

目が解説されているエントリも見ながら、ちょっとずつやってみてください。

1.フリースペースの編集方法+テキストを書く

2.フリースペースに貼るためのテキストと画像を作る

3.フリースペースを編集する

今回は理屈を後回しにして、このへんをまとめて解決していこうと思います。

1.フリースペースの編集方法+テキストを書く

マイページ→ブログを書く→サイドバーの設定→フリースペースの編集を開いて、フリースペースの編集

画面を開きます。左側にテキストを入力すると、右側のプレビュー画面に反映されます。

(すぐに反映されない場合は、右側のウィンドウをクリックしてみると反映されることがあります)

フリースペースに画像を貼る方法

36

2.フリースペース用にテキストと画像を編集する

フリースペースには「画像」ボタンがありません。画像フォルダから呼び出して貼り付けるということが、で

きないわけですね。ではどうすればいいかというと、別の編集画面を使います。

おなじみの「ブログを書く」画面です。ここに、フリースペースに表示したい内容を全部書いてしまいます。

画像の貼り付け方や、画像にリンクをはる方法については、過去のシリーズを参照してみてください。

フリースペースに書きたいことができたら、編集エリアの下にある「HTML タグを表示」という部分をクリック

します。

クリックすると、入力した文字の周囲にいろいろとくっついていたり、画像が謎の文字列になってしまったり

しますが、気にせず全部コピーします。

フリースペースに画像を貼る方法

37

3.フリースペースを編集する

コピーした状態のまま、手順1に従ってフリースペースの編集画面を表示して、左側のウィンドウに貼り付

けます。

フリースペースに画像を貼る方法

38

右側のプレビューと見比べて、テキストと画像がちゃんと反映されているかどうかを確認してみてください。

・<br /> だけは、消しても大丈夫です(改行指示のタグです)

・改行は、普段アメブロを書くときと同じようにできます

・他のタグには、さわらないようにしてください

あとは、右側のプレビューを確認しながら外観を整えてください。プレビューは、リンクも確認することがで

きます。

最終的には、こんな感じになりました。

フリースペースの編集方法解説については、以上です。

「HTML タグを表示」にしたときに、文頭や文末にくっついている文字列について、画像が文字列になって

いるのに、プレビューだとちゃんと画像が貼られているなどの理由については、いずれ改めて解説したい

と思います。

プロフィール画像の設定方法

39

プロフィール写真の設定方法について書いていきます。大きい写真は自動的にリサイズされてしまうので、

最適な画像サイズについても解説します。

2.画像を参照して、設定します。

プロフィール画像として使いたい画像を指定し、タイトルは任意で入力して設定します。

画像の参照の仕方については、以前の PDF「ブログにパソコンに保存された画像を貼り付ける方法(その

1)」手順3から先を参照してください。

また、画像は150ピクセル×150ピクセルにリサイズされるので、あらかじめこのサイズにしておくと、きれ

いに反映されます。画像のリサイズ方法については、以前の PDF 「ブログにパソコンに保存された画像を

貼り付ける方法(その3) 」を参考にしてください。

プロフィール画像の設定方法

40

3.画像を複数設定してみましょう

初期設定では、最初に設定した写真がメイン写真として登録され、下に他の写真が登録順に並んでいき

ます。メイン写真1枚+一覧に8枚、計9枚を登録しておくことが可能です。

プロフィール画像の設定方法

41

4.メイン写真を切り替えてみましょう

写真の下にある「この画像を使用する」ボタンをクリックすると、該当する写真がメインに切り替わります。

5.メイン写真とそれ以外の写真の扱いについて

メイン画像は、ブログのプロフィール欄に表示されます。他の写真は、ルームのプロフィール画像にカーソ

ルを合わせると、「他の写真を見る」という欄が出現し、クリックするとメイン以外の写真がスライドで見られ

ます。

メッセージボードの編集方法

42

ブログのトップページに、ヘッダと本文の間に表示される「メッセージボード」の編集方法についてです。

イベントの告知など、お客様の誘導に一役買ってくれるメッセージボードを作って、活用してみましょう。

1.メッセージボードの編集画面に移動しましょう

マイページ→ブログを書く→アメブロを書く→メッセージボード、をクリックして、メッセージボードの編集画

面に移動します。見た目は、本文の編集画面と同じです。

2.メッセージボードの編集をします

ブログの本文の編集と同じく、文字装飾や絵文字を使ったり、画像の貼り付け、リンクがはれます。

やり方がわからない時は、インデックスから該当する項目を探してみてください。

編集が終わったら、編集領域の下にある「公開」ボタンを押すと、ブログに変更が反映されます。

メッセージボードの編集方法

43

3.実際にブログに適用したところを確認します

普段ブログを書いているときと同じく、編集画面と実際はさほどの違いは出ませんが、改行位置や全体の

バランス、本文とのバランスなどを見て、調整していきます。

メッセージボード自体の枠の大きさとデザインは、ブログスキンによって変わります。プレビュー画面なども

利用して、見やすいメッセージボードを作ってみてくださいね。

読んでもらえるタイトルのコツ

44

せっかく毎日更新しても、中身がよくても、タイトルで避けられてしまうことがあります。

人と検索エンジン両方に避けられない、SEO 的にもちょっといいタイトルの付け方のコツについて、解説し

ます。

1.文字数に気を配る

アメブロのマイページに表示される「チェックリスト」は、タイトルを13文字まで表示します。つまり、最初の

12文字で興味を持ってもらうことが大切になります。

また、目安として、Yahoo! や Google などの検索エンジンでは、約28文字まで表示されます。

読んでもらえるタイトルのコツ

45

2.興味を引く、内容がわかるタイトルにする

タイトルだけで概要がわかり、なおかつ詳細を見たいと思えるタイトルを付けるのがベストです。

「自分がこのタイトルを見たら、知らない人のブログでもリンク先を見てみるか?」を基準に、タイトルを考

えてみるのもいいと思います。

3.重要なキーワードはなるべく前に持ってくる

検索エンジンは、タイトルの前にあるキーワードほど重要視すると言われています。

そのため、この PDF のように「初心者向け」であることを強調したい場合、

読んでもらえるタイトルのコツ

46

4.魅力的なタイトルを付けるには?

マイページのチェックリストを眺めて、「クリックして中身を見てみたくなるタイトル」を探し、

そこに共通していることや、感じたことを集めてお手本にするのがいいと思います。

そうして、自分に合ったスタイルの魅力的なタイトルを付ける練習をしていきます。

「キーワードを詰め込んでなんだかわからなくなる」ことや、「タイトルに凝りすぎて中身が伴わない」という

のは、結局のところ逆効果です。

その時は見てくれるけれど、リピーターにはなり得なくなってしまいます。

キャッチーなタイトルと、嘘のタイトルは違うものです。