2006-07-31

人として The Human Condition

海外晩春婦、からゆきさんの話をまとめていて、それに対する異論に対しても記事としてまとめてみた。無用な詮索は自分自身をも否定する事になりはしないのだろうか?

自分を見失わない事、それは他人を軽んじない事なんじゃないだろうか?

ウェブアクセシビティでも技術論に終始し、情報を伝える情報伝達論がおざなりにされているのじゃないかというような話なんぞもしていたので。

2006-07-20

生きる権利(Living right)

JANJANへの記事投稿。今回は生きる権利を3本載せてみた。

医師不足という子供を産める環境の喪失。
医師が居てこそ安心して出産できる

信頼関係喪失とも云える現代の格差社会。
再チャレンジというけれど

食文化から来る身体の異変。
飢えを知らぬ身体の飢え 食品添加物の話

「生きる」とはなんなのか考えて欲しい。

徒然なるままに」でも「黄色い戦争ありました」にてまとめ読み出来ます。

2006-07-19

Public Domain Movie Torrents July

Public Domain Movie Torrents7月追加公開ファイルで邦題が判るものをリストに加筆しました。

0-9|A|B|C|D|E|F|G|H|I|J|K|L|M|N|O|P|Q|R|S|T-1|T-2|U|V|W|X|Y|Z|

追加分

2006-07-11

CSSデザイン

マークアップ Markupに続いて、CSSデザインのお話。

まずはデザインとはなんなのか。見た目の良さだけをデザインとするのは間違いで、どれだけ整理されているかが、デザイン。だから、見出し(<h*>)で段落(<p>)、リスト(<ul>/<ol>/<li>)の集まりを定義してあげ、囲み(<div>)で括るなど整理した上に<見やすさ>を施すのがデザイン。

CSSデザインは解像度、モニターサイズなど一定でないパソコン表示で、仮の固定表示をデザインするというテンポラリー・デザイン。それはモニターサイズに囚われず固定表示出来るテレビ画面とも異なり、利用環境の他、利用側のニーズにより、差し障るデザインならばそれを無効化出来る特性も兼ね備えている。

デザインの概略を大きくまとめると「配置」と「色」となるだろうし、テキストのフォント指定などは共有理念から考えると特定フォントはあまり望ましくはなく、汎用なものを使った方が良いと思われる。

CSSデザインの場合、その管理の利便性により、style属性で一括管理するか、外部スタイルシートを用いる事でその効果を高める事が可能となる。

