はてなブログ開発ブログ

はてなブログからの公式のお知らせを発信します。

記事に見出しを入れてわかりやすく! 編集画面から見出しを簡単に入力できるようにしました

本日、はてなブログの編集画面に、見出し入力補助機能を追加しました。

記事の本文に3種類の大きさの見出し(大見出し、中見出し、小見出し)を簡単に挿入できます。

本文中に大見出し「宮沢賢治とは」、中見出し「ポラーノの広場」、小見出し「一、遁げた山羊」と3種類の見出し表示されている例(※ 2行目の「宮沢賢治の作品について」は記事タイトルです)

見出し入力補助機能の使い方

記事の編集画面で、入力補助ツールバーに新しく追加された「書式」メニューから、見出しを挿入できます。編集エリアに文字を入力して「書式」メニューから見出しレベルを選ぶと、編集中の行が選択したサイズに応じた見出しになります(編集モードが「見たままモード」の場合)。

これまで「見たままモード」で本文の途中に見出しを挿入するには、「HTML編集」画面からh3などのHTMLを直接記述する必要がありましたが、これによってメニューを選択するだけで見出しの追加が可能になりました。

各モードでの扱いと対応するHTML要素

「はてな記法モード」や「Markdownモード」で「書式」メニューを選択すると、それぞれに応じた見出し記法が編集行の先頭に挿入されます。

「書式」メニューの各見出しレベルと各モードの記法、実際に挿入されるHTML要素の対応は次の表の通りです。

書式 はてな記法 Markdown HTML要素
大見出し * ### h3
中見出し ** #### h4
小見出し *** ##### h5

ブログを書くときには、文章のまとまりごとに適切な見出しを入れると、書き手の意図が読み手に伝わりやすくなります。また、検索エンジン最適化(SEO)の観点からも、見出しを使って文章の構造をわかりやすくすることは有用とされています。

あなたの文章をよりわかりやすくするため、見出し入力補助機能をどうぞご利用ください。

その他の変更について

そのほか、以下の機能追加と不具合修正を行いました。

はてなダイアリーからのインポートでタイトルの取り扱いを改善しました

はてなダイアリーからの インポート 機能において、インポートされる記事のタイトル中にはてな記法やHTMLタグがあったとき、タイトルやカテゴリを正しく取り扱えるよう以下の点を修正しました。

  • []を利用したはてな記法がタイトルの先頭にある場合にカテゴリとして処理され、意図しないカテゴリが作成される不具合を修正しました
  • タイトル中のはてな記法やHTMLタグを適切にテキストとして扱うようにしました(はてな記法は展開し、HTMLタグは削除します)

インポート時に上記の不具合が発生されていた方は、お手数ですがインポートをやり直していただくことで解消されます。フィードバックなどでのご指摘ありがとうございました。

YouTubeが貼れない不具合を修正しました(IE9)

Internet Explorer 9を利用している場合に、YouTubeの埋め込みコードを正しく貼り付けられないことがある不具合を修正しました。

前後の記事に移動するリンクにrel属性を付けました

記事下にある「次の記事」「前の記事」といったページャのリンクにrel属性(rel=nextもしくはrel=prev)を付けました。