ブログの記事作成でチュートリアル記事を書きたい場合が多いと思います。
ワードプレスや他のCMSの利用をしていると、疑問が出てきてその度検索して、実際に試して解決するっていうことが本当に多いです。
それを自分と同じように、困っている人のためによりわかりやすく記事にまとめることでたくさんの人の疑問を解決することができるようになります。
ところが、エディタを開きまっさらな入力画面で早速つまづいてしまう、なんて人も多いのではないでしょうか。
そんな人のために、実際私が行っているチュートリアル記事の作成方法を公開したいと思います。
基本的な環境として、WordPress、Google Chrome、PC系記事作成を想定していますので参考にしてください。
パターン1 画像先行型
画像先行型の記事作成は、プラグインの解説やPCやPCソフトの操作方法などほぼやり方が決まっているような場合に活用できます。
下のリンクの記事は、私が実際に画像先行型で書いた記事になります。どのような感じか見てみてください。
【簡単10分】ECS LIVA ZのメモリとSSDの増設方法と手順【分解写真付き】
1.チュートリアル用の手順にスクリーンショットでガンガン作っていく。
まずは手順通りに画像の準備をしましょう。
料理などはカメラで順番に撮影していきます。
PCやプラグインの操作などは、スクリーンショットでどんどん保存していきます。
スクリーンショットでおすすめなのは、次のブラウザの拡張機能です。
Awesome Screenshot: キャプチャーと注釈
優れている点として、ただスクリーンショットを行うだけではなく、ブラウザ上で文字や線や図形を書き込めるところです。
これにより、保存した画像を別のPhotoshopなどで編集することなくそのまま追加できます。
ご紹介したのはGoogle Chromeのアドオンですが、他のブラウザを利用する場合は文字などの書き込みをブラウザ上で完結できる物を選ぶと良いでしょう。
2 .保存した画像ファイルを全てアップロードする。
どんどん保存して行くと名前にいちいち連番をつけなくても自然と手順通りの画像のならびになっています。
または保存時間などで並び替えても良いです。
全て選択して一気にアップロードしてしまいましょう。
3.下書き記事に手順どおり画像を入れていく
投稿の編集で、画像を順番に追加挿入していきます。
各ブログによって見せ方がありますが、WordPressであれば、画像のサイズや右寄せやセンター揃えも簡単に指定できます。
画像も一覧で表示され、アップロードした順で並んでいるので、先頭から追加していきます。
うっかり該当画像一括で選択して追加すると、画像の並びが逆順になってしまっているかもしれませんので、その点だけ注意しましょう。
4.手順の説明文を画像の前後に記述する。
各ブログによって、画像を見せてから文章を入れるか、文章を入れてから画像を見せるか別れるかと思いますので、自分の好きな方で構いませんから、手順の説明文を入力していきます。
画像の前後に説明文を入れますが、読んでいる人が理解しやすいように記事内では統一した方が良いです。
また、「下記の画像のように」や「上記の画像を見てみると」など必要に応じて加えるとさらに理解しやすくなると思います。
5.手順の見出しタイトルをつける。
簡単な記事だと画像1枚で、1つの手順になっていると思います。
その画像と説明文に適した手順の見出しタイトルを考えてつけましょう。
後述の段落整理にてヘッダータグをつけて行くので、基本は画像と説明文が1つの手順になりますから、その直前に見出しタイトルを入力しておきます。
6.段落を整理する。
手順タイトルを選択しヘッダータグを入れます。
文章構造について、基本的には次の通りになると思います。
- H1 記事のタイトル
- H2 見出し2 大タイトル
- H3 見出し3 大タイトル内のくくりの中の小タイトル
よほどのボリュームにならない限り、見出し4や5まで使うことは滅多にありません。
この記事で言うならば、「パターン1 画像先行型」が見出し2で、その中の手順のタイトルが見出し3に指定しています。
段落の整理の際には、読み手にとって読みやすく自然な流れを作るようなイメージを心がけてください。
7.前書き後書き＆タイトルをつける。
必要に応じて、前書きや後書きを追加しましょう。
構造としては、見出し2を使い手順文章＆段落から独立させます。
冒頭の書き出しや掴みの文章、最後にまとめとしてコメントを書くのが良いと思います。
タイトルについては、記事のネタを思いついた時にすぐつけても良いでしょうし、記事が完成してからSEOを意識しつつつけても良いでしょう。
お疲れ様でした。
パターン2 ざっくり手順書き出し型
ざっくり手順書き出し型は、決まった方法が無いような事柄について書く場合に活用できます。
例えば、自分なりの方法論を紹介する場合など当てはまります。
まさに、今読んでいただいている本記事がこのざっくり手順書き出し型で書いた記事です。
簡単で効率的なチュートリアル記事の作成方法
1.メモなどに大まかに手順を書き出す。
ネタを思いついた時点で、メモなどに箇条書きで構いませんから書き出してしまいます。
自分なりの何かについての考えや方法なので、忘れないうちにメモしておきます。
箇条書きで書いておくことによって、そのまま目次や見出し文に使えます。
私はMac＆iPhoneでブログ作成をしているので、iPhoneの標準アプリである「メモ」を活用しています。
iCloudに保存すれば、Mac＆iPhone間で随時同期して反映してくれるのでとても便利です。
Windowsでも執筆作業をするのであれば、「Simplenote」というアプリもおすすめです。スマホ＆パソコン問わずクラウドで同期できるので、重宝していますよ。
2.手順の説明文を記述して行く。
手順に応じてふさわしい説明文を書きます。
自分の考えを文にすることになりますから、不要な文章はしっかり省いて読みやすくします。
例えば、本段落の「2.手順の説明文を記述して行く。」の書き始めを、「では次に、前述で書き出した手順に応じてふさわしい説明文を書きます。」にするといささか助長気味になります。
言いたいことは言う、言わなくてもいいことは言わないをしっかりメリハリをつけ、簡潔にまとめるようにします。
3.手順に抜け漏れや追記、順番の変更を検討する。
自分が考えた手順通りに不備が無いか検討してみます。
細かく分けすぎたり大雑把すぎたりしないようにしましょう。
4.必要な画像を準備して、該当箇所に挿入。
必要ならば画像を追加します。
段落毎におしゃれだけど本文に全く関係無い写真を入れるのはやめておきましょう。
読みづらいしわかりづらいだけです。
5.段落を整理する。
一度通しで読んで、不要な段落やまとめた方がいい文章などをチェックします。
改行するべきか、続けて書くべきかは、自分が通しで読んでみて読みやすいかどうかで判断すると良いです。
マーカーなどで装飾することも、このときまとめて行ってしまいましょう。
6.前書き後書き＆タイトルをつける。
必要に応じて、前書きや後書きを書きます。
記事タイトルをつける際には、必ず検索キーワードを盛り込み、簡潔にわかりやすいタイトルにするように心がけます。
さいごに
以上、簡単で効率的なチュートリアル記事の作成方法の説明でした。 続きを見る
私の記事作成の方法をまとめましたが、大筋の通りの順番で一つのまとまった記事が出来上がります。
プラグインなどの記事を書く時や不具合の対処法の記事を書く時などは、操作と並行してスクリーンショットをどんどん撮っています。
そうすることで、自身の為にもなりますし、また他の誰かの為の記事を作成する材料にすることができます。何より時間が短縮できますから、より伝えやすい文章を考えることに時間を有効活用することができます。
自分の考えや方法論は、メモに書いてもそのままにしてしまっていたりしませんか？そのまま見出しをつけて記事にして書いちゃってみましょう！同じような記事があっても気にしないで大丈夫。あなたの気づいたポイントを知りたい人はたくさんいますからどんどん記事にしてしまいましょう。
ぜひ活用してみてくださいね。
ブログの作り方完全ガイド
