砂塵の彼方

スマホでの表示は、これまで自分の好みで黒地に白文字にしていました。
が、この際、選べるようにしておこうかと。
ブラウザーのテーマ設定によって、ライトなら白地に黒文字、ダークなら黒字に白文字の表示に自動で切り替わるようにしました。

今回作業を行ったのは、以下の5か所です。
※印の3つは、パソコン表示もダークモードに対応させました。

• 時空の塔 https://www.simoom.net/
• 踊る金狼亭(※) https://www.simoom.net/cw/
• 砂塵の彼方 https://www.simoom.net/sj/
• simoom.net.BAK(※) http://hp.vector.co.jp/authors/VA054753/
• simoom.net.BAK2(※) https://simoomnet.web.fc2.com/

ライトの方は、スマホで見ると配色がいまいちな気がします。もう少し改善の余地がありそうです。いずれ調整するかもしれません。


（1/14追記）
ライト版の配色の調整を行いました。

（1/27追記）
時空の塔のパソコン表示を、ダークモードに対応させました。
元が基本的に黒地に白文字でしたので、「ダークモードでない時は白地に黒文字で表示できるようになった」が正しい気もします。
単純に白＆黒ではなかった部分は元の色や壁紙画像を残しているため、場所によって淡色に濃色文字／濃色に淡色文字の切り替えになることもあります。

（2/14追記）
砂塵の彼方（この場所）のパソコン表示を、ダークモードに対応させました。
元の茶系の色を残しつつの明暗切り替えです。

ほんの気の迷いで、レスポンシブ化しました。

と言っても、きちんと調整したのは、最も見辛いであろうトップページだけです。未調整のページも表示の横幅が一定以下になると小さい画面サイズ用の表示が適用されますが、ほとんどは横幅480pxで閲覧可能なように作ってあるので、だいたいのところ大丈夫ではないかと思いたい思います。調整が終わったところから等倍表示の設定をかけていく予定です。

作業の範囲は、「時空の塔」及び「踊る金狼亭」内の静的コンテンツを考えています。ただ、レスポンシブWebデザインを意識して作り直すところまでやるのは、手間を考えると無理そうです。元々あったパソコン用サイトはそのまま、スタイルシートだけ（＋場合によってはHTMLの方も少し）いじって、スマホなど指で操作する端末でもだいたいストレスなく使えるようにできればと思っています。これを、胸を張ってレスポンシブ化と言うのもアレで……レスポンシブ化っぽい何か、ぐらいでしょうか。終わっていないので、今のところ（仮）です。

現在パソコン用フリーゲームの記事がメインらしい構成で、レスポンシブ化して意味があるのかはさておき。

なお、この不定期日記は、パソコン・スマホ・ガラケー用にそれぞれテンプレートが存在し、適宜切り替えて表示しています。何かあるたびに膨大な数のファイルを微調整していく手間を考えたら、CMSを上手く使っていく方が楽ですかねぇ。
Firefoxはウェブ開発メニュー内に「レスポンシブデザインモード」というのがあって、作業を進めるにあたって、かなり助かっています。


（3/5追記）
CardWirth関連で作ったTwitterアプリ「cwNowUp」にも、レスポンシブ化っぽい何かを施しました。

……もしくは、サイト開設時の利用サービスが終わるので初期バージョンのデザインを晒す！
これが黒歴史でなくて何だろうか（笑）。

※※※
Yahoo!ジオシティーズから、サービス終了のお知らせが出ていました。
Twitterで、CardWirth用アカウントのフォロワーさんが話題にしていたお陰で気づきました。CardWirthの関連サイトは古いところも多く、今度も結構な数のユーザーサイトが消滅しそうです。

今をさかのぼること凡そ十●年、当時ハマっていたゲーム関連のあれこれを晒すために「時空の塔」を作った時、公開場所として選んだのがジオシティーズでした。
サイトの場所は、プレイタウン、スペード通り8051番地。
その後、アクセスが多い夜間（昔を知っている方にはテレホタイムと言った方が通じるかも）に重いことや、CGIスクリプトを自作し始めたことなどがあって退会し、有料サーバに移りました。スペード通り8051番地には、今は別の方が入居されているようです。

ジオシティーズは、個人がネットで色々やり出した頃に、一番盛り上がっていた無料ホームページサービスだったと思います。自分がジオシティーズを選んだのも、その頃一番有名なサービスだったとか、そんな他愛もない理由だったと記憶しています。「街に住む」というコンセプトが、面白かったこともありますかね。
今でも昔懐かしい感じのサイトが残っていたりするジオシティーズ。一定期間更新が無いと削除という規約でしたが、私は退会まで消されなかったし、自分の周囲で放置していたら消えたという話も聞かなかったと思います（←知人にもジオシティーズにサイトを持っている人が結構いた）。

