はじめに

このサイトは、私（One-Poem）が、自分の好きなことを、適当にWeb上に書いていこうというサイトである。 大きなくくりで言えば、創作活動の発表の場と言うことにもなるのだろうし、個人の日記と言うことにもなるだろう。

私は、以前から自分のウェブサイトを作ってはいたが、もっと気軽に更新できるものとして、Blogを採用してみた。 Blogはシステムがしっかりと作られており、個々の内容を書くだけで、トップページや更新情報・インデックスなどの更新が自動的に行われる。 テンプレートなどの仕組みもしっかりとしており、更新の手間が少なくて済むようになった。 また、日記に近いものと考えられている日本の現状からしても、これまで「わざわざ書くようなことでもないな」と考えてしまっていたような日常の細かなことについても、書いていこうと思っている。 どちらかというと、Weblogと言うよりも、Myself logに近くなるとは思う。

動作環境など

以下は、技術の話が好きなので、技術的な解説をしようと思う。

このサイトはMovable Typeを使って作られている。 さくらインターネットのレンタルサーバにインストールし、主にデザインを自分好みに変更して使用している。

HTMLのマークアップはHTML 5を採用している。 スタイルシートは最新のCSS仕様を採用している。 Safariのページピンアイコンなど、特定ブラウザ向けのマークアップを行う必要がある場合など、文法ミスは多く含まれるものの放置せざるを得ない状況になっている。

サイトのアクセシビリティは富士通のWeb Inspectorでチェックをおこなっている。 また、Another HTML-lintの、文法チェックと「宗教的なチェック」も参考にして作っている。

表示を確認しているブラウザは、以下の通り。 基本的に、ブラウザは最新バージョンまたはβ版を利用している。 これ以外のブラウザで表示が崩れている場合は、なるべく訂正したいと思っているが、逆に、下記のブラウザで表示がおかしい場合は、もしかすると私自身がそれで納得している場合もあるかもしれない。

• Safari on Mac OS X
• Firefox on Mac OS X
• Safari on iOS9

以下はちょっとまじめな話。

著作権/リンク/二次利用について

IrodorI One-Poem World

Copyright © 2006-2015 One-Poem

特に表示がない場合、IrodorI One-Poem World（トップページ以下）の著作権は、私、One-Poemが所有します。

私の著作物にリンクを張っていただく場合、特に許可無く、自由におこなっていただいてかまいません。 私は、リンクは一種の引用であると考えていますし、また、引用することは制限しません。 リンクした旨を連絡していただく必要はありませんが、連絡していただいても構いません。 ただし、ファイル名やフォルダ構成を変えることはありますので、時々確認していただけるようお願いします。

二次利用については、クリエイティブ・コモンズ・ライセンスをご覧ください。 ライセンスの条項にもありますが、私に別途許可を取ると、このライセンスの適用を受けることなく二次利用が出来ます。

その他の連絡先について

連絡先

先日リリースされたMicrosoftの最新WWWブラウザーであるInternet Explorer 7日本語版を、遅ればせながら私もインストールしてみた。 インストールは最初なぜか英語版のインストーラがダウンロードされてしまったが、やり直したら日本語版がきちんとダウンロードされてきた。 インストール作業自体はほとんど操作することもなく、簡単に終了した。

気になる点としてはまず大きく変わったと言う外観だろうか。 確かにシンプルなものになっていて、画面が広く使えそうな印象を受ける。 タブブラウジングもFirefoxと新規タブを開くボタンの位置が異なるので若干戸惑うが、慣れの問題だと思う。 タブ一覧を画面のサムネイルで表示してくれる機能は便利だし、動作も軽快なので驚いた。 Firefoxにも同じような機能の拡張があるので使ってみようかと思う。

私の使っているDell製のWindows PCはメモリを2GB搭載しているので、少々古いPCとは言えゲーム以外の用途ならば軽快に動作する。 だから、IE 7の動作がFirefox 2に比べて重いのか軽いのかはよくわからない。 Firefoxはメモリを多く使うようになっているので、ハードディスクへのスワップが多く発生するような環境（仕事に使っているPC）では切り替え時などに動作が重くなってしまう。 そう言う環境でIE 7がどのように動作するかが気になるが、私のところでは特に問題なかった。

