1. ホーム >
  2. Google >
  3. Blogger >
  4. グーグル・ブロガーを使いこなす! 個々の機能の説明からお役立ち情報まで

グーグル・ブロガーを使いこなす! 個々の機能の説明からお役立ち情報まで

ブロガーを使いこなすために、個々のブロガーの機能を紹介・説明します。またブログの仕組など、ブログをより深く分かっていただくためのお役立ち情報も載せています。

ブロガーで投稿するためにログインする

1. Blogger へのログイン

Blogger へのログインには、ユーザー名(メールアドレス)とパスワードが必要になりますので予め準備しておいてください。〔使用するグーグル・アカウントのユーザー名とパスワードは、弊社デザクロからメールなどで前もってお客様にお知らせしています。〕

※グーグル・アカウントをお忘れの際は、デザクロまでEメールでお問い合わせください

2. ユーザー名とパスワードの入力(グーグル・アカウント入力)

Blogger : 無料でブログを作成」の Webページに進み、Googleアカウント入力欄に、ユーザー名とパスワードを入力して「ログイン」ボタンを押します。

「次回からの入力を省略」のチェックボックスにチェックを入れると、次回投稿時からは、このページを飛ばして次の「Blogger : ダッシュボード」のページに行けるようになります。(なお、「次回からの入力を省略」にチェックを入れても、時折ユーザー名とパスワードの入力を求められることがあります。)

グーグル・ブロガーの URL(上の入力ページとは異なるアカウント入力画面が表示される場合がありますが、同様にユーザー名とパスワードを入力してください。):
  http://www.blogger.com/home〔クリックすると、別ウィンドウでサイトが開きます。〕


グーグル・アカウントへのログイン方法はこちら。〈準備中〉
(こちらの方法でもグーグル・ブロガー投稿ページに行くことができます。)

3. ダッシュボードから「投稿を作成」ページへ

「Blogger : ダッシュボード」のページが開いたら、これから投稿するブログのタイトル下にある「投稿」ボタンをクリックしてください。投稿作成画面に進みます。

なお、「プロフィールを編集」のページに進むと、プライバシーの「プロフィールを公開」にチェックが入っていますが、これはブロガーのラベル機能(後述)を利用するために不可欠ですから、チェックは外さないでください。初期設定では、プロフィールは最低限の公開情報となっています。

ブログのタイトルの左側に小さく薄い色のアイコンが2つあります。これはそれぞれ携帯電話からの投稿やEメールでの投稿を可能にするための設定ボタンです。商用サイト利用ではあまり使用する機会がないと思われるので、詳細は省略します。

※「投稿を編集」の右側にある「設定」-「テンプレート」の設定については専門的知識が必要です。設定変更により表示されなくなったり、体裁が崩れることもあります。変更は自己責任でお願いします。

ブログを投稿する手順を説明する前に、ブログ記事掲載の大まかな仕組みについて解説します。

投稿した記事は、ブログのトップページや最近の投稿、過去の月別ページ、ラベル別ページなどブログ内の様々なページに掲載されます。その中で最近の投稿の記事名をクリックすると、記事の単独ページが表示されるはずです。実はその単独ページこそがブログのベースとなるもので、パーマリンクのページと呼ばれています。

ブログのトップや最近の投稿での掲載は、その後新たに投稿された記事にとって変わられますが、パーマリンクのページ自体は、(投稿者によって削除されない限り)ずっと存在し続けます。このパーマリンクのページがベースとなり、他の様々なページに組み込まれ、閲覧できる仕組みとなっているのがブログなのです。

なお、ブログで使われる専門用語「パーマリンク」の語源は、パーマネントリンク(Permanent Link)から来ています。髪の毛に施すパーマと語源は一緒で、パーマネントとは「永続する」という意味ですから、パーマネントリンクは、直訳すれば「永続するリンク」となります。

パーマリンクについて