※※※
さて。
サービス終了のお知らせの昔風デザインの方（←ページ中ほどにあるワープ（？）をクリックしてみてください）を見て思い出したのですが、そう言えば自分はサイトのデザインを大きく変える時に、初期の頃のファイルを保存していた、はず！

（↓）探したら出てきました。

…………。
………………。



この古臭さがまた……。
何も考えずに壁紙を貼ってました。見辛い。。
恥ずかしいので今は使わなくなった顔文字も、しっかり見えています。

実は、これよりも前のバージョンがあったはずなのですが、さすがに見つけられませんでした。
ちなみに、現在はこちらです。これも古臭くないとは言えない気がしますが。。。

これまでサービスを維持してきた方々、お疲れさまでした。
私に情報発信の手段を与えてくれた、当時のジオシティーズのスタッフの皆さまに感謝します。

※※※
（↓以下、2019/03/02更新）
【メモ】そこそこ最近（？）のサービス終了例
2008/12/01：Yahoo!ブリーフケース（有料会員専用に）
2010/10/31：infoseek isweb ライト
2011/06/30：COOL ONLINE
2012/05/21：infoseek isweb ベーシック
2014/11/30：OCNブログ人
2015/02/28：PageOn（OCN）
2016/03/31：フリーティケットシアター
2016/11/10：@homepage（Nifty）
2017/01/31：ZAQ BLOGari、WebSpace（J:COM）
2017/10/31：au one netホームページ公開代理サービス（旧DION）
2018/02/28：@PAGES
2019/03/31：ジオシティーズ　※予定
2019/12/15：Yahoo!ブログ ※予定

自サイト内から他のサイトへのリンクが生きているのか、前回調査してから、もう3年ぐらいは経ちました。その間に無料ホームページサービスや無料ブログのサービス終了が相次ぎ、結構リンク切れが増えているのではないか……

ということで調べてみると、やはりかなり出てきました。
必要に応じて修正や削除など行っています。主な修正箇所は、以下の通りです。

• 踊る金狼亭：メモ箱＞ユーザー作成バリアントにCardWirth Extenderを導入する
• Extender関連ファイルの入手先が変わっていたため、リンクを修正。
• 今後入手ができなくなる可能性を考慮して、代替手段も追加。
• 踊る金狼亭：初めてカードワース＞見た目や宿のカスタマイズ
• エンジン差替え素材リンクを1件追加。閉鎖など4件削除。
• CW1.28用外観変更パッチ「でこぱち」配布サイトが消滅したため、「でこぱち」に関する記述を削除。
• 踊る金狼亭：ツール紹介
• 差し替え1、修正4
• リンク集
• 「時空の塔」修正6
• 「踊る金狼亭」追加1、修正4
• リンクミス（書き間違い）の修正。
• 踊る金狼亭、札楽亭内の関連日記ログに1か所。。。

※※※
【メモ】そこそこ最近（？）のサービス終了例
2010/10/31：infoseek isweb ライト
2011/06/30：COOL ONLINE
2012/05/21：infoseek isweb ベーシック
2014/11/30：OCNブログ人
2015/02/28：PageOn（OCN）
2016/03/31：フリーティケットシアター
2016/11/10：@homepage（Nifty）
2017/01/31：ZAQ BLOGari、WebSpace（J:COM）
2017/10/31：au one netホームページ公開代理サービス（旧DION）
2018/02/28：@PAGES

だいぶ前からそういう流れになってきてましたが、これまで費用面で諦めていました。特に重要な情報をやり取りするわけでもない個人の趣味サイトのために、そう高くはないとはいえ追加の出費をするのは、どうも躊躇われたのです。
ところが先月から、SAKURA InternetでLet's Encryptが使えるように。何と更新も自動でやってくれるありがたさです。

証明書の取得はワンクリックで終了、http://～へのアクセスをhttps://～に送る設定も難しくなく、簡単簡単と思っていたら、そこからが大変でした。長くやっている間にサイトの構成ファイルが結構な数になっていて、SSLを想定していないスクリプト類の更新、網の目のように張り巡らされたリンクの中から修正が必要なものを探す作業、そして最終的な確認と、それなりの時間を消費しました。
やはり、そんなに甘くは無かった……！

