ユーザビリティが上がるワードプレスで表（テーブル）の挿入方法

表があると、ユーザビリティがよくなります。ユーザビリティが良くなるとSEO上位表示されやすくなります。なぜなら、ユーザビリティが高い＝みやすい、わかりやすい、使いやすいということで自然とサイトの人気があがるからです。

そして人気があがれば、お客さんの満足度があがり「いいね！ボタン」や「ツイートボタン」などのソーシャルボタンを押してもらいやすくなり、拡散されてアクセスが集まってきます。

一方、ユーザビリティを考えてない自分勝手なサイトは、すぐにサイトを閉じられ離れられてしまいます。当然拡散されることはありません。その結果、サイトの評価が下がってしまいます。

だから、ユーザビリティをとことん高めること。それこそが知られざるSEO対策の本質なのです。昔のようにただ情報を詰め込むだけではいけません。大切なのは読み手に良い印象を与えられるかどうかです。喜んでもらえるかどうかなのです。

では、一体どうすればユーザビリティを高められるのでしょうか。そのために使えるツールがなにかというと、今回お話しする、表（テーブル）になります。

たとえば、スパゲティの作り方のレシピを説明するとき、

「スパゲティを作るには、パスタ500グラムと塩が少々、トマトを１個にバジルを適量を用意しましょう。」と、使う材料と分量を説明せずとも、下表のように ・・・

これなら誰でも一目瞭然ですよね。わかりやすいです。ユーザビリティがあがります。

ということで、今回ここでは、ユーザビリティを高めSEO効果を発揮させる表の作り方をご説明していきます。これを知っていれば余計なことを考えずさくさく効率よく表を作成できます。

私も言葉で説明するのが難しいときに表を使っています。使えば一目瞭然、読みやすくなり便利です。アクセスも当然集まっています。

普段、表なんて使わない、そんなあなたもぜひ使ってみてはどうでしょうか。

なお、先にプラグインのTinyMCE Advancedをインストールし有効化しておきましょう。

インストールしたらTinyMCE Advancedの設定画面でテーブルがあるのを確認しておきましょう。基本初期設定で入っていますが、入ってない場合は追加しておいてください。（ちなみに、テーブルはHTMLのテーブルタグからきています。つまり表を作成するのがテーブルです。）

では、さっそく始めていきましょう。

プラグインのインストール方法は、「SEO!上位表示のプラグイン」を参考にしてみてください。

１、表（Table）の挿入するには・・・

表（Table）の挿入するには・・・
まずは、エディター画面で表を入れたい位置にカーソルを合わせましょう。そして投稿画面のメニューバーにあるテーブルを選択、そのなかの「テーブルを挿入」にカーソルを合わせましょう。

カーソルを合わせると作成したい列と行数に合わせて選ぶことができます。必要なだけ選択しクリックします。上図の場合は、２かける５の表がエディタにできあがります。

選択をしたら、表が出来上がりました。しかし、見ての通りこれはつぶれた表になっています。このままでは入力操作しにくいので、これから一緒に表の大きさをこれから変えていきましょう。

２、表（Table）の大きさの変更しよう

表の大きさの変更方法には二種類あります。

ひとつは自分の手で大きさを変える方法。もうひとつは自動で大きさを変更する方法です。どちらの方法でも構いませんが、ユーザビリティを考慮すると後者の方がいいでしょう。それについては後ほどお話します。

どちらもできるようになっておいた方がいいので、さっそくやってみましょう。

２−１、手で表の大きさの変更するには・・・

自分で表の大きさを変えるには、表を引っぱって目視にて変更を加えるだけです。出来上がった表の右端の、□（四角）を選択し■にしてから、右に引っぱってサイズを調整しましょう。

ちょうどいいところまで引っぱってマウスを放すと、表の大きさが変更されました。

これが一つ目の表のサイズの変更方法です。すぐに文字入力をしたい場合はこのやり方で十分いいでしょう。

しかし、ひとつ問題点があります。それは、この表は大きさが固定された表になっているということです。PCで見るのであれば問題ありませんが、スマホやタブレットでみる際には画面から表が外れてしまう可能性があります。

そうなるとユーザーがスクロールしなくてはならなくなりユーザビリティがさがります。SEOとしてよくありません。

そこで、次の方法です。

２−２、自動で表の大きさの変更させてみよう

スマホに対応させるに表のプロパティから幅を100％に設定しましょう。これをやっておけば、画面が小さくなったとしても、それにあわせて自動で表が小さくなってくれます。

まずは、テーブル→表のプロパティを選択します。

表のプロパティの幅に100％と入力（必要に応じて80％、90％などと変えてみましょう。）

100％表示を設定しておくことで、画面が縮小されてもつねに全体表示させることができます。

以上で表が100%表示されました。画面が小さくなっても自動的に大きさを画面サイズに合わせてくれます。

