WordPressは、HTMLを自分で覚えておく必要ない

この記事を読むのに必要な時間は約 21 分です。
(専門用語などにはポップアップする説明をつけているので時間が長く表示されることがあります。
ツールチップの機能については、こちら)

 WordPressで記事を作成する固定ページを作成するランディングページを作成する場合につきまとう HTMLですが、プロになるわけでもなく自社の記事が作成できればいいという方は、覚えなくてもいいでしょう。
そんなものは、あなたが覚えるのではなくパソコンが覚えていればいいのです。
プロになるなら頭の中で HTMLが書けるほどでないと話になりませんが、今は便利なものがたくさんあります。
今日は、その便利なものを紹介しますね

 

目 次

HTMLとは?

HTML
1つ1つのWEBページは、 HTMLによって表示されているのです。
ルールを間違えば意図しない表示になったり検索エンジンから嫌われたりしますね。
中にはそういう面倒なことが大嫌いな人も多いでしょう。
知らないことを今から覚えるのは大変です。
でも間違ったら・・・
って思う人もいると思いますので便利なものを紹介しますね。
全員に覚えられると筆者たちは、職を失うかもしれませんね。(^^;

基本的なHTML

よく使われると思う HTMLを下記に表示します。

ハイパーリンク

見出しタグ

転載や引用文章

段落タグ

箇条書き(リスト)

改行

ここに表示させたタグがすべてではないですが、通常記事を書く時に使うタグになります。
問題は、これらのタグは装飾されていないものもあります。
それは、また別ということです。

HTMLの種類

 HTMLタグには、基本タグ以外に属性というものが存在します。
通常、その属性などを使って装飾などをします。
場合によってそれがSEO対策になる場合もあります。
それが画像を表示するためのimgタグのalt属性やハイパーリンクを指定するaタグのtitle属性だったりします。
また、アメブロなどの場合は、レスポンシブデザインではないためにパソコンとスマホで同じように表示させるために属性を使って スタイルシートで装飾するのが多いですね。
使い方は、下記を参考にしてください。

画像のalt属性

 WordPressは、簡単に設定できますが、アメブロでは、HTML表示に切り替えないと設定ができませんね。

ハイパーリンクのタイトル属性

title属性が検索エンジンのクローラーに引っかかる可能性は高いです。
ただこれを実行してる人は少ないですね。

スタイルシートによる装飾

 WordPressの場合には、style.cssに装飾内容を登録して上記のようにclass属性で指定することが多いです。

部分的な文字の変更などは、上記のような使い方をします。
これは、 WordPressだけでなくアメブロなどでも同じです。

 

プラグイン:AddQuickTag

AddQuicktag
 WordPressだけであればこの プラグインを使うと覚えていなくてもエディタだけで覚えておく必要がないですね。
これだけでも便利なのですが、もっと便利な方法があります。

 

Insert Text

ウェブストア
Inert Textは、 Google Chrome の拡張機能で WordPressだけでなくアメブロにも使うことができるツールです。
正直、これを使い慣れるとなしで書くのが嫌になります。

 

Clippings

Clippings
 Firefox を使っている方には、Inert Textが使えないのでClippingsがおすすめです。
ただInert TextのようにPlainTextでの保存ができないのでテキストモードでの編集になりますが・・・
右クリックで簡単に挿入できるのは同じです。

 

Amecare

Amecare
アメブロユーザーで Google Chrome を使っている方は、Amecareが使えますね。
アメブロにログインした状態であれば他のブログシステムでも動作しますので囲み枠や定形タグを挿入するのに便利です。
アメブロと併用している方は、使わない理由が見つからないほど便利なツールです。

 

まとめ

HTML
いかがだったでしょうか?
ちゃんと登録して使うことでかなり作業効率が改善します。
筆者がこれらを導入して感じたことは、下記の通りです。

  • HTMLの記述間違いがなくなった
  • 作業時間を時短できる

正直、上記2つのおかげでかなり助かってます。
複雑な記述が必要な場合に以前使った場所をあけてコピペして修正していましたが、今はそれが必要ないのです。
その分、作業時間を短縮できています。
どうでしょう?
これらのツールをうまく使いこなしていただけると正直言って HTML スタイルシートなどを覚えていなくても記事は、書けますね。
それだけでなく手入力による場合にたまにある打ち間違いを防ぐこともできます。
プロになるのではなく自社の記事が書けるようになればいい方は、それでいいと思いませんか?


 

WEBのことならくまはちLABにお任せください。

サービス 制作事例
お問い合わせ
くじらモバイル登録
LINE@友だち追加

くまはちLABのご利用ありがとうございます!くまはちLABの最新情報をフォローしてゲットしてください!