記事の投稿によって形成される単独ページのアドレス(=URL)のことを、パーマリンク〈Permalink〉(固定リンク、恒久リンク)と呼びます。投稿記事とパーマリンクは必ず1対1で対応します。ブログにおいてはこのパーマリンクがベースになっていると言っても過言ではありません。検索エンジンの検索対象となるのもこのパーマリンクがベースですし、コメントを受けるのもパーマリンクのページです。(被リンクを受ける際は、ブログのトップにではなく、パーマリンクにリンクを張ってもらってください。)

ブロガーへの投稿を作成する手順

「投稿を作成」するページでは、〔1〕タイトル入力、〔2〕本文・画像を入力、〔3〕ラベル設定、〔4〕投稿を公開 の手順を経てブログをアップロード・公開します。

上図をもとに詳しく見ていきしょう。

1. タイトルを入力

最初に投稿の記事タイトルを入力します。ここで入力した記事タイトル名は、ブログのトップページでは大見出しとして表示されるのみですが(この時のトップページのページタイトルは「ブログタイトル名」になります)、パーマリンクのページ(=単独ページ)では、大見出しの他に、ページタイトル(=「ブログタイトル名:記事タイトル名」)としても表示されます。

整理すると、この欄に入力した「記事タイトル名」は、実際のブログでは次のように表示されます。

ブログのトップページ:
大見出しとして「記事タイトル名
パーマリンクのページ:
ページタイトルとして「ブログタイトル名:記事タイトル名」+ 大見出しとして「記事タイトル名

検索エンジン対策(=SEO)としてのタイトル(検索結果上位を狙うためには)

検索エンジンが最重要視する項目のひとつがページタイトルです。タイトルで人目を惹くことも重要ですが、商用ブログの場合、次の3つを意識してタイトルをつけることで検索上位が狙えるようになります。


検索キーワードの求め方について詳細はこちら。〈準備中〉

他社・他店に差をつけるページタイトル命名法についてはこちら。〈準備中〉

デザインクロス作成 Blogサイト(CMSサイト)は、検索エンジン対策的に少しでも優位になるよう、HTMLファイルのヘッダー内にあるメタタグ:キーワード欄(検索エンジン用の記述で、画面上には現れません)に「記事タイトル名」が自動的に加わる設定が施されています。
ピンポイントで検索にヒットさせたいような場合は、文ではなく単語をタイトルとしたほうが上位を狙えます。


2. 本文や画像を入力

項目12の「画像を追加」で詳しく説明しますが、ブログにアップする文章の他に画像がある時は、先に画像をアップしてから、文字の入力を行うようにしてください。

ブロガーの本文・画像入力欄には様々な編集をサポートする機能があるので、そのひとつひとつを詳しく見ていきます。


1) フォントの種類

ここで選択できるフォントの種類(英字フォント)の適用は、半角英数の文字に対してのみです。日本語に対しては適用されません。特に利用したい英字フォントがある場合にご利用ください。

選択できる英字フォント:

  • Arial〈アリエル:ゴシック系〉
  • Courier〈クーリエ:明朝系〉
  • Lucida Grande〈ルシーダグランデ:明朝系〉
  • Times〈タイムス:明朝系〉
  • Trebuchet〈トレブチェット:ゴシック系〉
  • Verdana〈ヴァーダナ:ゴシック系〉
  • Webdings〈ウェブディングス:絵フォント・イラストフォント〉
文字入力欄内で使える右クリックとキーボードショートカット(コピー&ペースト機能)

本文入力欄で直接入力するのとは他に、使い慣れたテキストエディター(文書作成アプリケーション)で作成した文章をもってくることが可能です。

