zawazawa official

読みやすい書き方について (Markdown記法)

0 コメント
views
1 フォロー

読みやすい書き方について

文章(テキスト)を長く書くよりも、大きい見出し(タイトル)の次に小さい見出し(タイトル)をつけ
その中に関連した内容を書き、注意を引きたい部分は文字を太字にするなど書き方に工夫を加えると
非常に読みやすいものになります。

Web上のテキストにこういった、見出しをつけたり、太字にしたり装飾を行うことをMarkdown記法といい
ZaWaZaWaでも、コメントやトピック概要にHTMLやMarkdown記法を利用することができます。

Markdownとは

「書きやすくて読みやすいプレーンテキストとして記述した文書を、妥当なXHTML(もしくはHTML)文書へと変換できるフォーマット」として、ジョン・グル―バー(英語版)により作成された。アーロン・スワーツも大きな貢献をしている。Markdown の記法の多くは、電子メールにおいてプレーンテキストを装飾する際の慣習から着想を得ている。

Markdown - Wikipedia

書き方と種類について

HTMLを含めると、非常に多くの種類がありすべてをご紹介することはできませんが
一部、代表的な書き方を紹介します。

🔷🔹 見出し

見出し=タイトルのことで、大きさは大小約6つ程度まで使うことが多いとされています。
文頭に#(ハッシュ)を使います。

#見出し1

#(ハッシュ)1つだけだと一番大きな見出しになり、#(ハッシュ)を増やすことで段々小さな見出しになります。

 # This is an H1
 ## This is an H2
 ###### This is an H6

This is an H1

This is an H2

This is an H6



コメント記入の場合は、コメント記入欄下の「見出し」ボタンからも見出しをつけることができます。
画像1


🔷🔹 強調

強調はテキストの中で、注意を引きたい箇所に利用します。
太字の場合

   太字にします。

太字の部分を**で囲みます。

   **太字**にします。


コメント記入欄の場合は、コメント記入欄下の「B」ボタンからも太字にすることができます。
画像1

🔷🔹 斜字体

斜字体(イタリックの)は以下のようになります。

   イタリックにします。

イタリックは文字が少し傾いたようになります。
イタリックにするには、該当箇所を*で囲みます。

   *イタリック*にします。


コメント記入欄の場合は、コメント記入欄下の「I」ボタンからもイタリックにすることができます。
画像1


🔷🔹 打消し

打消しは、訂正があった場合に使用されます。
修正があった場合、訂正箇所を消して変更すると元の文章に何を書いていたのかがわからなくなります。
そこで、訂正箇所に打消し線を使うことで、変更箇所がわかりやすくなります。

   打消し線はこのようになります。

該当箇所を~~で囲みます。


🔷🔹 下線

文字に下線を引く場合に使います。
但し、文字にリンクを付ける場合、下線がつくことが多くリンクと間違えないように配慮することも必要です。

   文字に下線を引きます。

文字に下線を引きたい場合は「++」で囲むことで下線になります。

   ++文字に下線++を引きます。



コメント記入欄の場合は、下線にしたい場所を選択後、
コメント記入欄下の「U」の文字のボタンから下線をいくことができます。

画像1


🔷🔹 文字の大きさ変更

文字の大きさを、通常の大きさから大きくしたり、小さくしたりすることができます。
変更したい文字を%%で囲み{size:8pt}でポイントの指定を行います。

<14pt指定した場合の書き方>
%%{size:14pt}14ptの文字指定%%はこのくらい

   8ptの文字指定はこのくらい
   10ptの文字指定はこのくらい
   12ptの文字指定はこのくらい
   14ptの文字指定はこのくらい
   16ptの文字指定はこのくらい


文字のサイズを変更したい場合は%%{size:●pt}と書き、「●」の部分に大きさの数字を入れます。

   %%{size:14pt}14ptの文字指定%%はこのくらい



コメント記入欄の場合は、コメント記入欄下の「T↑」ボタンからも太字にすることができます。

画像1


🔷🔹 文字の背景色

文字に背景色を使いたい場合に、背景色を指定することができます。

   文字に緑色の背景色を付ける

上記のようにするには、以下のように書きます。

   %%{bg:lime}文字に緑色の背景色を付ける%%

尚、色の指定については用意されているものの他にも16進数のカラーコードをご利用になれます。
カラーコードについてはこちらの カラーコードリファレンスを参考にしてください。
カラーコードリファレンスを参考に、好きな色で背景をつけた場合は以下のようになります。

   文字に水色の背景色を付ける

コメント記入欄の場合は、コメント記入欄下の「A」に黄色の背景色のボタンからも
背景色をつけることができます。
画像1


🍀 文字の装飾について(複数を一度に使いたい場合は)

文字の文字色、大きさ、太さ、下線、打消し線、背景色などの装飾は、重ねて装飾することができます。
例えば、文字の大きさを18ptにし、文字色を白、背景色を青にする、ということも可能です。

   大きさ:18pt、色:白、背景:青

上記の場合は、以下のように書くことで可能になります。

   %%{size:18pt}%%{fg:white}%%{bg:blue}大きさ:18pt、色:白、背景:青%%%%%%


🔷🔹 リスト

一覧のことになります。
リストには、「・」のようなものが前につくdisk型と、数字がつくdecimal型などがあります。

disk型

  • りんご
  • みかん
  • いちご
  • キウイ

リストの文字の前に-をつけることでdisk型になります。

decimal型

  1. りんご
  2. みかん
  3. いちご
  4. キウイ



コメント記入欄の場合は、コメント記入欄下にある以下のボタンからもリストにすることができます。
※赤く囲んだ右側のボタンがdecimal型、左側がdisk型です。

画像1

カスタムCSSで自由に装飾する

CSSの知識があればグループ、トピック、タグの内容文を表示するスタイルをカスタマイズすることができます。
「グループの管理」から左の「設定」→ 上の「カスタムCSS」タブにて設定してください。

参考 コピペで使えるカスタムCSS

コピペで使えるカスタムCSS
http://zawazawa.jp/css/


こちらの内容は編集途中です。随時追加予定です。

zawazawa運営
作成: 2015/06/17 (水) 14:06:05
最終更新: 2016/07/01 (金) 14:56:26
通報 ...