Weblog版　四方山話

メイリオのIE6とIE7比較

XPのSP3の公開と同時にXPで使える”メイリオ”フォントが公開されので、早々インストールしてIE6とIE7のフォント表示を見比べてみました。

IE6でメイリオフォントを表示するとアンチエイリアスがかからないため、ギザギザ表示になって読みにくくなって（汚い）しまいます。一方、XP版IE7のメイリオ表示はアンリエイリアスがかかり読みやすい表示になります。Windows版SafariではMSPゴシックにアンチエイリアスがかかることからもフォントのアンチエイリアスはアプリケーション（ブラウザ）に依存するということがわかります。因みにIE6であってもフォントサイズ（大小）によってはアンチエイリアスがかかります。

ということで、CSSからのフォント指定はIE7のみメイリオが適用になるように指定（例えば条件付コメント）してみましょう。
条件付コメントによってIE7だけフォント指定を変える場合は head に下記のように書き込みます。

<!--[if IE 7]>
<link rel="stylesheet" href="xxxxx.css"
 type="text/css" media="xxx">
<![endif]-->

Acid3テスト

■Acid2テスト
ブラウザのWeb標準対応状況（主にHTML、CSS）を診断するテストにAcid2テストがあります。過去数回にわたってこのAcid2テスト対応状況についてご報告したことがあり、OPERAとSafariはこのテストに合格しています。

「2006/3/13　OPERA9（Beta版）がAcid2Testに合格」

■Acid3テストが公開
3月初旬、HTTP、HTML、CSS、ECMAScript、SVG、XML のさまざまな機能が標準規格に対応しているかを測定するAcid3テストが公開されました。
テスト内容はDOM スクリプトを通じて100個のテストが実行されるもので、Benchmarkテストのように進行状況が動的に変化するものです。

IE、FF、OPERA、Safariでテストしてみましたので、結果は拡大画像からご覧ください（左の画像をクリック）。
多少なりとも新しい標準規格への対応が進んでいるだろうと思っていたIE7が実はIE6とスコアが変わらない、というのがある意味驚きです。SafariはWin版Mac版とも同ポイントで優秀です。私のメインブラウザOPERA9.26は残念ながら36/100で落ちてしまいました…（汗。

■OPERA9.5に期待
OPERAの開発BlogでECMAScriptのブラウザパフォーマンスを測定するBenchmarkが公開されています。早速「Performance test 1」を9.26で実行してみますと、円の数が100個になるとfpsが30～20まで落ち動作がかなり鈍くなります。一方9.5 beta版（Build9864）では200個になっても50fpsを維持し動作も軽快です。9.5は飛躍的にパフォーマンスアップしていることを体感できます。
更に開発版がAcid3テストをクリアした（つまり100/100）ということで、近いうちにリリースされるであろう9.5の正式公開が待たれます。
以上、OPERA利用者としては久々うれしい話題でした。

windows版 Safari3.1　リリース

3月18日 Apple製Windows版ブラウザ Safari3.1 がリリースされました。
Beta版3.0が昨年6月に公開され不具合修正を行い、このたび正式版として公開されました。

Firefoxと比較して最大3倍、IE7は最大2倍、OPERAなら最大5.5倍早いとアピールしています。ほんとかよっ！と言いたくもなりますが、過去Appleの公表するベンチマークはWindowsより遅かったためしがないですから（大笑）、話半分くらいに捕らえておきましょう。それにしたってOPERAの数値低すぎないですかねェ。

■ フォントに注目
初期設定でフォントにアンチエイリアスがかかっています。まるで新しいフォントセットでもインストールされたかのような？MS Pゴシックとは別物の表示です。
サイズによってはBoldが強すぎるかな？という感もありますが、Vistaでできなかったことを（あえてそうしなかったのか？）Appleが実施してきたことに驚きました。やはりMac（OSX）で養った技術があるからできることなのでしょう！

■ いたってシンプル
操作感はいたってシンプル、タブ表示にも対応しており扱いやすいブラウザです。またAcid2テスト合格のブラウザですからWeb標準に準拠した表示をします。

今後AppleはWindows向けのアプリケーションを展開してくるのでしょうか？Keynoteあたりは受けると思うのですがいかがでしょう！

Dreamweaver 10周年記念イベント