色指定はテキストならば[color :]、背景色ならば[background-color :]をそれぞれ指定する。指定できる値はRGB(Red,Green,Blue)を16進数で2桁ずつ指定する方法。[白 : #ffffff; / 黒 : #000000;] RGBの2桁が同じ値の場合、[白 : #fff; / 黒 : #000;] でも同じ。[白 : white; / 黒 : black;] と定められた16色の場合、そのキーワード指定も可能である。

配置

配置指定にはその枠組みを指定するもの(プロパティ)として枠組み線[border :]、枠組み線の外側[margin :]、枠組み線と内容の間の空き幅[padding :]で位置調整でき、個別に上[top]、下[bottom]、右[right]、左[left]を指定する事も可能。枠組み線[border :]では色[color]、太さ[width]、形式[style]も指定出来る。

枠組み線を赤い二重線で、太さは標準の文字サイズの半分
border :0.5em #ff0000 double;

枠組み線を赤い二重線で、太さは標準の文字サイズの半分で、枠組み線と内容の間の左の空き幅を10%確保。
border :0.5em #ff0000 double; padding-left :10%;

枠組み線を赤い二重線で、太さは標準の文字サイズの半分で、枠組み線の外側を10%確保。
border :0.5em #ff0000 double; margin-left :10%;

囲み(<div>)毎の配置ならば、手軽に使われるものとしては回り込み[float :]、その解除[clear :]で、回り込み指定の際はその幅[width :]を指定する。

左より40%幅で、回り込み
border :0.5em #ff0000 double; float :left; width :40%;

回り込み指定無し。


上の横線で左回り込み解除
clear :left;

もうひとつの配置指定としては相対位置、絶対位置指定[position :]があり、上[top]、下[bottom]、右[right]、左[left]、それぞれの位置を指定する。[position :]のプロパティは通常表示[static;]、通常表示の位置より相対位置で配置される[relative;]、通常表示以外の指定がされている配置から位置を決める[absolute;]とやや複雑なので、『そのまま使えるスタイルシートサンプル集』などの参考書で知識を身につけた方がよいでしょう。

フォント

テキストフォントのデザインはサイズ[font-size :]太さ[font-weight :]斜体[font-style :]が主だった物で、特定フォント名指定[font-family :]は汎用的な明朝系[serif;]、ゴシック[sans-serif;]、筆記体・草書体[cursive;]、装飾的フォント[fantasy;]、等幅[monospace;]などが無難ではあるけれども、使いすぎると文字化けの原因にもなりかねないので、こだわり過ぎない方がよいでしょう。

2006-07-06

タッチパッド付キーボード(Keyboard with touch pad)

今日、タッチパッド付キーボードの事を障害持った方達にお話ししました。

僕自身、利き手不自由で、マウス操作が駄目で、割高なノートを使っているのはお話済みだけど、デスクトップパソコンにしたら、まずはキーボードをタッチパッド付キーボードにしたいと思う。

指先でキーボードとカーソル操作できる感覚は捨てがたいし、ショートカットキーの活用などもあわせれば、操作時間に不便を感じない。

とはいえ、デスクトップパソコンに買い換える目途も立たず、未だプラトニックな状態なのだけけど。


USB接続タッチパッド付キーボード 1011PU

2006-07-04

マークアップ Markup

ブログのユニバーサル・デザインなどというのを教えたりしているのだけど、記事投稿でマークアップ言語を使え、ページ全体のソースもテンプレートである程度カスタマイズ出来るbloggerはどちらかというとお勧め。

授業の資料として、よく使われるマークアップ言語をここでもご紹介。

段落(<p>)

文書は段落より成り立つ。そのセンテンスの長さや要点と話法、それぞれ癖はあるだろうけど、段落分けの区切りがないと読みづらいし、判りづらい。

見出し(<h*>)

ある程度まとまった文書を眺めると見出し分けする事で判りやすくなる場合がある。がしかし、無理に見出し分けつけると混乱招く事もある。

文書をまとめる際に語る順番をポイント毎にまとめ、そのポイントのタイトルを付けてやる感覚が一番判りやすいも。

住所録など作る際に、どのように分類するか、親戚、知人、仕事上などで分け、更に地域別に整理するなど、自分の頭の整理を見出し分けを利用し、文書整理する感覚が一番ベストかと。

リスト(<ul>)

番号無しリスト(<ul>)と番号ありリスト(<ol>)があるけれども、リスト項目(<li>)で現す事でわかりやすさが増すのであれば、使うべきで、段落とリストをうまく使い分ける事が大切。

ただ、あまりに大きなリスト数の場合は小分けして見せるのも配慮のひとつだし、その場合、なんのリストなのか判るように見出しをつけてやると親切。

<h2>北海道</h2>
<ul>
<li>札幌市<li>
</ul>
<h2>東北</h2>
<ul>
<li>青森市<li>
<li>秋田市<li>
<li>岩手市<li>
<li>仙台市<li>
<li>山形市<li>
<li>福島市<li>
</ul>

囲み(<div>)

文書のまとまりの範囲を指定する際に使うもので、デザインがこの囲みをベースに行われると整理された文書情報を提供できる。

デザイン指定はスタイルシートを用いる場合、(<div id="main" class="top">)など、その位置のみのデザイン指定のid属性か、同ページで繰り返し使われるclass属性を使い分けるのがこつ。

リンク(<a>)

関連する情報を繋ぐリンクを張る場合、使う物で、上のマークアップの中でしか使えない

情報先へ飛ぶ場合は<a href="[飛び先アドレス]">リンク先</a>などと記述し、飛び先がページの中の場合は<a name="top" id="top">そして</a>などと記述する。

用語解説や補足、あるいは裏付け、関連項目などうまく使えば、活用度が増す。よく使われている「ここをクリック」などは飛び先の情報が不明確なので、使ってはいけないとされているし、同じ用語で、違う飛び先を指定するのは、利用者の混乱を招くともされている。

画像(<img>)

最も手軽に利用される画像のマークアップは<img src="画像のあるアドレス" alt="画像が表示されない時の代わりのテキスト" width="画像幅" height="画像高さ">で記述するのだけれど、画像の大きさは指定する事で読み込み遅い環境でもその大きさを確保する役目を果たすけれども、必ず記述というわけではない。

むしろ大切なのはalt属性で画像の代わりとなるテキストが必要ない時でもalt=""と記載する。代わりとなるテキストは画像イメージをそのままテキストにする必要はなく、むしろ文脈が通じるようにalt属性を使うのが大切。バナーなど画像イメージのみのリンクの場合はalt属性に必ずテキストを書かねばならない。

画像イメージを伝えたい場合はtitle属性を活用し、画像イメージの情報を付加する事も出来る。

<p>明日は晴れです。<p>
<p>明日は<img src="http://www.phoenix-c.or.jp/~takayan/img/sun.gif"
 alt="晴れ" title="お日様" width="47" height="30" />です。<p>

テンプレートのカスタマイズはTemplate タグを参考にすると判りやすい。