スタイルシートへの対応状況だが、IE 6よりはかなりましになっているようだが、やはりMozilla/Firefox系統とは動作が異なるようだ。 また、before疑似要素とcontent属性の組み合わせは動作していないように見える。 多用している私としては残念なところだ。

サイトのトップページのサイズが、最近急激に増加している。 一日あたりのエントリーの数が増えているので、当然と言えば当然なのだが、何らかの形で対処したいと思う。

昔、今のようにブロードバンドだの常時接続だのとは行っていなかった時代、サイトのトップページは「何秒以内でロードされるように、何キロバイト以下に収めるべきだ！」等という解説が広く言われていた。 もちろん、そう言った対処は大切なことだと思うので、私も、少なくともトップページは重くならないように、配慮をしてきたつもりだ。

ただ、現在使っているMovable Typeのシステムは、様々なスタイルに対処できるよう、マークアップの仕方も必要以上に複雑だし、スタイルシートファイルも、解読が必要なくらい複雑になっている。 トップページはトップなのだから、こういったファイルを一度に読み込む必要があり、回線が細い場合には結構な負担になると考えられる。 これが実感できるのが携帯電話搭載のブラウザからアクセスしてみたときで、最新と思われる、機種変更したばかりの私の携帯でも、サイズが大きすぎることが原因と思われる、読み取りエラーが起きて、表示されないときがある。 仮に表示されても、よく見るとページの後半が、途中でとぎれて無くなっている。 もちろん、データのロード自体にも、時間がかかる。

一つの解決策として、軽量版ページを作ってみた。 まだアナウンスしていない段階だが、タイトルだけが表示され、後は個々のパーマリンク先で記事を読むことになるので、トップページだけは非常に軽い。 軽量版は軽量版のエントリーアーカイブが作成できればよいのだが、どうもあまりうまく作れそうもない。 他の解決策としては、現在日数でトップページに表示されるエントリーを区切っているが、これを記事数で区切るように変更することである。 これによって、よほど長いエントリーが続けば話は別だが、サイズの増加はある程度に抑えられると考えられる。 ただ、この方法ではトップページに公開されている日数がきわめて短くなってしまうことも考えられ、バランスが難しい。 しばらくは、100KB超のトップページで行くしかないと思っている。

はじめに

このサイトは、私（One-Poem）が、自分の好きなことを、適当にWeb上に書いていこうというサイトである。 大きなくくりで言えば、創作活動の発表の場と言うことにもなるのだろうし、個人の日記と言うことにもなるだろう。

私は、以前から自分のウェブサイトを作ってはいたが、もっと気軽に更新できるものとして、Blogを採用してみた。 Blogはシステムがしっかりと作られており、個々の内容を書くだけで、トップページや更新情報・インデックスなどの更新が自動的に行われる。 テンプレートなどの仕組みもしっかりとしており、更新の手間が少なくて済むようになった。 また、日記に近いものと考えられている日本の現状からしても、これまで「わざわざ書くようなことでもないな」と考えてしまっていたような日常の細かなことについても、書いていこうと思っている。 どちらかというと、Weblogと言うよりも、Myself logに近くなるとは思う。

動作環境など

以下は、技術の話が好きなので、技術的な解説をしようと思う。

このサイトはMovable Typeを使って作られている。 さくらインターネットのレンタルサーバにインストールし、主にデザインを自分好みに変更して使用している。

HTMLのマークアップはXHTML 1.0 Strictを採用している。 スタイルシートはCSS2を採用している。 一応チェックはしているが、一部に文法ミスなどあるかもしれない。

なお、一部ページでは後方互換性に考慮した上で、意図的に文法ミスをしている。 これは、XHTML1.1に含まれるルビのマークアップをしているためである。 ならばなぜXHTML 1.1を採用しないのかというと、XHTML 1.1ではMIMEタイプをapplication/xhtml+xmlにするべきなど、色々面倒なのである。 ルビを将来またマークアップし直すのも、これまた面倒なので、今はそのままマークアップしている。 後方互換性を考慮、と言うのは、仕様書にも書いてある方法を使って、解釈できないユーザーエージェントでも、それなりに意味が通るようになっている、と言うことである。