2008年2月20に「Adobe Dreamweaver CS3 10 周年記念イベント」が開催されました。
その時の様子がMacお宝鑑定団さんのページで紹介されています。

その中で世界で始めて開発中のDreamweaverCS4について情報公開がなされたようです。リンク先をお読みいただけるとお分かりいただけますが、ライブプレビュー、ライブコード、ポーズジャバスクリプト、スプリットコードビューといったものは（いずれも仮称と思われます）確かに便利な機能ですね。
個人的には、（1）スタイルシートの適用を外部style、style要素、style属性から都度指定できるボタン設置　→　style属性指定ができれば携帯ページ作成に便利だから　現状の「環境設定」からでは柔軟性に欠けるので　（2）CSS Hack対応自動記述機能のようなもの　→　例えばIE5.5対応とすればwidthのHackが自動書き込みされるとか、、、　手打ちで十分対応できますが、楽にページを作成する（単なる横着か！？）機能を充実させてほしいです。

Dreamweaverに限らずAdobe製品使用者はバージョンアップのたびに大金をお支払いしています！
スプリットコードビュー程度の改良（コードビューの分割、2画面化）は、次Verに先送りせずにCS3のアップデートで提供して欲しいものです！

CSS Nite in SENDAI　終了

「CSS Nite in SENDAI」が終了いたしました。
本日の様子は後ほど特設サイトに掲載されることと思いますが、心配された天候も雪がちらつく程度でほぼ予定通りの約140人にご参加いただききました。

開始予定10分前に受付が集中したため受付待ち行列ができてしまい開始時間が15分おくれてしまったものの、第1回目の開催としてはまずまず盛況であったのではないかと思われます。

私は本日実行委員として書籍販売を担当していました。

いつのまにか　PageRank5

当ブログがいつのまにかPageRank5になっていました。昨年までは”3”だったはずで（高くなるはずがなく）、当ブログはSEOを施しているわけでなく、また被リンクが多いわけでもなく、いやほとんど被リンクがない状況下でいつのまにか”5”になっていたのです。

因みにトップページ（スクールページ）はPageRank2で、超低いのです。こちらも被リンクが少ないですし、相互リンクサイトへの登録も少ないので当然でしょう。しかしながら、トップページ（スクールページ）はSEOを施しているので検索では上位表示が確保されています。PageRankの高い同業サイトよりも上位にあります。Yahooカテゴリーにも登録されています。それなのにこちらは”2”でブログは”5”。

これっていったいどうしてでしょう？　
ブログはページが多くなるとRankが上がるという記事を見た覚えがありますが、当ブログはまったく多くありません。ブログを始めてそこそこの年数になりましたが、量的には毎日書き込む人の1年分程度でしかありません。

説明できる方いらっしゃいましたら是非ご教授くださいませ！

被リンクとは： Google社が開発し、自社の検索エンジンに搭載している、Webページの重要度の判定技術。また、算出された各Webページの重要度の指数。 　「多くの良質なページからリンクされているページは、やはり良質なページである」 という再帰的な関係をもとに、ページの重要度を計算している。あるページから別のページへのリンクを、リンクされたページへの「支持投票」とみなし、それにリンク元のページの重要度(そのページの被リンク数)の重みをつけて加算し、投票数によりそのページの重要性を判断している。ページの内容は影響しない。 引用：IT用語辞典 E-Word　http://e-words.jp/w/PageRank.html

Adobe　アドビ認定アソシエイト　ACA

Adobeのサイトがリニューアルされたようですね。トップページといくつかの扉ページはXGAに最適化されたサイズ（width1000px程度）になったようです。

さて、11月には公に告知されていた「アドビ認定アソシエイト　ACA」試験の詳細が数日後には公開されるようです。ACAとは、Dreamweaver8（CS3）とFlash8（CS3）のスキル認定資格です。

Dreamweaverの認定資格MMCPはMX2004で事実上終了、Adobeになってからは英語版の試験（V8）しかありませんでしたから、個人的には取得意欲満々です。レベル的には、従来からあるACEやACPといった高度なスキルの認定ではなく、エントリーレベルのスキル認定のようです。

