41 行
2.4 KiB
HTML
41 行
2.4 KiB
HTML
<title>ウェブサイトの設計方針 - 美々蝶々</title>
|
|
|
|
<h1>ウェブサイトの設計方針</h1>
|
|
|
|
<ul>
|
|
<li>2022-12-27 たかし</li>
|
|
<li>最終更新日: 2023-03-04</li>
|
|
</ul>
|
|
|
|
<p>このサイトの設計方針です。わたしは W3M の愛用者だから、テキストブラウザを贔屓します。方針が変化したら、この記事の内容も更新します。</p>
|
|
|
|
<h2>1. 文章を優先</h2>
|
|
|
|
<p>わたしは HTML や CSS よりも文章を重要視します。ウェブサイトの本質は文章だからです。文章の書き方で問題を解決できるなら文章を直します。具体的には、記事を読み辛いと感じたら文章を直し、見た目が物足りないと感じたら文章を書き足します。</p>
|
|
|
|
<h2>2. 見出しを活用</h2>
|
|
|
|
<p>わたしは段落のまとまりを見出しで区切るのが好きです。文章の途中に見出しを置くと、適度な余白ができて、目に優しいと感じます。また、見出しに番号を振ると、紙の本のページ数と同じく、どこまで読んだかが分かり易くなります。だから、時には数字だけの見出しも使用します。</p>
|
|
|
|
<h2>3. ナビゲーションは最小</h2>
|
|
|
|
<p>このサイトにはヘッダーが無く、フッターも最小限です。各文書に共通のヘッダー・フッターを付けると、HTML が大きくなるからです。</p>
|
|
|
|
<p>また、ヘッダーが無ければ本文が最初に来るから、上部に「本文へ」のリンクを付けなくても済みます。</p>
|
|
|
|
<h2>4. CSS について</h2>
|
|
|
|
<p>このサイトの CSS の特徴は次の通りです。</p>
|
|
|
|
<ul>
|
|
<li>見出しを沢山置くから、見出しのフォントや前後の余白は小さくしました。</li>
|
|
<li>読み易い様に、配色は暗めの背景色、白い文字色にしました。</li>
|
|
<li>リンクが分かり易い様に、普通の文字は白、リンクだけ黄色にしました。</li>
|
|
<li>色々な画面幅で読める様に、ページの横幅は可変にしました。</li>
|
|
<li>ブラウザーの設定で好きなフォントを指定できる様に、フォント名・フォントサイズはデフォルトにしました。</li>
|
|
</ul>
|
|
|
|
<h2>以上</h2>
|
|
|
|
<p>たまに自分のサイトのデザインの方針を書く人が居て、わたしはそれを読むのが好きだから、この記事を書きました。全くの無価値ではない筈……</p>
|