[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
過去記事を編集する場合、管理画面から”過去の記事を編集”を辿って編集する。
しかし、記事の数が多くなってきた時、それは非常に面倒だ。
それぞれの記事に直接編集することができるようリンクを作成することで問題を解決する。
Ninja Blogを対象にしているが、他でも何かしらの方法がある。
（恐らくこれまでも多くのところで書かれているだろうし、多くのブログ（テンプレート）で取り上げられているだろう。）
１．テンプレートのｈｔｍｌ編集から、記事フッタークラスの任意の場所に以下のように記述する。
<span class="EntryEdit"> <a href="/hoge/EditEntry/<!--$entry_no-->/">Edit</a> </span>
<!--$entry_no-->はその記事の番号を表す。
NinjaBlogでは/hoge/のみで自身のブログを判別できるので、複数ブログを持っている場合でも正しく編集画面に移れると思われる。（未検証）
２．併せてｃｓｓを適当に編集する。
.EntryEdit {
margin-left: 5px;
}
今回はEntryEditという新しいクラスを作成した。
次期テンプレートからはこれを採用していくことにする。
ブログのデザインテンプレート第二弾を公開。
ユーザビリティやアクセシビリティには配慮したつもりである。
- リキッドデザイン
- ２カラム（左メニュー）
- プラグイン５を記事の上に表示
- preタグはソースコードを載せる人用にCSS適応済み
- 記事詳細ページには簡易パンくずリストを表示
- 2C_LiquidD_Simple['08/05/19]をベースに作成
- 横幅が1024px以上ある環境の場合のデザインを（max-widthで）修正（IE6でも適応）
といった特徴がある。
動作は、WindowsXP SP2 （解像度1024*768） Internet Explorer6とMozilla Firefox2にて確認している。
DownloadPageは下記。
hoge/TemplateView/4222/
（自身のブログURLの後ろに赤字をCopy&Paste）
不具合・意見・要望等あれば、コメントまでどうぞ。
修正案
・トップタイトル部分のブログ説明のフォントカラー
現在暫定的に設定している。上手い配色があればコメントまで。
更新履歴
'08/06/09：
・imgタグなどがプラグインにも反映されていた点を修正
・多重改行（連続br）を反映するように変更
既知の不具合
・横幅が1024px以上の環境の場合、タイトル部の背景がMozillaだとずれる
修正済み。
CSSが分かる人は、#TopBlock内background-position: left top;をbackground-position: center top;に。
テンプレートを作っていて、IEではmax-widthが使えないことに気づいた。
調べてみると、次のようなページが見つかった。
[CSS]IEで、min-widthやmax-widthを実現する方法 | コリス
CSS内でJavaScriptを実行することで、CSSの内容を変えているようだ。
実際には、*htmlハックを用いて、IE以外では読めないようにする。
以下、テンプレートで実際に書いたCSS
#mainBlock {
text-align: left;
width: 90%;
min-width: 600px;
max-width: 920px;
margin: 10 auto;
border: 1px solid silver;
}
*html #mainBlock{
width:expression(document.body.clientWidth < 602? "600px" : document.body.clientWidth > 922? "920px" : "90%");
}
最小幅を600px、最大幅を920pxとしている。
また、最後の90%は前条件以外の場合適応される値であるため、#mainBlockのwidthと同じにしている。
人が一度に情報を取り入れることには限界がある。
よって、伝える側は（例えばマニュアル等のドキュメントを作成する際は）、読みやすさ・理解しやすさに重点を置くことが大切だ。
・眼の能力に配慮
ものを注意深く見ようとすると眼の中心で捉えることになるが、この時、文字・イラストが細かすぎたり、余白が無かったりすると、その情報はノイズ以外のなにものでもなくなる。
確かに精確に表現することも時には大切だが、パッと見たときに分かりやすく伝えることは困難である。
だいたいの目安としては、全体の６０％程度にするのが良いとされている。
また、行間も文字サイズの７５％が標準的だ。
いくら細かく詰めた方が格好良い・デザイン性がある、などと思っても、それは読み手が本当に求めるものなのかどうかを考えなければ意味の無いものになってしまう。
・重要度によってフォントを変える
読ませたい部分、強調したい部分などには、一般的にフォントを変える。
例えば、このブログで言えば、標準のフォント（本文等）にはゴシック体（MS UI Gothic）を用い、タイトル部分は明朝体（'ＭＳ 明朝'）を用いている。
強調する手段に太字にするということもあるが、字潰れを避けるという点でも、よく眼に触れるタイトルは違うフォントにした方が懸命だろう。
・取り込める情報量は少なく
一度に脳に取り込める情報量にも限界がある。
ずらずらとただ書き並べるだけでは、どこに注目すれば良いか分からないし、全部を一度に理解することも難しい。
優先度を分かりやすくするという点でも、一つの事柄は、一つの段落（文・イラスト）で完結させるべきだ。
情報量を少なくし、（余白をあけるなどして）他の段落と区別させれば、読み手はその段落に集中することができる。
つまり、『ドキュメントは読み手のためにあり、書き手のためにあるわけではない』、ということを常に念頭に置く必要があるのだ。
（読み手＝書き手であるこのブログではどうなるのか？）
ブログのデザインテンプレート第一弾を公開。
ユーザビリティやアクセシビリティには配慮したつもりである。
- リキッドデザイン
- ２カラム（左メニュー）
- プラグイン５を記事の上に表示
- preタグはソースコードを載せる人用にCSS適応済み
- 記事詳細ページには簡易パンくずリストを表示
- 個別記事から直接編集することが可能
といった特徴がある。
動作は、WindowsXP SP2 （解像度1024*768） Internet ExplorerとMozilla FireFoxにて確認している。
DownloadPageは下記。
hoge/TemplateView/4185/
（自身のブログURLの後ろに赤字をCopy&Paste）
不具合・意見・要望等あれば、コメントまでどうぞ。
更新履歴
'08/06/09：
・記事から直接編集ページに飛べるようにした
・imgタグなどがプラグインにも反映されていた点を修正
・多重改行（連続br）を反映するように変更
既知の不具合
URLリンク等横に長いものがあるとデザインが崩れる場合がある。
修正済み。
ただし、Firefox等Geckoエンジンを使ったブラウザの場合、URLが改行されないのはブラウザ側の不具合となっている。（Firefox3以降で改善予定）
url_breakerというものを利用してこの問題を解決する方法もあるようだが、標準のテンプレートとしては採用を見送る。
参考ページ：小粋空間: Firefox・Netscapeで連続した半角文字を折り返す
