GRITの「オキグリCommunity」Tweet6沖縄を拠点に活動する二拠点生活フリーライター・編集者みやねえ(@miya_nee3)です。GRIT(略して、オキグリ)」のオンラインコミュニティをスタートしました。コミュニティの中で、無料ブログのプラットフォーム「note」を活用した「#オキグリnote部」を始動。今回は、そのメンバーにも向けた初心者でも簡単に使いこなせる「note活用術!第二弾」として、「noteのブログ術」と「執筆する際のちょっとした裏技」を解説します。アカウント開設と各種設定方法、各ページの説明については、下記のページをご覧ください。スマホで表示を確認する初心者でも使いやすい!noteでブログを書こう無料で使えるブログのプラットフォーム「note(ノート)」の好きな部分を挙げるとすれば、「簡単に使いこなせる・シンプルなデザイン・テキストベース」なところが気に入ってます。個人ブログの制作によく活用されているオープンソース「WordPress」と比較した場合、何がいいのかをツイートでまとめたので参考にしてください。「note」を使う人でも簡単にわかるよう、丁寧・簡潔な解説でお届けします。思ってましたが、今回はやや基礎知識的な専門用語の説明を入れてます。ブログを書くなら「テキスト」を使おうブログを更新する前に。個人アカウントでログインして、パソコン画面の右上アイコンから「マイページを表示」を選択します。」のURLが表示されます。Chromeなどのブラウザで「★お気に入り」に登録しておくと、次に使う時、ネット検索せずに「★お気に入り」から簡単にブログを表示できます。noteのトップページ、またはマイページから、右上の「投稿」をクリックすると、「テキスト、画像、つぶやき、音声、動画」の5項目が表示されます。ブログを更新するには「テキスト」を選択します。次の画面で、このようなページが表示されます。シンプル!ブログ初心者でも直感で使いやすく、わかりやすい構造。使い方を理解できると思います。アイキャッチ画像を挿入するアイキャッチ画像を挿入していきます。私の場合、ブログを書いたあと、最後にアイキャッチ画像を挿入しています。自分で撮影した写真を使用。その画像にテキストを入れたり、複数の写真を合成したり、ブログのタイトルや内容に合うイメージ画像を選んで投稿しています。Web業界では、記事のメインとなる画像のことを「アイキャッチ」や「キービジュアル」などと言います。このnoteではサービス上、「見出し画像」と呼んでいるようです。写真マークをクリックして、「画像をアップロード」を選択。パソコン上で操作するなら、パソコンで取り出せるファイルからアップロードできます。これでアイキャッチ画像の挿入完了。クリックされるかは「記事のタイトル」で決まる記事のタイトルは、読者のクリックを誘導する入口となる大事な要素です。以前は、「Web記事がクリックされるかは、記事のタイトルで9割決まる」とも言われ、情報過多の現代においても、記事が読まれるかは「タイトル次第で7〜8割決まる」と感じています。一瞬で興味を引くタイトルでなければ、記事を読んでもらえません。「記事のタイトルを考えるコツ」を超基本中の基本的な基礎知識として、いくつか挙げておきますね。●意味が伝わるタイトルになっているか●キャッチコピー並みのインパクト●複数のキーワードを盛り込む●数字や語彙力を使って訴求力を上げる●理想的な文字数がある(30文字前後)noteの記事タイトルは、文字数制限がなさそうですね。検索エンジンで表示されるタイトルが「30文字強」です。その文字数を超えると「...(三点リーダー)」に変換されて非表示になります。デバイスの環境にもよりますが、35文字以内に収めるのが無難だと言えます。noteの場合、数多くシェアされたり、PV(ページビュー)が上がると、GoogleやYahoo!などの検索エンジンにも上がってきます。原稿料」のキーワードで検索2〜3位に上ってきてます。この記事に「Web記事の構成」や「記事を書く上での重要なポイント」をまとめてます。見出しの設定(目立たせる、区切り、h3で入力される)noteでは、見出しに設定すると、ソース上〈h3〉タグが使われ、視覚的には大きめの文字サイズ・太字で表示されます。その後、文字をドラッグすると、画像のように文字装飾の操作ができる黒いパーツが現れ、「T」を選択すると「見出し設定」できます。記事を書く上で「見出し」の意味を理解しておきましょう。見出しとは、記事上の区切りでもあり、書籍でいう目次のような役割りです。「見出し=次に説明する文章の要約」となります。大きく話が変わる場面、「○○なグルメ3選」で3つの見出しを使う(1グルメ1見出しで紹介)、このブログのように手順を追った見出しをつける(ナンバリング)など。一般的なブログやWebメディアの場合、CSSや画像でデザインした見出しを使用しています。HTML上では、〈h1〉〈h2〉〈h3〉〜〈h6〉までの見出し用のタグで入力されています。文字の装飾について文章を入力したあと、一部の文字をドラッグすると、文字装飾用の黒いパーツが現れます。「見出し、太字、左寄せ・中央寄せ、リンク、引用符、code」を設定可能。簡単に設定できる分、逆に複雑なことはできません。このシンプルさがnoteの良さでもあり、ブログ初心者でも使いやすいのです。●左寄せ・中央寄せ:横線のマーク●リンク:鎖マーク●引用符:「”」を選択。●code:ソースのコードを入力。「リンク」とは、URLやテキストをクリックして、指定したWebページに飛ばす設定のこと。」テキストにリンクを設定します。「リンクされているテキスト」だとわかるように、文字色を変えたり、アンダーバーを入れたり、視覚的に変化を認識できる状態がベスト。一般的なWebサイトでは、CSSで文字装飾をしています。noteは、アンダーバー付きでリンクを表示。ブログ初心者向けに説明すると、ブログ上に、URLを配置しただけではリンクされません。URLのテキストに「リンク設定」を行って初めて、その該当ページに飛ばすことが可能になります。HTMLですと〈a〉タグ設定ですね。「note」でテキストにリンク設定をする方法は、URLを入力後、その文字をドラッグして黒いパーツの中から「鎖マーク」を選択。上の画像のように「リンク先のURL」を入力するパーツが現れ、URLをペーストしてEnterキー。これでリンク設定完了です。ここ近年では、プラグインを利用して、デザインのような視覚的にも目立つ表示でのリンク設定が可能になりました。画像のような表示になり、noteなら設定方法は簡単です。記事内にカーソルを挿入すると「+マーク」が現れます。画像を挿入する」のように、円マークが出現するので〈〉を選択。緑枠が表示されたら、リンク先のURLをペーストしてEnterキーです。画像を挿入する記事内にカーソルを挿入すると「+マーク」が現れ、写真マークを選択して画像をアップロードします。画像について1点だけ注意点を挙げるならば、「画像サイズの比率を合わせる」ことが大切です。通常のスマホ写真のサイズが「横4×縦3」、一眼レフ撮影だと「横3×縦2」と変わるので、使用する画像の比率を合わせましょう。私の場合、一眼レフ撮影の「横3×縦2」の比率に合わせてます。基本、縦長写真は使用しません。スマホで見た時、全画面を埋めてしまう縦長写真だとインパクトが強すぎることと、パソコン表示のレイアウトが美しくないから、です。余白も大切!「改行とスペースの違い」を理解しよう記事には余白を作る。文章にも余白を残したほうが、読後感の余韻が残るといいます。視覚的な余白に使用するのが「改行と1行分のスペース」です。この余白の違いを理解して、コンテンツ作りに生かしてください。改行は、スマホ表示を意識して視覚的な意味で改行することが多いです。