はじめに

このサイトは、私（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が所有します。

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

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

その他の連絡先について

連絡先

変更点

• Movable Type 5.0の採用
• irodori.one-poem.jpに移行準備
• タグやキーワードの検索結果に、前後の検索結果ページへのリンクを設置
• その他、表示の調整

もうちょっと何とかしたいところ

• 検索結果ページのナビゲーション
• 検索結果ページの右側のカラムの調整
• 月別アーカイブの表示方法

Cookieによる認証と、アイテム追加と、コロプラのシステム変更が続いている。 Cookieによる認証は、これを削除すると1日アクセスできなくなると言う深刻なもの。 一部の迷惑ユーザー対策で施した策のようだが、一部のために大勢が迷惑を被るのは残念だ。 GMさんのコメントには以下のように書かれている。

クッキーによる端末認証を開始しました。 実は先行して昨日から導入していましたが、ログを見る限り大きな問題は発生していないようですね。 どうやらクッキーが消えてしまう端末があるようですが。。 うーん、機種や状況がマチマチで、原因がサッパリつかめていません。 同じ端末でもまったく問題ない人もいれば勝手に消えてしまう人もいるようです。 この現象が発生している方の人数がおおよそ100人ぐらいとかなり少ないので、特殊っていば特殊なんですが。とりあえずこのまま運用して様子を見ようと思います。 コメントを開放しておきますので、何かご存知の方、是非とも教えてくださいm(_ _)m

100人なら少人数と言うのもちょっと強気な発言だ。 現在コロプラのユーザー数は、コロニーの数が22,000程度のところで、実質のユーザー数は多くても15,000人程度ではないだろうか。 先日の紹介機能とリバイバル騒ぎの時に、無意味にコロニー数が増えたらしいから、なおさらだ。 下手をすると、現在アクティブなユーザーは10,000人以下とも考えられ、そうすると100人でも1%となる。 なんだか、いつの間にかNetscape 4.xを無視してサイトを作っていた自分を思い出し、少し反省した。

一方、アイテムの追加だが、1コロ掲示板などの情報に寄れば、春·夏·秋がそれぞれレベル150まで拡大され、他に、近所の範囲を超えて通信できるようになるセットアイテムが追加されたようだ。 これまでも料金を払って電報を使えば遠距離とも会話できたが、どうもそれが不要になるようだ。 取得条件は人口が8000人とかそういうレベルの話のようだ。 どうも、春·夏·秋の拡大は、後半のアイテムをより取得しやすくするのが主眼と思われる。

私は、今回のアイテム追加はちょっとGMさんらしくないように思う。 と言うのは、ずっと前に「電報にお金を払うのはどうか」と言う議論があったそうだが、GMさんは「地域で交流をしてほしいので、本当は10プラでも安いと思っている」と言うように答えていた。 いくら、今回のアイテムは人口が多くなければ取得できないとはいえ、結局のところは地域の交流を希薄にさせる方向のアイテムではないか。 この新アイテムによって、会話だけではなく、コロニーを見たり、プレゼントを贈ることができるようになったら、それこそコロプラの持ち味はなくなってしまうのではないかと危惧している。

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

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

ただ、現在使っている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が所有します。

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

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

その他の連絡先について

連絡先

ウェブアクセシビリティという言葉が言われて久しい。 ウェブの閲覧は様々な人たちがおこなっている。 視覚障害者もいるし、高齢者もいる。 音声ブラウザを使っている人もいるし、テキストブラウザを使っている人もいる。 携帯電話やファックス・ゲーム機にさえ、インターネットブラウザが搭載されている時代である。 そう言った様々な人々・環境からウェブへのアクセスをしやすくしよう、アクセスしにくい要素をなくしていこう、と言うのがウェブアクセシビリティの考え方と理解している。

富士通はこれに対して、JISや自社で策定した指針をチェック可能なツールを無償で配布している。 掲題のWebInspectorがそのチェックツールで、その他にも、Color Selecterと言う、見やすい色の組み合わせを探せるツールも提供している。

このツールはWindows版の他、Mac OS X版も提供されているのに気づいたので、今日チェックをおこなってみた。 結果としては、これまで自分が作ってきたサイトは、いろいろなブラウザからきちんと見られるように作ってきたつもりで、携帯電話やテキストブラウザには配慮してきた。 ところが、主に色の指定は見にくい、との判断が下されてしまった。 これをBlogの方にすると、もっとひどく、Movable Typeの標準設定では、アクセシビリティなど考えて作っていないことがはっきりした。

とりあえず、今後のメインサイトとなる、Blog版は少しましなところまで直したつもりだが、こちらは逆に携帯電話はテキストブラウザなどのことはあまり考えていない。 道のりはまだまだ険しい。

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

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

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

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

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

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