ウインドウズの場合、右クリックかキーボードショートカットでコピー&ペースト(複写&貼り付け)ができます。(使用できるキーボードショートカットは Blogger ヘルプのページ http://help.blogger.com/bin/answer.py?answer=42197 に載っています。)

Macの場合、ショートカットは使えませんが、「コントロールキー + クリック」で(またはマウスに副ボタンを設定している場合は Win 同様右クリックで)、カット・コピー・ペーストの機能は利用できます。
(2009年7月以降、Safari 4では、ショートカットが使えるようになりました。)

なお、テキストエディター(文書作成アプリケーション)において、リッチテキストフォーマットで作成した文書マイクロソフト Office Word(オフィスのワード)の文書をペースト(貼り付け)した場合に限り、リッチテキストや Word で設定したスタイル情報、フォントの種類(日本語フォントも含みます)・大きさ・色がそのまま適用されます。
書体・大きさ・色を適用せず、文字だけをペースト(貼り付け)したい時は、シンプルテキストフォーマット(.txt)の文書から行ってください。

2) フォントのサイズ

文字の大きさの指定は、Smallest(最小)、Small(小)、Normal(中)、Large(大)、Largest(最大)の5種類からとなります。初期設定は Normal(中)です。

この5種類のサイズ指定以外の大きさを使いたい場合は、リッチテキストフォーマットで作成した文章からコピー&ペーストしてください。(詳しくはひとつ前の項目フォントの種類で。)


3) フォントの太さ

文字の太さを変更します。初期設定のノーマル(普通)とボールド(太い)がトグルで変更できます。強調したい文字や見出しのなどで使ってください。

4) フォントの傾き

文字の傾きを変更します。初期設定のノーマル(正体)とイタリック(斜体)がトグルで変更できます。少し強調したい文字などで使えます。

印刷物と比べ視認性があまり良いとは言えないブラウザーでの日本語のイタリック化は、さらに文章を読みにくくすることがありますので、使用には注意が必要です。

5) フォントの色

投稿記事の文字の色を変更できます。そのまま色の指定をしないまま文字を入力して公開した場合、文字の色は予め CSS によって設定してある色となります。(通常は黒、もしくは黒に近い色に設定してあります。)

※CSSによる初期設定色の変更を希望する場合は、デザクロまでご依頼ください。

繰り返しになりますが、ブログ記事本文のそもそもの色は、予め CSS によって設定してあります。文字入力欄で(黒色で)入力した文字は、公開時にはその CSS で設定されている色になります。例えば仮に CSS による本文の設定色が青色なら、文字入力欄で黒色のまま入力したとしても、青色で表示されることとなります。

左のカラーピッカー(色をピックアップするパネルをカラーピッカーと呼びます)の図で、赤い逆三角印で示された黒色の箇所は、本当は「黒色」ではなく、「色指定無し」です。色指定無しなので、CSS による初期設定色がそのまま表示されることになるのです。そのため、もし CSS による初期設定色が青色だった場合、このカラーピッカーからでは実際に表示される文字の色を黒色にすることはできません。(このカラーピッカーの黒色の部分は、「指定色無し」なのですから。)どうしても黒色にしたい時にはHTMLの専門知識が必要となります。

文章の色の注意点

本文ではあまり彩度の高い色(=鮮やかな色)を使用したり、文章の色を頻繁に変更するのは避けたほうが無難です。読みにくいのはもちろん、素人っぽい印象を与えてしまい、サイトの信頼性を失いかねません。

また、余り頻繁に文字の色や大きさを変更するのは、その分タグが大量生成されますから、検索エンジン対策的にもマイナスになります。

CSS〈カスケーディング・スタイル・シート〉についてはこちら。〈準備中〉

投稿の本文中に、他のウェブサイトを紹介するためのリンクを張りたい時は、先ずリンクを張りたい文字列(=リンク元となる文字列)を範囲指定する要領で選択します。次に(くさりのデザインの)リンク形成ボタンをクリックすると、URL入力用のウィンドウが開きます。そこにリンク先の URL(=ホームページアドレス)を入力して、OKボタンを押すとリンクが張られます。

1.リンクを張りたい文字列を本文から範囲指定する要領で選択
2.リンク形成ボタンをクリック
3.URL(=ホームページアドレス)を入力し、OKを押します。