主催がアドビ システムズ社でCertiport社が開発、日本での実施と運営は株式会社オデッセイ コミュニケーションズ社が行います。株式会社オデッセイ コミュニケーションズ社は Microsoft Office Specialist 試験の運営会社ですから、当教室でも試験会場として登録できるはずです（まだその詳細連絡はありませんが）。
2008年1～2月には始まるようですので、試験を受けたい方は是非当教室で受験してくださいね！。

12月11日 追伸 ：アドビ認定アソシエイト公式サイトがオープンしたようです。（http://adobe.odyssey-com.co.jp/aca/top/）

Spryテスト　Appleサイトのようなメニュー動作

Appleサイトのサイドメニュー部にマウスを重ねると、メニュー内訳が自動表示（縦に拡がる）されます。
この動きはDreamweaverCS3に備わっている「Spry（スプライ）」を使って簡単に設定することができます（Spryテストページにて動作確認ができます）。

初期設定では（アコーディオンパネルという）クリックすることによって内部表示されるようになっているのですが、jsファイルを一箇所修正するだけで動作を変更することができるのです。
どこを修正するのかと言いますと、、、

まず、Spryを実装しますと「SpryAssets」フォルダが生成されます。そのフォルダ内の「SpryAccordion.js」ファイルをエディタで開きます。

#280行目　　if (tab)
#281行目　　{
#282行目　　var self = this;
#283行目
Spry.Widget.Accordion.addEventListener
(tab, "click", function(e) { return self.on
PanelClick(panel); }, false);

283行目にある　"click"　を　"mouseover" に変え上書き保存します。
これだけで！マウスに反応するアコーディオンパネルになります。なんて簡単でしょう。

DreamweaverCS3をお持ちの方はどうぞお試しくださいませ。

ブラウザの文字サイズ 最大が半数以上って本当？

Business Media 誠：「ブラウザの文字サイズ最大」が半数以上――家庭用PC

リンク先の記事によると、ブライト・ウェイ社（コンサルティング会社）が運営している子育て支援サイト内でアンケートを実施したところ、「ブラウザの文字サイズ最大が半数以上だった」と報告されています。

「最大」が半数以上だけでも驚いたのですが、「最大」と「大」を合わせるとなんと8割を超えています。
文字サイズについては初期設定の「中」で利用している人が多いだろうと思っていましたから（Internet Explorer 使用者がわざわざ設定変更しないだろうという先入観）、この結果には驚きました。
文字サイズを最大にするとレイアウトが崩れ、見難さが増すことも少なくありません。何よりも文字サイズ固定（制作者サイドでピクセル指定）サイトがまだまだ多く、つまり「最大」にしても反映されないのが実際です。

それでも勝手に解釈を加えると、このアンケートは子育て中の人が対象なので、モニターをじっくり落ち着いて見られないことが多く（赤ちゃんのお世話で）、多少距離が離れていてもチラ見で読めるよう常に「最大」にしているのかなーと。

「子育て」をキーワードにサイトを閲覧してみても文字サイズ固定が多く、サイズ変更に対応しているサイトが多いとは言えないことが分かります（調査会社の「こそだて」サイトも文字サイズ固定で作られていますね）。
近頃は制作者側で文字サイズを固定（絶対値）せず、閲覧者側で変更できるように設定（相対値）しているサイトが増えていますが割合的にはまだまだでしょう。

Webアクセシビリティが叫ばれて久しいですが、文字サイズ変更は高齢者向け対応として考えてきていましたが、ニーズは多種多様なところにあるものだと改めて実感した次第です。

Fireworksの起動に関する不具合対処

FireworksMXからバージョンアップでMX2004→8→CS3（以降FWと略します）とインストール（更新）して使用しています。通常”後入れ”ソフトがデフォルトの起動ソフトとして登録されるであろうと思うのですが、そのようにいかないことがあります。

どのような症状なのかといいますと、DreamweaverCS3のファイルパネルからpngファイルをWクリックしたりRoundTrip（ラウンドトリップ）機能を使ったりした場合に、FWCS3が起動せず8やMX2004が起動してしまうという不具合の発生です。
Fireworksの問題というよりDreamweaver側の設定に問題がありそうだというのが想像できます。

Dreamweaverをお使いの方なら環境設定に[ファイルタイプ/エディタ]という項目があり、Fireworksのプログラムパスの指定、pngファイルの起動プログラムのプライマリ指定をすることができるのはご存知でしょう。当然この設定がCS3になっていることを確認します。