このように横幅が小さくなっても画面が小さくなっても100％表示させることができます。

３、表（Table）の編集

では、いま作成した表を編集してみましょう。編集を加えることで表がみやすく見栄えがよくなります。またあとから追加したり、削除をすることで簡単に望む表をつくりことができます。

まず、前提知識としてこれを知っておきましょう。ご存知とは思いますが、表には行と列があります。

行は横方向のセルの並びです。上の図の場合、５行あります。

列は縦方向の並びです。上の図では２列あります。

それぞれ追加をして増やしたり、削除をして削ることができます。さっそくやってみましょう。

３-１、行と列を追加するには、削除するには…

では、行と列、それぞれの追加と削除をしていきましょう。

行を追加するには、まず挿入したい行をクリックし、カーソルを合わせます。

その状態でテーブルの「行」を選択。クリックした行の上に行を追加する場合は、「行を上に挿入」を、クリックした行の下に行を追加したい場合は「行を下に挿入」を選びます。

今回は、「行を上に挿入」を選んでみましょう。すると・・・

上側に行が追加されました。同様にして行を削除する場合は「行を削除」を選択しましょう。その他、行を切り取ったり、コピー、貼付けもここでできます。

列の場合は、追加したい行にカーソルをおき、テーブル→「列から列を左に追加」（あるいは列を右に追加）を選びます。

今回は、「列から列を左に追加」を選んでみましょう。すると・・・

列が追加されました。削除したい場合は削除したい列を選び、列を削除を選択します。

４、セルに色を付けてみよう

セルに色を付けるには、まず色をつけたいセルを選択します。これは行でも列でも構いません。

そして、テーブルのセルからセルのプロパティを選択。

セルのプロパティから、詳細タブを選択。そのなかの枠線の色、または背景色のどちらか適当なものを選択します。

色を選びます。ユーザビリティを考えるとあまり派手な色にするとユーザーの目が疲れるので、全体的に落ち着いた色を選ぶといいでしょう。 色を選択したらOKを押します。

枠線の色と背景色をそれぞれ設定し、問題なければOKを押しましょう。

これで選択したセルに色をつけることができました。

５、セルの結合と分割をするには・・・

セルの結合とは、二つ以上のセルをひとつにすることです。これによって見出し（タイトルバー）を設定をすることができます。

５-１、セルを結合させる

セルの結合するには、結合するセルを選択し、テーブル→セル→セルの結合をクリックします。

これで、選択したセルが結合されました。

では次に、結合したセルを分割する方法です。

５-２、セルを分割させる

セルを分割するには、テーブルからセルを選択、そのなかのテーブルセルを分割を選びます。

これで、結合していたセルが分割されました。

６、セルに文字を入力しよう

表ができたら、セル内に文字を入力していきましょう。エクセルなどの表計算ソフトと同様セルを選択し、入力をしていきます。

では次に、セルの文字揃えをしてみましょう。

まず、文字揃えをするセルを選択します。そして、左揃え、中央揃え、右揃えのうち望むものを選びクリックします。

まずは文字揃えをしたい文字をドラッグして囲みます。今回は例として、スパゲティの材料という文字を中央揃えしてみましょう。

ドラッグして囲んだら、中央揃えを選択しクリックします。

今回は、スパゲティを中央揃えをしたため、文字が中央に寄りました。

７、セルのヘッダーと範囲の指定

セルが見出しにあたる場合は、そのセルをヘッダーセルに設定します。これによってクローラーに適切に表の内容を伝えることができSEO効果を期待できます。

またセルの範囲を指定していきましょう。これを使うと「セルの種類」のように設定項目で見出しの設定ができます。これを使うことで、どの範囲が見出しセルかを示すことができます。

また行や列をグループとして扱うことができます。ただしほとんど使用することはないが、SEO効果を上げたい場合は意識して設定してみましょう。

８、行の種類の指定

セルだけでなく行についても種類を設定することができます。

ヘッダーセルを選択するとそれが見出しになります。また設定後は太字になります。

このヘッダーセルにつけたことが表の題名にもなりますので、検索されたいタイトルにすることがSEO的にも重要です。

・・・

以上がワードプレスでの表の作り方、いかがでしたか。

最初は面倒くさいかもしれませんが、一度できれば二回目からは簡単です。何も考えずにすぐに作れるようになります。

最初にもお話した通り、表を使う目的はユーザビリティを上げること。そして読み手に使いやすく見やすい良い印象を抱いてもらうことです。喜んでもらえるサイトを作れば自然とサイトの人気が上がります。

見た目にもいいですよね。この記事に書いてあることを何度も見ながらやってみてください。

私も表を作って楽しんでやってます。表があれば他のサイトにはない魅力をだせます。

さぁ、表をつくってSEO上位表示を目指していきましょう。