なお、リンク先のホームページが別ウィンドウで開くといった設定には、HTMLの専門知識が必要です。
(グーグルは「別ウィンドウで開く」を推奨していません。)

7) 行揃え

文章の行揃えを変更できます。変更が及ぶ範囲はパラグラフ(=段落)単位です。文章の途中で行揃えを変更すると、その文章を含むパラグラフ全体の行揃えが変更になります。

行揃えについては、リッチテキストフォーマットや Word で作成した文章からのコピー&ペーストで、そのスタイルが継承されます。
(詳しくは前述の項目フォントの種類で。)

なお、「両端揃え」については現在正常に機能しないので、使用は控えてください。

8) リスト表示(数字)

リスト表示(数字)ボタンをクリックすると、左図のようなリスト(項目)表示になります。行頭が2文字下がり、改行毎に行頭に数字が表示されます。もう一度リスト表示(数字)ボタンをクリックすると通常の状態に戻ります。

リスト表示の便利なところは、リストの文章が長くて折り返しになっても文頭が縦に揃い、スペースで調整する必要がない点にあります。(スペースによる文字位置調整は、ブラウザーの種類によっては文字サイズが異なって表示され、体裁が崩れることがあるため推奨できません。)

9) リスト表示(黒丸)

リスト表示(黒丸)ボタンをクリックすると、左図のようなリスト(項目)表示になります。行頭が2文字下がり、改行毎に行頭に黒丸が表示されます。もう一度リスト表示(数字)ボタンをクリックすると通常の状態に戻ります。

リスト表示の便利なところは、リストの文章が長くて折り返しになっても文頭が縦に揃い、スペースで調整する必要がない点にあります。(スペースによる文字位置調整は、ブラウザーの種類によっては文字サイズが異なって表示され、体裁が崩れることがあるため推奨できません。)

10) 引用文掲載

他の人が書いた文章をある程度長文で引用して載せる場合に用います。編集画面には表示されませが、アップロードして公開すると左図のように大きな引用符(=ダブルクォーテーションマーク)が表示されます。合わせて引用の後には引用元を明示しましょう。Webサイトからの引用の場合は出典先の URL もリンク付で載せるようにしてください。

引用するだけ引用して、自分の意見が少なかったり、引用する理由が不明瞭な場合、著作権に抵触することもありますから注意してください。

※著作権・肖像権について詳しくはこちら。〈準備中〉

11) スペルチェック

文字入力欄中の英単語のスペルをチェックします。誤りのある綴りや怪しい綴りがある場合、その英単語が黄色くハイライトされ、カーソルを単語にもって行くと、正しい綴りの候補が表示されます。正しい単語を選択してください。誤った綴りの単語が正しい単語にとってかわられます。

日本語は残念ながらチェック対象外です。

12) 画像を追加

画像の配置(追加)には慣れとちょっとしたコツが必要になります。本文・画像入力欄に画像を追加した場合、画像は必ず一番上の先頭に配置されることになります。また、文字を入力し終わってから画像を追加すると、文字の無い真っさらな状態で画像を追加する場合に比べて、アップロードに時間が掛かる傾向があります。

従って、ブログの記事に画像を含めて公開する際は、文章を入力する前に先ず最初に画像をアップロードしてください。それから文字を入力し、その後画像をドラッグもしくはコピー&ペーストして、然るべき位置に配置するとよいでしょう。

アップロードする画像について

ブログに公開する画像を予めパソコン内の一角に準備しておきます。その時画像のサイズに注意してください。あまり大きいサイズだと、アップロードするのに時間がかかりますし、アップした Webサーバーの容量を食ってしまうことになります。また閲覧する側も大きいサイズの画像だと、表示に時間が掛かってしまいます。画像(=写真)の大きさは 1280 × 960 ピクセルぐらいを上限のサイズと考えてください。

