今回はブログをやる上で「超必須ブロック」のうちの１つ、「画像ブロック」について解説します！超重要なブロックなので絶対マスターしてください。
流れとしては まず最初に「画像を使うときのルール」を解説して、次にブロックエディタでの画像ブロックの使い方を説明します。
「画像」要素とは
まず、「画像を使うときのルール」についておさらいしておきましょう。すでに知ってるよという人は飛ばしてください。
「画像要素(<IMG>タグ)」とは「超必須ブロック」の３体のうちの１つです！(残りは見出し:Hと段落:p)
「画像要素(<IMG>タグ)」の役割はずばりビジュアル担当！記事に彩りを与えます！SEO的にはあまり影響力がなさそう？ただのお飾り？そんな風に見えるかもしれませんが、しかし！しかし！実はSEO的にものすごく影響力を持つ要素なんですよ。なのでしっかり使い方を覚えてください！
以下、「画像」の使い方のルールを説明します。
【ルール１】画像は１記事につき最低１枚は載せよう！
先ほど述べたように画像はとても重要な要素です。必ず記事に挿入しましょう！
アメリカのSEOコンサルタントJason McDocald氏は１記事に最低１枚は画像を載せることを推奨しています。
【ルール２】「Alt テキスト (代替テキスト)」を必ず付ける！
画像には必ず「Alt テキスト (代替テキスト)」を付けましょう！
「Alt テキスト (代替テキスト)」とは画像が表示されないときに代わりに表示される文字です。つまり画像を言葉で表したもの。あまり意味がなさそうですがあなたが思ってる以上に検索エンジンはこれを重要視しています。面倒なので付けない人が多いですが、付けると付けないとではSEO的に大きな差が出るので画像には必ず「Alt テキスト (代替テキスト)」を付けましましょう！
【ルール３】「Alt テキスト (代替テキスト)」はキーワードを意識！
「Alt テキスト (代替テキスト)」を付けるときはキーワードを意識して付けるといいです！
ブロックエディタでの画像ブロックの使い方
それではブロックエディタで画像ブロックを使う練習をしてみましょう。使うのはAFFINGER6(アフィンガー６)のブロックエディタです。
画像ブロックの呼び出し方
まずは画像ブロックを呼び出してみましょう！
記事編集画面を開いてください。"画像ブロック"は左のパネル(パーツ倉庫)にあります。左上の"ブロックインサーター"ボタンを押してください。ブロックパネルが展開します。
パーツがたくさんある中の"メディア"というエリアを見てください。写真のアイコンがあると思います。これが"画像ブロック"です。これをクリックします。すると真ん中の作業画面に"画像ブロック"が追加されます。
画像をアップロードする
画像を挿入してみましょう。
アップロードボタンを押します。すると選択画面が出てくるのでアップロードしたい画像を選んで"開く"ボタンを押してください。すると画像がアップロードされ作業画面に画像が反映されます。
すでにアップロードした画像を再利用する場合は"メディアライブラリ"から画像を選択します
Alt テキスト (代替テキスト)を入力
最後にAlt テキスト (代替テキスト)を入力します。
Alt テキスト (代替テキスト)はどこで入力するのかというと右のパネルです。右のパネルのブロック側に"代替テキスト"という場所があります。ここにAlt テキスト (代替テキスト)を入れます。
- 右上の 設定ボタンを押してください。右パネルが展開します。
- 「画像ブロック」をクリックして選択します。
- パネルをブロックに切り替えます。すると画像ブロックの編集画面が出てきます。
- 代替テキストというところにAltテキストを入力します。
「画像ブロック」の基本的な使い方はここまでです。初心者の人はここまでで十分です。