Top > ガイドライン
|
ガイドライン の変更点
* ガイドライン [#guideline_top]
&attachref(./bnr_wiki_guidelines_rev2.jpg,nolink,50%);
編集の際に役立つPukiWiki記法のまとめと、
このwiki固有の注意事項を記載しています。&br;
編集ルール・方針については[[編集方針話し合い]]を参照してください。
* 基本記法 [#basic]
実際の書き方は、サイト上部の編集リンクをクリックしてご確認ください。
** テキスト装飾 [#text]
|記法|表示|
|''テキスト''|''太字''|
|'''テキスト'''|'''斜体'''|
|%%テキスト%%|%%取り消し線%%|
|COLOR(red):テキスト|&color(red){テキスト};|
|BGCOLOR(yellow):テキスト|背景色付きセル（テーブル内のみ）|
** 見出し [#heading]
#pre{{
* 大見出し(H1)
** 中見出し(H2)
*** 小見出し(H3)
}}
H4より下の見出しはありません。&br;
見出しにアンカーIDを付ける場合は以下の形式。
#pre{{
* 見出し [#anchor_id]
}}
意味のあるアンカーIDにしたほうが、
後々、ページ内リンクを作る際に便利です。
** リンク [#link]
#pre{{
[[ページ名]] 内部リンク
[[表示テキスト>ページ名]] 別名で内部リンク
[[表示テキスト>https://...]] 外部リンク
}}
** テーブル [#table]
#pre{{
|列1|列2|列3|
|データ|データ|データ|
}}
ヘッダー行（背景色付き）にするには `h` を末尾に付ける。
#pre{{
|列1|列2|列3|h
}}
列幅・配置の指定は `c` 行で行う。
#pre{{
|LEFT:200|CENTER:|RIGHT:|c
}}
セルの結合は `>` で右隣と、`~` で下と結合できる。
** 折りたたみ（region） [#region]
#pre{{
#region(ここをクリック)
折りたたむ内容
#endregion
}}
** コードブロック（pre） [#pre]
#pre{{
#pre{{
ここにコードや整形済みテキスト
}}
* 画像のアップロード方法 [#image_upload]
&attachref(./EnFQHxCWEAcamSB.jpg,nolink,50%);
''⚠️ 注意：手順を守らないと別の画像が上書きされるバグがあります。''&br;
このwikiでは、編集画面のプレビューからattachrefを保存せずに画像をアップロードしようとすると、
''そのページの1番目に添付されている画像が上書きされる''という不具合が確認されています。&br;
必ず以下のいずれかの手順でアップロードしてください。
*** 手順A：先に記述を保存してからアップロード（推奨） [#upload_a]
#pre{{
&attachref(,nolink,50%);
}}
+ 編集画面上記の書き方を記述する
+ ''一旦、記事を保存する（ここ重要）''
+ 保存後のページに表示される添付リンクをクリックしてアップロードする
パーセンテージの部分は実際の画像表示を確認して、
適宜調整してください。
*** 手順B：上部メニューの「添付」からアップロード [#upload_b]
複数の画像をまとめてアップロードしたい時に便利です
#pre{{
&attachref(./ファイル名.jpg,nolink,50%);
}}
+ 編集画面でファイル名を含む上記の書き方を記述する
+ 記事を保存する
+ ページ上部メニューの「添付」からアップロード画面を開く
+ ''手順1で書いたファイル名と同じ名前''のファイルをアップロードする
*** attachrefの基本記法 [#attachref_syntax]
#pre{{
&attachref(./ファイル名.jpg,nolink); 標準サイズで表示
&attachref(./ファイル名.jpg,nolink,50%); 50%で表示
&attachref(./ファイル名.jpg,nolink,320x100); ピクセル指定で表示
ブラウザの画像表示の仕様上、
100%や50%、25%、12.5%のような、2の累乗（1/2nの倍数）で指定すると、
クッキリハッキリ画像が表示されます。
画像を制作する場合、1280px x 720px が一番編集しやすく、使い勝手が良いです。
さらに専門的な話をすると、あえて表示したい大きさの2倍、4倍の画像サイズで作って
50%、25%に縮小して表示させると、スマホ画面では、そのまま表示するよりも綺麗に表示されます。
（Retinaディスプレイや最近のスマホディスプレイの仕様）
}}
`nolink` を付けると画像クリック時のリンクを無効化できる。
省略すると画像が別タブで開く。
*** 画像をリンクにする（クリックでページ遷移） [#image_link]
バナー画像をクリックしたら該当ページに飛ぶ、という使い方。
ウォーフェアのゲームモード一覧やオススメ記事バナーで使っている形式。
#pre{{
[[&attachref(ファイル名.jpg,nolink,640x160);>リンク先ページ名]]
[[&attachref(ファイル名.jpg,nolink,640x160);>https://外部URL]]
}}
''具体例''
#pre{{
[[&attachref(map_cracked.jpg,nolink,320x100);>焦土]]
[[&attachref(bnr_f45a.jpg,nolink,440x250);>F-45A戦闘機]]
}}
|記法|用途|
|`&attachref(...,nolink,50%)`|そのページに添付した画像を表示するだけ（リンクにできない）|
|`&attachref(...,nolink,50%)>リンク先ページ名`|画像をリンクにしたい時はこちらを使う|
`nolink` は画像単体クリック時の別タブ展開を防ぐためのオプション。&br;
リンク先への遷移はそのまま機能するので、バナーリンクには必ず付けておくこと。
* 動画の埋め込み方 [#w1e72322]
** YouTube動画の埋め込み方 [#y1581005]
動画URLは必ず「 https://www.youtube.com/watch?v={動画ID} 」の形である必要があります。
ショート動画であっても、必ずこの形にしないと再生されません。
#pre{{
通常の動画の場合
#youtube(https://www.youtube.com/watch?v=UIVHbcd-VUg);
ショート動画の場合
#youtube(https://www.youtube.com/watch?v=UIVHbcd-VUg,518x920);
}}
regionなどで格納した場合、（画面幅が変わるので）サムネイル画像がボヤけるようです。
画面サイズを明示的に指定すれば改善できるかもしれませんが、詳しくはわかりません。
* このwiki固有のルール・お作法 [#wiki_rules]
** アンカーIDの付け方 [#anchor_id_rule]
見出しのアンカーIDは、PukiWikiの編集画面でページを新規作成した際に
自動生成される8文字のランダム文字列を使うのが慣習。&br;
手動で付ける場合は `[#わかりやすい名前]` でも問題ない。
とりあえず自動生成で原稿作っといて、
他ページからリンク貼りそうな見出しだけ、
意味のあるアンカー名に整理するのが良いと思います。スピード優先。
** 画像ファイルの命名規則 [#filename_rule]
以下は筆者のマイルールなので、
必ずしも守る必要はありません。
ただ、ある程度の規則性があった方が、
後々、整理する際に楽になります。
- 乗り物バナー: `vehicle_乗り物名.jpg`（例: `vehicle_f45a.jpg`）
- マップバナー: `map_マップ名.jpg`（例: `map_cracked.jpg`）
- 記事バナー: `bnr_記事名.jpg`（例: `bnr_merit_system.png`）
- スクリーンショット: `sc_連番.png`（例: `sc_1919.png`）
画像を差し替える際は`ファイル名_rev数字.jpg`（例: `bnr_f-45a_rev2.jpg`）のように書くと、
後で差し戻したり、プレビュー画面で比較検討するのがやりやすいです。
*** 画像はなるべく圧縮しましょう [#cfbb1717]
このWikiは、700KBまでの画像がアップロード可能ですが、
700KBギリギリに収めるのではなく、可能な限り、ファイルサイズを圧縮してください。
ページの読み込み速度に直結します。&br;
以下のサイトで圧縮するのがオススメです。業務でもよく使われます。
Google社が開発した画像圧縮サービス「Squoosh」
https://squoosh.app/
* 編集でよく使うテンプレート [#templates]
** 新規ページの基本構造 [#template_page]
#pre{{
* ページタイトル [#anchor]
#youtube(https://www.youtube.com/watch?v=XXXXXX);
↑ページを説明する動画。出来るだけ、あった方が望ましいです。
画像よりも、動画がページ上部にあるほうが、SEO対策の観点で有利です。
&attachref(,nolink,50%);
↑ページを説明する画像。出来るだけ、あった方が望ましいです。
ユーザーは文章を一文字も読まない前提で、画像で説明するのがWEBサイトの基本です。
一言でページ内容を説明するデスクリプション。3行以内、120文字以内が基本。
SEO対策の観点から、書いたほうがいいです。
Googleとかの検索順位が上がります。
** セクション名 [#section]
内容
結論をなるべく一番上に書いてください。
記事全文を読んでほしい気持ちはよく分かりますが、
多くのWEBサイトで、ユーザーは1スクロールもせずに離脱します。
あなたが一番伝えたいことは、スクロールしなくても見えるようにしましょう。
* 関連記事 [#related]
[[ウォーフェア]] | [[関連記事名]]
* コメント [#comment]
#pcomment(,reply,20,)
}}
** テーブルの基本形（色付きヘッダー） [#template_table]
#pre{{
|BGCOLOR(#555):COLOR(white):|200|200|c
||''列1''|''列2''|h
|行1|データ|データ|
|行2|データ|データ|
}}
* 読みやすい文章の書き方 [#readable_paragraphs]
Wikiは「読んでもらえて初めて価値が生まれる」メディアです。
どれだけ丹念に調べた情報でも、読みにくければ届きません。
#br
ここでは、筆者が過去に読んだ文献をもとに、
普段から心がけている、読みやすい文章のコツをまとめます。
** 【最も重要】文章は「足す」より「削る」ことに価値がある [#q6480cf8]
これが最も重要であり、一番伝えたいことです。
名言・名文の多くが短いのは、
文章を削る作業を経た結果です。
#br
''「いきなり核心に入る」「削れる言葉は徹底的に削る」''ことが
簡潔な文章の条件として挙げられています。
『[[文章力の基本>https://www.flierinc.com/summary/29]]』（阿部紘久）より
#br
草案が長くなるのは自然なことです。
重要なのは、そのあと。
''草案の文章を削ること（推敲）をセットで考えること''です。
#br
書き終えたら一度、時間を置いてから読み返しましょう。
声に出して詰まる箇所、なくても意味が通じる一文、
同じ内容の繰り返しは思い切って削ってください。
#br
''読みやすい文章は、継ぎ足しではなく「読者への配慮」で決まります。''
''読みやすい文章は、「読者への配慮」で決まります。''
** 3の法則 [#w385d876]
人間は3つ前後の情報が最も覚えやすく、整理しやすいとされます。
過去、多くの宗教本でも「3」を神聖なる数字として扱ってきました。
「三学」「三世」「三法印」など。
#br
編集では次の通り、「3の法則」を意識してみましょう。
#br
-改行：3行前後で一度改行を入れる
-箇条書き：項目は3つが理想。それ以上になる場合は項目を削るか、別の段落に分けることを検討。
-テーブル：列数は3列を目安にする
文化庁の公用文ルールでも、論点が3つ以上並ぶ一文は
箇条書きに直すことが推奨されています。
[[文化庁『公用文の考え方（建議）』8ページ目 3 文の書き方>https://www.bunka.go.jp/seisaku/bunkashingikai/kokugo/hokoku/pdf/93651301_01.pdf]]
#br
特に、項目が7つを超える箇条書きは詰め込みすぎのサインです。
グループ分けして2つに分けられないか、まず考えましょう。
** 二重括弧は控えましょう [#s959cbe6]
括弧の中にさらに括弧を入れると、どこまでが本題で
どこからが補足なのか、読み手は一瞬で判断できません。
#br
文章そのものを書き換えて、
カッコが必要ない粒度まで文章を抽象化しましょう。
#br
-悪い例：○○は（△△（条件付き）を除く）使用できる。
-良い例：○○は使用できる。ただし、△△（条件付き）を除く。
#br
伝えたいことが2つ以上あるなら、
括弧で一文に押し込まず、文を分けましょう。
** 否定形の乱用は控えましょう [#ke5cbeda]
否定文は、読み手が頭の中で一度「否定→肯定」に
変換してから理解する必要があり、その分だけ
読解処理の負荷がかかります。特に二重否定は誤読の元です。
#br
『リーダブルコード』（オライリージャパン出版）
第7章 「[[制御フローを読みやすくする>https://tech-lab.sios.jp/archives/34560#72ifelseburokkuno_bingbi_shun]]」から一部要約。
#br
-悪い例：この武器は弱くないこともない。
-良い例：この武器は弱い。
#br
-悪い例：条件を満たさないと解放されない。
-良い例：条件を満たすと解放される。
#br
-悪い例：不可能ではない。
-良い例：可能。
#br
可能な限り、言いたいことを
そのまま肯定形で言い切りましょう。
#br
自信がなくて、断定を避けたい気持ちはわかりますが、
Wikiは正確さが最優先です。間違ってたら後で修正すれば良いんです。
誰もあなたを責めません。どうか、勇気をもって。
** 1行の文字数に気を配りましょう [#e7dc182b]
日本語の横書きは、1行20〜35文字程度が最も読みやすいとされます。
これを超えて長くなるほど行の先頭を見失いやすくなります。
#br
- 一文を短くする
- 読点「、」が続きすぎたら分ける
- 必要なら改行する
#br
これらのことを意識すると、最後まで読みやすくなります。
** AIに下書きを書かせるのもアリです [#z05dda09]
この文章の下書きも、実はAI（Claude Sonnet 5）に考えてもらっています。
#br
AIは学習データの性質上、多くの人にとって読みやすい文章を
生成する傾向があります。それを自分の言葉で校正するだけで、
8割方は読みやすい文章が完成します。
#br
「一から自分で書く」ことにこだわりすぎず、
下書きを作らせて、事実確認と表現の調整に
自分の時間を使う、という書き方もおすすめです。
#br
読みやすさは才能ではなく技術です。
これらの文章校正のルールを意識するだけで、
誰でも今日から、読まれる文章に改善できます。
* コメント [#comment]
#pcomment(,reply,20,)
|