キレイに載せたい時は、画像のサイズを大きくするのではなく、圧縮率を下げることで対処します。(圧縮率が低ければ低いほど画質は高画質になります。)また、小さすぎる写真も面白みに欠けますから、最低でも 320 × 240 ピクセルぐらいは欲しいところです。

画像や画像解像度、画像圧縮率について詳しくはこちら。〈準備中〉

画像を追加する手順

本文・画像入力欄の上にある画像追加ボタンを押すと、画像を追加するためのウィンドウ(下)が開きます。

  1. ファイルを選択ボタンをクリックして、準備しておいたパソコン内の画像を指定します。
    「別の画像を追加」をクリックすると、「ファイルを選択」ボタンがその度現れ、複数の画像をまとめてアップロードできるようになります。
  2. その画像の配置の仕方を選択します。
  3. なし:
    小さなイラスト・画像などを文字の間や文字の後ろに配置したいときに選択してください。画像をドラッグすることで、文章中のどの位置にでももっていくことができます。また配置後、行揃えの指定・変更も可能です。
    左:
    少し小さめな写真を段落の行頭左端に配置し、その右側に文字を回り込ませたいときに選択してください。配置後は、縦位置のみ変更が可能です。
    中央:
    写真を大きく見せたい時や強調して見せたいときに選択してください。写真は段落の中央に配置され、両脇は余白スペースになります。配置後は、縦位置のみ変更が可能です。
    右:
    少し小さめな写真を段落の行頭右端に配置し、その左側を文字が回り込むようにしたいときに選択してください。配置後は、縦位置のみ変更が可能です。
  4. 掲載サイズを大・中・小から選択します。大のサイズを選択しても、ブログ本文の幅からはみ出すようなことはありません。
  5. 「画像をアップロード」をクリックすると、本文・画像入力欄で画像が見れるようになります。同時にブログ(=ホームページ)のある Webサーバーに画像がアップロードされます。
    本文・画像入力欄から写真を削除したり、最終的に記事を公開しなかった場合でも、一度アップロードした画像はサーバーに残ります。また、同じ写真であっても異なる投稿記事で使用した場合、別ファイル名でサーバーにアップロードされます。できるだけ不要なアップロードをしないことで、サーバー容量の増加を避けるように心がけてください。

※サーバーにアップロードした画像の削除には、別途ファイル転送用アプリケーション(=FTPソフト)とHTMLの専門知識が必要となります。削除を行う場合は自己責任でお願いします。

写真のフチなどの装飾について

公開されたブログの写真には、初期設定で、見栄えを良くするためにフチなどの装飾が施されるようになっています。(本文・画像入力欄では表示されません。)写真のフチなどの装飾の変更や装飾無しにしたい場合は、デザインクロスまでお申し出ください。

ブログの写真の装飾サンプル一覧はこちら。〈準備中〉

13) 動画を追加

画像を追加の時と同じように、ファイルを選択ボタンをクリックして、準備しておいたパソコン内の動画を指定します。

動画タイトルを入力し、利用規約にチェックを入れて、動画をアップロードします。(重いデータはかなり時間が掛かります。)アップロードが完了すると、本文・画像入力欄に動画が表示されます。

アップロードできる動画フォーマットと大きさ(重さ)は、AVI、MPEG、QuickTime、Real、Windows Media で、最大100MBまでです。

公開される動画データは Googleビデオ(http://video.google.com/)のサーバーにアップロードされ、ムービースキン(=ムービー制御パネル)がついた Flashムービー形式となります。

【動画に追加されるスキン】

14) ファイルを追加

PDFファイルなどを公開したい時に使用します。画像を追加の時と同じように、ファイルを選択ボタンをクリックして、準備しておいたパソコン内の PDFファイルを指定します。(ファイルの重さは10MBまでです。)この時、ファイル名が日本語だと文字化けしてしまいますから、半角英数のファイル名にしておいてください。