これで解決？いえいえこれでは解決しないのです。相変わらず8やMX2004が起動してしまうのです（環境設定でパスの指定が正しくできても、複数のFWやFlashがインストールされていた場合にはバージョン表示がないためにプライマリ指定を確認できないのが問題なのです）。

それではどんな対処が必要なのか、とりあえず自分で見つけた対処方法を覚書しておきます。

1）レジストリエディタを起動

2）HKEY_CURRENT_USER → Software → Adobe → Dreamweaver9 → Helper Applications Preferences　とたどる。

3）Helper Applications Preferences　キーの　Fireworks Path が　FWCS3プログラムパスと相違がないか確認。

---　この後が肝心　----

4）Helper Applications Preferences → Editer Group0 キーの Editer Path0～3（連続数字）を確認。

5）Editer Path0 のプログラムパスがMX2004か8になっているはずなのでCS3のプログラムパスに書き換える。

6）Primary Editor の値が0になっていることを確かめる。

以上の処置で終了です。

Helper Applications Preferences 下には Extension Group キーがあり、そのキー内では拡張子が登録されているようです。その拡張子と連動し起動するアプリケーションが Editer Group キーで指定するということになっているようです。

一般的に、アプリケーションと拡張子の関連付けは、[コントロールパネル]→[フォルダオプション]→[ファイルの種類]で行いますが、本件の場合はそれで解決しませんので上記のようは方法で対処します。但し自分で見つけた方法ですので、他に簡単な設定方法があるかもしれません。
因みに configration フォルダ内の configrationReadMe ファイルには各種設定情報が掲載されています（本件の情報はなし）。

CSS Nite in SENDAI　Webサイト公開

本日「CSS Nite in SENDAI」のWebサイトが公開されました！

開催日時や場所は、2008年1月12日（土）　13:00～（予定）、せんだいメディアテーク（7Fスタジオシアター） 仙台市青葉区春日町2-1　で行われます。

このイベントは、著名クリエイターを講師に招き、プレゼンテーションやデモンストレーションを通して、「最新鋭のWeb制作のノウハウ」や、「最先端のWeb標準に関する情報」を参加者全員で共有できるセミナーイベントです。

私も微力ながら実行委員会の一員として準備活動をさせていただくことになりました。
Webに携わっている方はもちろんのこと、Webに興味関心のある方も是非ご参加くださいね。そしてあなたのBlogでも是非ご紹介をお願いします！

CSS Nite の仙台開催決定！

CSS Nite　の仙台開催が決まったようです。日程は2008年1月12日（土曜）、メディアテークで行われるようです。前日にはApple Store sendai　で前夜祭イベントも行われるようです。
青森、秋田、岩手、と南下してきまして（やはり東北は北から動き出す南下政策なのですね、、、笑）、いよいよ仙台開催です。
さて、テーマは何になるのか今から楽しみです。

追記：岩手はCSS Nite開催ではありませんでした。今週の土曜日に開催される「IWDDミーティング」にCSS Nite主宰の鷹野さんが講師として招かれるようです。

Spry（スプライ）をテスト

Adobe社から Creative Suite 3 が発売になって2ヶ月が経過しようとしています。
「Adobe Creative Suite 3　Web Premium」を2ヶ月弱使ってみましたが、Illustrator や Photoshop が Dreamweaver や Fireworks と連携されており、まさに強力なWeb Suiteになっています。

そろそろ教室の講習メニューに組み込みたいと思っているのですが、テキストとして使うための書籍がまだ発刊になっていません。以前から長いこと使い続けているものがあり、そのCS3対応版を待っているのですが出てくる気配がありません。そのテキストが出れば当教室の講習をCS3対応としようと思っているのですが、まだしばらく後になるかもしれません。
本来自分でテキストを作成すればよいのですが、さすがにこの領域はボリュームがあってすべてオリジナルテキストとするのはシンドイです（でも作りたいと思っている）。

さて、このような状況ではありますが、Dreamweaver CS3 の新機能の一つAjaxをベースにした「Spry（スプライ）」という機能をご紹介しておきましょう。このSpryはJavascriptの知識がなくても簡単に設置でき且つCSSによってデザインの変更ができます。テストしてみましたので興味のある方はリンク先をご覧ください。

消えるCSSの謎 2

