バカネコ日記

フリーページ

2005年01月31日
XML
カテゴリ:バカネコPC講座
バカネコ村の記事を検索する
楽天に限らず、ブログの既定の文字は小さすぎる。
読みにくいから、読む気にならないことも多い。
これではアクセスが上がるわけはない。

小さい文字を使って、小さく感じさせないテクニックは、あるにはある。
HPではよく使われるが、デザインと文章の作り方に相当気を使う。
だが、ブログでそんなことを、いちいち気にしていたら、書けたものではない。

というわけで、今日のバカネコ講座は、行間と文字を大きさの調整を
再び、とりあげてみる。

方法はいろいろある。
ずっと以前にも、字を大きく、行間を広くする方法を紹介した。
<span style="line-height: 180%"><font size="3"> と、
</font></span> で、本文を挟む方法である。

なぜ、字を大きく行間を拡げた方が良いか、その理由や効果については
「ページを読みやすくする方法」を参照していただきたい。 実際の比較表示もある。

【仔猫の里親募集中】

 ↑この子猫の里親を募集しています。

本文中で、文字の色や大きさを、指定する人も多い。
フォントタグがあると、混乱するかもしれないから、
いっそ、フォントタグをやめてしまおう。

今回は、もう少し、細かく調整できて、タグひとつで済むようにしてみる。
以下のように書いても、同じ効果が得られる。

<span style="line-height: 180%; font-size: 120%;">
本文がどうのこうの...
オシッコ攻撃がどうのこうの...
バカネコがどうのこうの...
</span>

さて、これを良くにらんでいただきたい。
180% だの、120% だの書かれていることに注目。
この数字をいじると、自由に調整がきくのである。

line-height とは、行の高さの指定である。
この数字を大きくすれば、好きな行間隔が選べるわけだ。
100% 以下も指定できるが、上下の行の文字が重なってしまう。
文字の大きさにもよるが、150~180% くらいが読みやすい。

font-size は、説明するまでもなく、文字サイズである。
既定の文字を100%として、どのくらいの大きさにしたいか、指定すればよい。
いくらでも好きな大きさが選べるが、120% が良さそうだ。

ただ、100%を指定すると、何も変わらないので、指定する意味はない。


アロハシャツ(オレンジ)

チェック柄シャツ(オレンジ)

通常のHTML標準は、活字の大きさで言えば12ポイント、
フォントタグのサイズで言えば 3、である。
それに対して、楽天を始めとするブログの文字サイズは10ポイント。

わずか、2ポイントの差なのだが、すごく小さく感じる。
通常のサイズに戻すだけで、ぐっとラクになる。
インターネットエクスプローラや、バカネコビューアで実験してみれば
すぐ、その効果が実感できる。

今回、このタグの中に仕込んだ、仕掛けをスタイルシートというのだが、
名前だけ知っていれば良かろう。
重要なのは、文字サイズも行間も、自分の望み通りにすることだ。

この方法の利点は、タグで挟んだ部分だけを、いじれることである。
タグの外側には、影響しないので、また別の設定が、好きなように出来る。

文字サイズは、「120%」などの相対指定だけではなく、「12pt」というように
ポイント数などの絶対値で指定することもできる。

【今日のポイント】
1.文字や行間は、ある程度大きい方が、読みやすい。
2.line-height と font-size は、%単位で好きなように調節できる。
3.スペースや、コロン、セミコロン、% に注意のこと。 すべて半角である。

【追記 ※注】
 WindowsXPにSP2を導入している場合は、インターネットエクスプローラで
 テキストファイルを見ることは出来ない。 メモ帳が立ち上がってしまう。
 また、文字サイズを%で指定すると、既定の文字サイズに対して相対的に
 働くので、バカネコ・ビューアでは、楽天広場よりも大きく表示される。
 これは、楽天日記の既定サイズが10ポイントであるのに対し、
 バカネコ・ビューアの標準が、12ポイントであるため。

【次回の予定】
 それでも、タグを使うのは面倒だ、コワイ、という初心者には、
 管理画面から設定する方法があるので紹介する。
 文字サイズしか調節できないし、すべてのメイン画面に適用されてしまうが、
 楽天を始めたばかりで不安な方は、こちらでもよろしかろう。


【コロン短信】
 今度はまた玄関に放尿。 スニーカーの上にやらなかっただけマシか。
 夜中、珍しく、ネコトイレに入ったので、出てきたところを、
 思いっきりほめてしまった。 なんか、ちょっと違うんじゃないか...


この記事が役に立ったと思う人は1票! クリック →
 おもしろかったらクリックしてね



※バカネコ講座では、安全な方法を選んで紹介していますが、
 途中でわけがわからなくなっても、責任は負えませんので、あらかじめご了承下さい。



ネコでもわかるPC講座はこちら。 →バカネコ講座

ラクしてユーザビリティ改善   → ずぼらなアクセスアップ

楽天日記のダウンロードツール → バーニャン1号の秘密

うっとおしい下線を表示させない→テキストリンク下線の消し方



画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。
子猫の里親募集にお力添えをいただける方、または、このサイトの新着記事の通知をご希望の方はご利用ください。









最終更新日  2005年02月01日 00時57分32秒
コメント(40) | コメントを書く

PR

バックナンバー

2019年08月
2019年07月
2019年06月
2019年05月
2019年04月

プロフィール


海獣トド

コメント新着

 海獣トド@ Re:意外な一面に触れて。(08/14) 泡雪さんへ >マザーテレサって本当にす…
 海獣トド@ うめぼしがキラリ☆さんへ >ひゃー、ブログさぼってる間にトドさん…
 海獣トド@ 鵜の岬さんへ >これからも・・ヨロシク・・ね こち…
 海獣トド@ sshijimisanさんへ >でも、トド様のおかげで少しの村民は救…
 海獣トド@ もぐらのこさんへ >日記の下書き機能残ってるよ(^-^) …
 海獣トド@ archfelisさんへ >せめて12日一杯残せばいいのに・・・…

Copyright (c) 1997-2019 Rakuten, Inc. All Rights Reserved.