なお、1つだけ作業が終わっていない部分があります。
ガラケー向けの変換スクリプトが、これまでの設定では上手く動かなくなりました。自分で作っていないので、ゼロからの調査が必要です。今日明日の対応とはいかないかもしれません。
ガラケー派の方にはご迷惑おかけしますが、今しばらくお待ちください。
・この不定期日記は単体でガラケーでの表示に対応しているため、そのままご利用いただけます。
・連絡用掲示板など他にもいくつか影響を受けない部分がありますが、そもそも使われていないので（以下略）
※11/12 ガラケー表示、再稼働しました。
なお、証明書不一致による接続不能を避けるため、ガラケーでアクセスした場合にはHTTP接続となります。
HTTPSではアクセスできない端末もあるのでやむなく……。
ガラケーでご覧になる方は、セキュリティ対策がなされていないことにご注意ください。


（11/7追記）
その後、URL正規化の過程で不具合が起きることが分かりました。
サーバのデフォルトの仕様では、
http://simoom.net/
http://www.simoom.net/
のどちらを使ってもアクセスできるようになっているのですが、内容同じでURLが2つにならないように、wwwなしのアクセスはwwwありに書き換えて、URLを統一していました。
が！ SSL化後も同じことをやろうとすると、転送で無限ループが発生し、正常にアクセスできません。.htaccessの記述は間違っていないし、だいたい過去には問題無かった箇所です。

これは処理に使っている環境変数の方がおかしいのかもと一覧で出力してみたところ、HTTP_HOST（SERVER_NAMEも）値が面白いことになってました。

http://simoom.net/ にアクセス
→HTTP_HOST=simoom.net

http://www.simoom.net/ にアクセス
→HTTP_HOST=www.simoom.net

https://simoom.net/ にアクセス
→HTTP_HOST=simoom.net

https://www.simoom.net/ にアクセス
→HTTP_HOST=simoom.net（←！！？！）

HTTP_HOST=simoom.netならhttps://www.simoom.net/～に送るという操作をしていたので、ループするのは当然です。
SAKURA Internet、何故こんな仕様？？ 他に代用できる変数もなし、困った……

と思っていたら、ちゃんと解決している方がおられました。
上級者向け設定、そう言えばそんなのあったなぁ；
→さくらでURL正規化を正しく行うSSLの設定方法 - はるかのひとりごと

なお、上記記事は有料の証明書を使う時のやり方です。
無料SSLでは、そのままの手順は使えませんが、だいたい同じ方法で解決できます。

このブログはあくまで「時空の塔」と「踊る金狼亭」のオマケだと思っていたので、各種ご案内などにはほとんど気を遣ってきませんでしたが、この際、少し整備しておくことにしました。
迷った時分かり易くを目指して……

• このブログに、専用の「案内所」を設置しました。
• これまで各サイトに個別に掲載していた案内文のうち、直接連絡の対象になりそうなものを、連絡先まとめ内の事前説明「その他」に移動させました。

と、3つそれぞれに案内所を作ったところ、今度は情報の在り処がばらけて分かり辛いような気がしてきました。いずれ、サイト毎に置いている案内所やご利用条件の類を、一か所にまとめるかもしれません。

色々と試行錯誤中です。
そもそもCardWirthの記事を作った時、別館扱いにしたのが拙かったようにも思えます。
家庭用ゲーム攻略と同じ個人の趣味という括りで、時空の塔の一コーナーとして、まとめて管理しておけば良かったかも……（後の祭り

※※※
案内文を移動させて、少々懐かしい気分になりました。
元々本館用に書いたものですが、当時、こういう事を事前にお知らせしておいた方が親切と思える程度には、メールなどで直接連絡してくる方がいらっしゃいました。今から考えると信じられないぐらい頻繁に更新していた頃の話です。
今はもう、サイト自体がほぼ死んでいるような。返信する余裕も有ったり無かったり。。。

本館・別館で別々に管理していた日記の類を統合しました。
対象は以下の3つです。

• 超不定期の何か。（不定期日記：時空の塔用）
• 踊る金狼亭・徒然（不定期日記：踊る金狼亭用）
• 翳の回廊 ver.2（らくがき置き場）

管理の手間を減らしたいというのが主な理由ですが、日記スクリプトを以前使っていたものの後継バージョンに変更する、たまにある内容かぶり解消等の目的も兼ねています。
前の所にブックマークやRSSの登録等されていた方は、お手数ですがこちらの方に変更をお願い致します。

今後は、ちょっとしたメモや日記的なものは、全てここ「砂塵の彼方」に投げ込みます。
その中でまとめてしっかりした記事にできるものがあれば、「時空の塔」や「踊る金狼亭」に反映させていく予定です。
落書きは、基本ここに隔離で。