アップロード先の指定
予めアップロード先となる階層(ディレクトリ)が入力されていますが、その後に必ず file/ と入力して付け加えてください
例えば、予め sample.jp/public_html/blog/ と表示されている場合、後ろに file/ を付け加えて、sample.jp/public_html/blog/file/ としてください。

最後に、ファイル名に変更がある場合は、半角英数でファイル名を変更してアップロードしてください。アップロードして公開されたブログには、PDFファイルへのリンクが張られた「ファイル名(半角英数).pdf 」が載ることになります。(直接 PDFファイルが閲覧できる状態になるわけではありません。)

15) 選択範囲の書式を削除

本文・画像入力欄で入力した文字に対して施した書式設定(大きさ、色など)を削除できます。時折、予想に反した挙動をみせることがあります。


3. ラベルを設定

投稿者は記事に任意のラベルを付けることによって、記事をレベル別に分類することができます。

ブログへ投稿する記事にラベルを付けることで(=レベル設定欄にラベルとなる文字を入力することで)、投稿者と読者の両方がそのラベル別での閲覧が可能となります。記事の内容やテーマ、商材、投稿者別など、自分の考え・方針で任意に分類することができます。(投稿した後にラベルを変更することも可能です。)

また、記事の内容が複数のラベルに当てはまる場合、1つの記事に複数の異なるラベルを付けることも可能です。その場合、カンマ〈 , 〉で区切ってラベルを入力してください。

ラベル設定欄の右側にある「すべて表示」をクリックすると、それまでに設定されたラベルがずらりと下に表示されます。そのラベルをクリックすることで、自動的にラベル設定欄にラベルが挿入され、ラベル設定することができます。(複数のラベル設定もできます。最後にカンマ〈 , 〉が入っても問題ありません。)

なお、公開されたブログにおけるラベルの並び順は指定できません。ラベル名にそって、次の順序で表示されます。
  記号 → 数字 → 英語 → ひらがな → カタカナ → 漢字


4. 投稿を公開

投稿オプション

「投稿を公開」ボタンの上にある「投稿オプション」をクリックすると、投稿オプションが表示され、「投稿日と投稿時刻」が指定できるようになります。(投稿した後に投稿日と投稿時刻を変更することも可能です。)

投稿日と投稿時刻
過去を指定:
過去の投稿として公開されます。(ブログのトップページには掲載されない場合があります。)
未来を指定:
未来の日時を指定して「投稿を公開」ボタンをクリックすると、投稿編集ページに進みます。そこに表示されるアラート(下図)で「今すぐ投稿を公開」をクリックすると、公開の予約(予定)が確定されます。確定された投稿はパソコン上で何もしなくても、指定した未来の日時に自動的に公開されます。(公開前、公開後に記事の修正・編集・削除も可能です。)
なお、必ずしも予約時刻通りの公開とはならない(少し遅れるみたいです)ので、余裕をもった時間を指定してください。

【編集ページに表示される確認用のアラート】

閲覧者のコメント / バックリンク

閲覧者のコメントとバックリンクをこの投稿に対して、許可・禁止の設定ですが、予めブログの制作段階で閲覧者のコメントとバックリンクを表示する設定にしていないと機能はしません。


「グーグル・ブロガーを使いこなす! 個々の機能の説明からお役立ち情報まで」で分からないところがありましたら、デザインクロスまでお気軽にお尋ねください。 (デザインクロスのお客様に限ります。)

 

デザクロ・メモは、デザインクロスが制作・設定などの際に利用・参照可能な情報です

  • 特になし

見出し

本文

デザクロ・メモはここまで。クリックで閉まります

このページ「グーグル・ブロガーを使いこなす! 個々の機能の説明からお役立ち情報まで」の更新履歴

直近の更新履歴

2010-02-10
デザインの変更に伴い、一部記述を見直して公開
2009-07-09
公開

以前の更新履歴

2010-02-10
デザインの変更に伴い、一部記述を見直して公開
2009-07-09
公開

ひとつ前のページにもどる

▲このページの先頭へ