tsuyu-note

めんつゆが買ったものとか勉強したことをつらつら書くよ。

はてなブログの書き方 その1

はてなブログの基本的な書き方を初心者なりにまとめてみました。よかったら参考にしてください。

 

はてなブログの書き方

f:id:mentsuyu-san:20190530210046p:plain

はてなブログの書き方をまとめました。

※当記事ではパソコンを利用して、編集モード「見たままモード」での記事の書き方を説明しています。

f:id:mentsuyu-san:20190530222544j:plain

見出し

f:id:mentsuyu-san:20190530210900p:plain

見出しとは

「あるまとまった文章の内容をひと目でわかるようにしたもの」です。タイトルが文章全体を表しているのに対し、見出しは一部分を表しています。見出しがあることによって、読み手が全体の構成を俯瞰しやすくなり、読みすすめてもらいやすくなります。

見出しで文章を読みやすくするより、わかりやすかったので引用させていただきました。

 

画像の赤枠部分が見出しですね。

f:id:mentsuyu-san:20190530212051p:plain

 

見出しがないと下のような感じになり、読みづらい記事になってしまいます。

f:id:mentsuyu-san:20190530213616p:plain

 

見出しのつけ方

見出しをつけるには、見出しとなる文字列を入力し、左上の「見出し」を選択します。

f:id:mentsuyu-san:20190217104149j:plain

 

プルダウンが表示するので、標準以外の大見出し、中見出し、小見出しの中から選択します。

f:id:mentsuyu-san:20190217083833j:plain

 

目次

f:id:mentsuyu-san:20190530220257j:plain

【イエベ秋】おすすめのチーク - tsuyu-noteの目次です。

 

目次とは

目次は見出しと同様に、記事の構成を読者に知らせる役割があります。そのため目次は記事の上の方に設置することが多いです。

例えば上の目次の場合だと、目次を見ることによって「クリニークのチークについて書いてあるから、読んでみようかな」と読者に思わせることができるわけですね。

上で見出しに関して書きましたが、記事内に挿入したすべての見出しが目次に使われます

 

見出し

f:id:mentsuyu-san:20190530220332j:plain

 

目次

f:id:mentsuyu-san:20190530220344j:plain

 

目次のつけ方

目次を挿入したい場所(おそらくブログの上の方)までスクロールします。

ここで目次アイコンf:id:mentsuyu-san:20190217091350j:plainを選択して挿入。

※箇条書きアイコンf:id:mentsuyu-san:20190217090322j:plainと似ているため注意!

 

「:contents」の文字が入れば完了です。

目次には見出しとして設定した文字列が、こんな感じで表示します。

 

箇条書き

f:id:mentsuyu-san:20190530214153p:plain

 

箇条書きにしたい項目を下のように改行して書きます。

大見出し
中見出し
小見出し

 

それを範囲選択し

f:id:mentsuyu-san:20190217091713j:plain

左上のf:id:mentsuyu-san:20190217090322j:plain、またはf:id:mentsuyu-san:20190217090409j:plainを選択すると、

範囲選択した部分が、箇条書きとなります。

 

f:id:mentsuyu-san:20190217090322j:plain選択の場合は、以下のように中点で各項目を表示します。

  • 大見出し
  • 中見出し
  • 小見出し

 

f:id:mentsuyu-san:20190217090409j:plain選択の場合は、以下のようにナンバリングされた状態で表示します。

  1. 大見出し
  2. 中見出し
  3. 小見出し

 

プレビュー表示

f:id:mentsuyu-san:20190530220458j:plain

プレビュー表示することによって、記事を公開したときに、記事がどう表示するかを確認できます。

 

プレビュー表示の仕方

編集画面左上のプレビューを選択します

f:id:mentsuyu-san:20190217092911j:plain

 

画面が切り替わり、ブログを保存、公開した時の表示を確認できます。

f:id:mentsuyu-san:20190217093558j:plain

 

 スマートフォン版のプレビュー表示も可能です。

f:id:mentsuyu-san:20190217093751j:plain

 

左上の「編集 見たまま」をクリックすると、元の編集画面に戻ります。

f:id:mentsuyu-san:20190217093854j:plain

 ↓

f:id:mentsuyu-san:20190217094039j:plain

 

 画像を添付、文章中に挿入

f:id:mentsuyu-san:20190530220834j:plain

「+写真を投稿」を使用

右上の+写真を投稿を選択します。

f:id:mentsuyu-san:20190217095507j:plain

 

投稿した画像を選択し、右下の開くを選択します。

f:id:mentsuyu-san:20190217095551j:plain

 

写真の投稿が始まり、数秒で完了します。

f:id:mentsuyu-san:20190217095652j:plain

 

編集画面のカーソルのある位置に画像が挿入されます。

あとはお好みのサイズに変更するなり、移動するなりしましょう。

f:id:mentsuyu-san:20190217095833j:plain

 

一度投稿した画像をもう一度使用するには

右側の写真のリストから、使用したい画像を選択します。

下のほうにある選択した写真を貼り付けを選択します。

 

f:id:mentsuyu-san:20190217100031j:plain

 ↓

f:id:mentsuyu-san:20190217082744j:plain

 

編集画面にドラッグアンドドロップ

デスクトップなどからドラッグアンドドロップしても、写真を添付することができます。この方法だと複数の画像をまとめて投稿できます。(ただし表示順番は指定できないので注意です)

f:id:mentsuyu-san:20190530221349j:plain

 

f:id:mentsuyu-san:20190530221344j:plain

 

 

まとめ

今日は見出し、箇条書き、写真の貼り方という基本の操作をまとめました。

ブログを始めたばかりでまだ勉強中なので、また学んだことがあったら記事にしたいです。

 

2019.2.23追記

はてなブログの書き方 その2です。

はてなブログの書き方 その2 - tsuyu-note

 

2019/5/30追記

記事を全体的に見直し、修正しました。 


www.tsuyu-note.jp