昨日のつづきです。
何をやったら消えてしまうのかその原因を探るべく検証してみたのですが、CSSファイル内にimage挿入の記述があった場合（例えば　background-imageプロパティで url(images/backimage.jpg) といった記述）、そのイメージファイルをリネーム、移動を行った場合、あるいはCSSファイルそのものを移動することによってイメージファイルのリンクパスが変更（更新）されてしまう場合に起るようです。それらは一度に大量のファイルを変更（フォルダごと移動、更新）するから発生するわけでなく、単独の場合でも発生するようですからこれは大ごとです。

しかし、ここで腑に落ちないのが、メーカーで修正batchを提供していないようですし、Dreamweaverの欠陥として大騒ぎになっていてもおかしくない問題なのに騒がれていないんじゃないか？ということです。そして私自身これまで長いことDreamweaverを使って上述の作業を繰り返してきているはずなのに、CSSファイルの中身が途中から消えてしまうといったことは初体験だということです。何か複数の要因が重なってと起っていると思うのですが（ファイルサイズのことも）、検証に疲れましたので先送りすることにしました（あしからず）。　　すみません　　m(__)m

この件につきましては、ネット上に下記の記事を見つけています。T-Studioさんとカラクリエイトさんは書籍の執筆やCSS niteでもおなじみの方々です。
Dreamweaverをお使いの方はご覧になってみると良いでしょう。

• CSSがごっそりと消える件　T-STUDIOさん
• 書き連ねたCSSが一瞬ではらりと消える　カラクリエイトさん
• Dreamweaver 8 ファイル破損事故　corns blogさん
• DW8に振り回された　Web職人への長い道のりさん

消えるCSSファイルの謎 1

ちょっと大げさなタイトルをつけてしまいましたが、何のことかと言いますと、Dreamweaver8で作業中にCSSファイルの中身がごっそり削除されてしまう（消える）という不具合のことです。

先日ある法人client様の依頼でWebサイトのリニューアルページを作成しました。トップページを含め10ページに満たない程度の作成だったものの、Web標準に準拠しフルCSSレイアウトにて作成（CSSファイルは7点）をしました。
すべて出来上がってから、client様の作業環境を踏まえてフォルダの作成やページの移動（リンクの変更）を行いました。これらの作業はDreamweaverのサイト管理機能を利用して行います。
いつもなら、制作作業の初期の段階で確定していることなのですが、今回は途中にファイル構成変更が何度もあったため、最終段階で整理することになったのです。

この作業が終了して「納品」となるはずでした。

Dreamweaverをお使いの方はご承知のように、ファイルパネル内でフォルダやファイルの作成、修正、移動などを行えば自動的に各HTMLファイル間のリンクを更新（修正）してくれます。 実はこの便利機能に不具合があって、「ファイルの中身が消えてしまう」という情報をBlog情報で見たことがあります。そうだとしたらこれは大問題なのですが、Dreamweaverを長いこと使っていて、自分自身の環境下ではこのトラブルは発生したことがありませんでした。再現性があるならメーカーも修正batchを提供するだろう、ぐらいに考えて深刻に捕らえていなかったのです。

フォルダやファイルの移動を行い、更新ダイアログを確認しつつリンクチェックをするためにプレビューを行ってみました。すると、ページのレイアウトがズレまくっているではありませんか。CSSファイルのリンクチェックしても問題ありません。「まさかっ」と思いCSSファイルの中身を見てみて仰天、76行目以下すべて消え去っていたのでした！

CSSファイルは7点あったのですが、1点だけ中身が消えておらず、消えてしまった6点と比較して分かったことは、ファイルのデータサイズが1KB以上のものがデータ削除の対象になっていたということです（無事だったCSSファイルは733バイト）。そして1KBを超えるデータ部分が消去されており、よって6点のファイルはみな1KBのファイルになっていたのです。

ということでせっかく出来上がったページでしたが、数日かけてCSSファイルを構築しなすことになった次第です。こんなときに限ってバックアップは3日前しかとっておらず、ほとんと最初からやり直し状態でしあ。まったく　とほほっ　です。

しかしなぜこの不具合がおきてしまったのかを究明しないことにはすっきりしませんし、またトラブルはおこってしまいます。

原因は何なのか、長くなりましたので、それは次回に「続き」とします。