サイトのアクセシビリティは富士通のWeb Inspectorでチェックをおこなっている。 また、Another HTML-lintの、文法チェックと「宗教的なチェック」も参考にして作っている。

表示を確認しているブラウザは、以下の通り。 基本的に、ブラウザは最新バージョンを利用している。 これ以外のブラウザで表示が崩れている場合は、なるべく訂正したいと思っているが、逆に、下記のブラウザで表示がおかしい場合は、もしかすると私自身がそれで納得している場合もあるかもしれない。

• Camino on Mac OS X
• Safari on Mac OS X
• Opera on Mac OS X
• Mobile Browser on W41CA
• Opera on W41CA

以下はちょっとまじめな話。

著作権/リンク/二次利用について

IrodorI One-Poem World

Copyright © 2006 One-Poem

特に表示がない場合、IrodorI One-Poem World（トップページ以下）の著作権は、私、One-Poemが所有します。

私の著作物にリンクを張っていただく場合、特に許可無く、自由におこなっていただいてかまいません。 私は、リンクは一種の引用であると考えていますし、また、引用することは制限しません。 リンクした旨を連絡していただく必要はありませんが、連絡していただいても構いません。 ただし、ファイル名やフォルダ構成を変えることはありますので、時々確認していただけるようお願いします。

二次利用については、クリエイティブ・コモンズ・ライセンスをご覧ください。 ライセンスの条項にもありますが、私に別途許可を取ると、このライセンスの適用を受けることなく二次利用が出来ます。

その他の連絡先について

連絡先

Blogのデザインを変更するべく、Movable Typeのテンプレートと格闘している。
標準のHTMLコードは非常に複雑で、異常なdiv要素のネストを繰り返している。
デザインを変更するためにスタイルシートを変更しようにも、HTML文書の構造が理解できなければ、まともなスタイルの指定は出来ない。
そこで、構造を理解することを優先することにした。

divのネストを何とかしないと、そのまま構造を理解するのは非常に困難なのだが、構造を理解せずにむやみにネストをはずしてしまうと、根本から訳がわからなくなってしまう。
div要素のネストがわかりづらいのは、ネストが深いことに加えて、Webブラウザ上の表示のため、どの深さでネストされているのか、一目でわからないことが原因だ。
そこで、Movable Typeに用意されている、テンプレートのモジュールを利用して、ネストの解消を行うことにした。

これまでおこなったのは、主にメインページについてで、検索ボックスやカテゴリリストなどをそれぞれモジュールに移し、メインページへは<$MTInclude$>で入れ込むことにした。
こうすることによって、小さな単位でネストが確認でき、非常にわかりやすくなった。
ついでに、DOCTYPEやxml宣言などまでモジュール化し、後から変更しやすいようにした。
我ながら良い仕事だと自画自賛したくなる（笑）。

これからやるべきは、div要素のネストが何のためにおこなわれているのか、スタイルシートファイルを見比べながら解析することだ。
うすうす予想されるのは、見た目を指定するためにいろいろネストしている、と言うことで、仮にそうだとすると無駄なことなので、見た目を変更するなどしてシンプルな構造にしたい。
私は複雑な構造を把握するのが苦手だし、面倒で嫌になってやめてしまう。
だから、後々のために始めに少し苦労しておこうと思う。

目標とするデザインとしては、まず私にとっての反面教師を紹介したい。
今、多くのBlogやウェブサイトで良くおこなわれていることだが、横幅がサイト側で指定されている。
現在、このBlogのデザインもまさにそうなっているが、私はこのレイアウトがあまり好きではない。
と言うのも、ブラウザがそれ以上の幅を使ってサイトを表示できるのに、その分がサイト側の都合で利用できないからだ。
もったいない感じもするし、スクロールする手間も増える。
ひどいときには、ブラウザウィンドウの半分くらいの面積しか使わないことになるサイトもある。

そこで、このBlogでは横幅を指定しないように作りたい。
これまで作ってきたサイトもそう言う思想で作ってきている。
Blogでも同じように出来るのかどうかわからないが、これを目標にしていきたい。