最近のメモ
2005年3月28日(日)
移転します
FC2ブログに移転します。
- サイト制作メモ(FC2版)
実は少し前からFC2ブログでも書いていました。 そのころはFC2ブログのサブドメイン化の実装が一部のサーバーで実験的に行われていた段階で、 最近になってすべてのサーバーでサブドメインアクセスに対応したので告知しておきます。
移転の理由は主に以下のとおり。
- ブログだと過去ログの管理が面倒でない(しかも無料)。
- FC2ブログは広告も Valid だから精神衛生上よろしい(忍者ツールの広告もそれなりにまともだけど、<br>や target="_top"が使われているので HTML4.01 Transitional で書くしかない)。
- ログのインポート、エクスポートができる。
- HTML, CSS, JavaScript ファイルをアップロードできる。
- 共有テンプレート機能が面白い。
以下雑記。
HTML3.2 に対して、HTML4.01+CSS は、たしかに表現力が大きく、柔軟でべんりであるが、その良さをある程度、実感するには、HTML3.2 で低水準の仕事をすることも必要かもしれない。
<font>や<b>、レイアウトテーブルなどを駆使した物理マークアップの煩雑さは、CSSレイアウトに移行することで解放される!CSSって便利! という過程を自分は経ていません。勉強をはじめた時点で HTML4.01+CSS だったからです。物理マークアップは面倒そうだなと類推するだけです。
表現される内容(シニフィエ:例「強調」)と、表現手段(形式、シニファン:例「太字」)の区別は、実際には、相対的なものにすぎない。
構造と表現の分離といっても、このサイトではCSSを外部ファイルにしているだけで、HTML部分ははじめに作った「形式(まず日付があって、見出し、本文、更新日がある)」をそのまま使っています。 「初出」「最終更新日」のところは ul 要素としてマークアップしてあるのですが、やっぱりdl 要素のほうがよかったかもと思ったり、変な class 名を直したいと思っても、今さら全部書き換えるのは面倒です。
それがブログ(まぁブログに限りませんが)ならテンプレートを書き換えるだけで解決します。 必要なときに全ページの HTML を(もちろん CSS も)一括変更できるのです。ブログを試してみて、今まさに「これは便利!」と実感しているところです。
2005年3月19日(土)
さらば、ととほ
(制作者CSSが有効になっているなら)ページの右のほうにある「リンク柱」にとほほのWWW入門が見えるはずです。 「WWW入門」を謳っていますが、少なくともホームページ入門としてはあまりおすすめできません。
とはいえ、逆引きリファレンスやHTMLリファレンス、スタイルシートのコーナーは「便利」なので以前はよくお世話になっていました。 しかし最近ではめっきり利用しなくなりました。もうすぐHTMLを勉強し始めて1年が経ちます。この1年をちょっと振り返って見ます。
The Web KANZAKI との出会い
2004年の3月末日、ホームページでも作ってみようかという気まぐれで HTML の勉強を始めました。 入門書を買うのは嫌(ケチなのです)なので、とりあえず Google で検索するわけです。HTML やタグという言葉は知っていましたから「HTML 入門」などのキーワードを使ったと思います。
最初に出会ったページがThe Web KANZAKIのごく簡単なHTMLの説明だったのは幸運でした。 間違いだらけの解説サイトや本で誤った知識を得てしまい、のちにPC Tipsなどで感銘を受け正しい HTML に覚醒する、というよくある「遠回り」をせずに済んだのです。
また、2004年ともなれば、ほとんどのブラウザで CSS をそれなりに解釈できる状況になっていたため、最初から CSS を前提に HTML について学ぶことができました。 ですから、fontタグはほとんど使った記憶がなく、centerタグなどは一度も使ったことがないと断言できます。
つまり、マーク付けレベル診断でいうところのLevel 1〜4をすっ飛ばすことが出来たのです(ただしこの時点ではLevel 5には至っていません)。
で、とほほのWWW入門
初心者向け HTML 解説サイトの「定番」であるとほほのWWW入門にもやはりたどり着きます。 正しい HTML 推進派(?)からは嫌われているらしいとほほですが、当時の自分にはとても「便利」なサイトであったことは確かです。
包含可能要素、サポートしているブラウザ、ソースの例、表示結果等がコンパクトにまとめられているのです。 使いたいと思ったタグ、プロパティをすばやく参照できる、この点はなかなか優秀だと思います。
とほほの最大の欠点(HTMLの入門サイトとしては駄目)は、The Web KANZAKIでHTMLの基本を学んだ自分にとって、問題にならなかったのです。
Another HTML-lint
さて、ちゃんとした解説サイトを読んだからといってすぐに Web ページが作れるようにはなりません。文法事項を覚えるのはやはり大変です。 そして出会ったのがAnother HTML-lintでした。 4月頃には、HTML を書く→lintで採点→減点箇所を直すの繰り返しで文法を覚えていきました。よくある話です。
"いろは"の先のCSS
8月。Internet Explorer 6.0と Netscape 7.1の表示結果の違いに苦戦していた時期です。 某個人ニュースサイト経由で"いろは"の先のCSS 第4回に出会いました。 これが自分にとってのセカンドインパクトです(ファーストは KANZAKI)。
lint によって文法事項にばかりとらわれていた自分に、マークアップの本質を思い起こさせてくれました。 また、全称セレクタによるブラウザのデフォルトスタイルシートを殺すテクニックもここで覚えました。
リニューアル
9月。それまでのサイトを全面リニューアルしました。マークアップの不出来に耐えられなくなったのです。 CSS 切り替えスクリプトなども導入してみたり、この頃になると HTML や CSS をいじることのほうが面白くなってきます。Level 5です。
Firefox1.0日本語版登場
11月。待望の Firefox1.0 日本語版がリリースされました。これを期に Opera もインストール。 表示確認用ブラウザは WinIE 6、Netscape 7、Opera 7、Firefox 1.0になりました。 メインで使うブラウザもこれまでの IE(すっぴん!)から Firefox に切り替えました。
さらば、とほほ
12月末。このサイトを作ったとき、ブックマーク代わりにリンク柱を設けました。 一応とほほも載せましたが、このサイトからとほほに飛んだ記憶はほとんどありません。 考えてみれば、もう自分にはとほほに載っている程度のテクニック(?)は必要でなくなっていたのです。
この頃の(そして今も)関心事といえば、より適切なマークアップ、見やすいスタイル、クロスブラウザなどでした。
Alternative Design Project
2005年1月。Alternative Design Project を発見。 互換モード IE を考慮した CSS テクニック、自然なマークアップを維持しつつ見栄えの良さも追及する方針は、ちょうど今の自分の志向にぴったりでした。
結局……
そして今に至るわけですが、何故タイトルを「さらば、とほほ」なんかにしたかというと、 かつての「便利なとほほ」を自分用に作ってみようというのがこのサイトの趣旨だからです。 自分にとって必要な知識を自分でメモしてサイトにする。それがサイト制作メモなのです。
というのは建前で、実はとほほなんかをリンク柱に載せてしまったことへの言い訳です。
2005年3月17日(木)
過去ログ
index ページが大きくなってきたので分割しました。個別の記事にリンクしてくれているサイトへの対応として過去ログの目次を用意します。
2005年3月7日(日)
StrictなHTMLを書く人にはアニオタが多い?
HTMLに関する議論(正しいマークアップとは何ぞやとか)をしているサイトは読んでいて面白いんですけど、 そういうサイトではアニメやエロゲの話題も扱っている場合が多い気がします。
と思ったけど、単に自分がアニオタだというだけか。
2005年2月18日(金)
FC2ブログがすごい
実はFC2ブログでもサイトやってます(メインではありませんが)。
レンタルブログサービスはFC2ブログしか利用したことがないので他と比較することは出来ませんが、 FC2ブログにはかなり満足しています。特徴を書き出してみると、
- 容量はテキスト無制限、アップロードファイル1GBまで
- アップロードできるファイルは、250KBまでの拡張子が jpg,gif,png,mid,swf,ico,mp3,html,txt,css,js,rdf のもの
- パスワード制限を可能にしたプライベート機能あり
- 商用可
- 携帯から自分のブログに投稿可能
- HTML,CSSの編集が自由
- 共有テンプレート機能により、膨大なテンプレからデザインを選べる
- 広告が控えめ(今のところ。しかもValid HTML)
- Valid HTML 志向
ではひとつずつ細かく見ていきます。
- 容量はテキスト無制限、アップロードファイル1GBまで
最近では goo ブログや Yahoo! ブログ、livedoor ブログでもこれくらいの容量は当たり前になっているようです。 それらの有名ブログサービスにひけを取らない十分な容量です。
- アップロードできるファイル
HTML ファイルや CSS ファイルまでアップロード可能。普通のホームページスペースのように使うこともできそうです。 ただ、ひとつのファイルは250KBまでという制限はあります。
- プライベート機能
パスワード制限により知人、家族のみ閲覧可能といったサイトにすることができます。 なかなか珍しい機能ではないでしょうか。
- 商用可
Amazon アソシエイトや Google アドセンス等、アフィリエイトも自由。
- 携帯から自分のブログに投稿可能
FC2のモブログって?を参照。
- HTML,CSSの編集が自由
テンプレートを自分で一から作れます。作ったテンプレートは共有テンプレートに登録可能。
- 共有テンプレート機能
他の人が作ったテンプレもそれが共有テンプレートに登録されていれば使えます。結果、選べるテンプレは膨大な数に。
- 広告が控えめ
広告は今のところ控えめです。それよりも自分にとって重要なのは、広告として出力される HTML が Valid な点です。 かつては div 要素や br 要素 や target 属性が広告に含まれていてうざかったのですが、今では広告はインライン要素として出力されます。余計な br 要素や非推奨要素/属性もついてきません。 とはいえ、今後変わるかもしれないので油断はできませんが。
- Valid HTML 志向
途中から広告が Valid な HTML になったのは開発関係者にそのような志向の人がいるからです。 共有テンプレート機能によってテンプレのHTMLの正当性は混沌としてきましたが、 公式テンプレートの一連のシリーズ(cfdn系テンプレ等)は Strict HTML + CSS レイアウトという素晴らしいものです。
こんなに高機能なのに無料でいいのか?FC2大丈夫か?と心配になってくるほどです。 不満というか要望(1エントリーにカテゴリを複数設定できないとか)もあることはあるんですが、そのうち実装されそうな雰囲気です。
このサイトもFC2ブログに引っ越そうかと思ってしまいます。
2005年2月5日(土)
『moetan 2』の例文採用記念品が到着
サイト制作には英語の知識も多少必要です。 というわけで『もえたん2』なわけです(大嘘)。
実は『もえたん2』の例文募集にいくつか投稿していまして、見事採用されたようです。 採用者には記念品が贈られるということでしたが、それは「『moetan 2』用特製ブックカバー」でした。 送られてきたのは以下の3点。
- 『moetan 2』用特製ブックカバー A
- 『moetan 2』用特製ブックカバー B
- 『moetan 2』用クリアチェックシート(三才Web直販特典と同じ)
この特製ブックカバーは「moetan2」用に製作された別案で、2種類ございます。 検討の結果、諸事情により採用は見送られましたが、このまま封印するには惜しい出来映えでしたので、投稿御礼用の非売品として限定生産させていただいたものです。
諸事情により採用は見送られました
とありますが、なるほど、これは採用は無理そうです。
特にカバーB(写真上)はぎりぎりアウト!って具合に、見えてなさそうで見えてると言えます。
正式版のカバーはハイブリッド仕様ですが、これは普通のカバーでした。裏面は真っ白です。
サイト制作にちょっとだけ関係ある話
上で、『もえたん2』、『moetan 2』と表記が統一されていないのは、「もえたん」で検索されてもヒットするようにです。 正式には『moetan 2』だと思いますが、前作が『もえたん』だったので、「もえたん2」で検索してくる人も多いだろうという考えです。
まぁこんなサイトに「もえたん」を求めてこられても意味ないですが。
詳解HTML&XHTML&CSS辞典に改訂版が登場
- 詳解HTML&XHTML&CSS辞典
-
- 単行本: 561 p ; サイズ(cm): 21
- 出版社: 秀和システム
- ISBN: 4798010030
- 改訂版 (2005/01)
- 大藤 幹 (著)
最高の辞典系解説書と言われる『詳解HTML&XHTML&CSS辞典』に待望の改訂版が出ました。 Amazon.co.jp のレビュー(改訂前)を見ても評価の高さがわかると思います。 おすすめの解説書として某方面では有名な一冊だったんですが、すでに絶版になっており入手の困難さがネックでした。 改訂版が出たことで、おすすめ解説書の筆頭になりそうです(ただし初心者向きではありません)。改訂前より少し安くなっているのもうれしいところ。
2005年1月29日(土)
更新予定
サイトのディレクトリ構成とかナビゲーションとか過去ログの見出しレベルとかどうしようか迷い中。なのでなかなか更新できません。 とりあえずこれから書く予定のことを忘れないようにメモしておきます。
- ドキュメントタイプスイッチ
- IEでよく引っかかるバグ
- リンクアンカーをURLにすることついて思うこと
- サイト名(h1 要素)の装飾
- 外部リンクにアイコンを付加する
- id、class 属性について
- 会話文のマークアップ