※※※
以前との差は、落書きの更新がRSSに載らなくなった事ぐらいです。
あとは、テーマが混在するようになったために分かり辛くなった感が多少……。

※※※
日記のスクリプトにはfreoを使わせて頂いています。「創作サイト向けコンテンツ管理システム」と謳われていますが、ここのような雑記的な使い方にもとても便利です。スマートフォンにも本格対応しています。
前バージョンのWeb Diary ProfessionalやWeb Gallery Professionalも保守は続けられているようです。

（7/28追記）
統合前の各日記の記事は、全てこちらにコピーしました。
一部誤字脱字の修正やタイトルの整理などを行いましたが、文章内容の変更はありません。

不在中数年の間放置していたリンク集を整理しました。
去年末ぐらいにリンク先の状況を調べ始め、100件超を少しずつ進めて、やっと先月末に全てのサイトの調査を終わりました。どこも数年（もしくはそれ以上）ぶりです。

予想はしていましたが、リンク先は激変していました。かつて交流があった個人運営のサイトは、行方不明や最終更新がかなり前というところがほとんどです。年単位で時間が経過すれば、（私もそうですが）管理人さんの生活環境や興味の対象が違ってくるのも当たり前のことですね。歳月の移り変わりを感じます。

一方で、少数ながら最近まで更新が続いているサイトもありました。また、活動の場をSNSなどに移している方もいらっしゃいます。ご挨拶してくれば良かったかもしれませんが、何年もご無沙汰しているとさすがに顔を出し辛く、こっそり近況を確認しただけで逃げてきました。どうも根性が足りません。

○現存しているサイト
→必要な場合情報を修正

○閲覧不可
○元の場所に無くサイト名・管理者名いずれで検索しても移転先を特定できない
○移転先にリンクの可・不可に関する情報が無い
→閉鎖・休止カテゴリに移動


110件中
Forbidden …3
NotFound…20
閉鎖済み…4
転送サービスの登録切れ？…2
設置サーバがサービス停止/終了…4
サーバ自体行方不明…5
リンク目的の内容が消滅…1
何らかの理由で読み込みできず…3
移転先がリンク可能か不明…1

先日、サイト内で動的処理をしない部分について、文字サイズの固定と記事表示部の幅固定を外しました。ウインドウ幅いっぱいを使い、文字の大きさはブラウザの設定を基準とした相対的な指定になります。
この修正は2008年から密かに（？）進めてきたサイト改修計画の中で「スタイルシート無効でも大きく崩れない」を目標とした修正の次のステップにあたります。ブラウザの設定に従う事で、来訪者の方お一人ずつの事情に沿った個人にとってより見易い表示を目指そうとするものです。
2年がかりでようやくここまで来る事が出来てやれやれといった心境ですが、心配なのは、レイアウト崩れと、記事表示部の横幅が広くなった場合に整形のための改行をしていない文章が読み辛くなる事ですね。どうしたものか…。

企業や官公庁のサイトでも、文字サイズ・記事表示幅とも固定のところを結構見かけます。恐らくこれは「レイアウトが崩れる心配が無い」という意味での見易さを優先した結果だろうと思います（これまでの自分がそうでした）。
近頃のサイトでメニューから文章から全て画像になっていたり、FLASH表示だったりするのも、見た目の美しさに加え、レイアウト崩れ対策の面があるのかもしれません。

個人によって千差万別の「見易さ」を追及する事はゴールが無いマラソンのようなものです。たぶん正解はありません。
閲覧環境が多様化している今、どんな端末、どんなブラウザでも何の問題もストレスもなく閲覧可能を実現するのは非常に困難ですが、せめて「どんな環境でもそれなりに読める」ぐらいはいけたらなぁと思っています。が、それもまた厳しい道程ではあります。

※※※
改修工事、踊る金狼亭はこれで完了かな...。
時空の塔側はまだまだ。


（2011/2/7追記）
> 記事表示部の横幅が広くなった場合に（中略）読み辛くなる～
この記事を書いた時点ではスタイルシートでmax-widthの指定をすればたぶん問題解決と考えていたのですが、IEだけ上手く反映されない事が分かり、面倒になってそのまま放置していました。
が、最近になって、IE含めて解決できる方法についてとある方からミミヨリ情報を頂きました。興味がある方は下のリンクから飛んでみて下さい。

[外部リンク]
CSS Lecture｜min-width、min-height、max-width、max-heightをIE6でも実装する方法