Page Top

HTML5でのIE6表示とXHTMLでのIE6表示とでは、同じIE6でもブラウザ解釈のされ方が違うようだ。

May 17, 2013

今、XHTMLで作成したテーマをHTML5に組み替え中です。そこで気が付いたのですが、HTML5で組まれたページのIE6表示とXHTMLで組まれたページのIE6表示とでは、同じIE6でもブラウザ解釈のされ方が違うようです。XHTMLとHTML5とでは、構文が違うので当然と言えば当然なのかもしれませんが。。

XHTML時におけるIE6においては、widthとpaddingがあると、paddingを含めた数値がwidthになっていたために、これが他のモダンブラウザの解釈と大きく異なる部分(バグ)で、CSSハックなどを用いて対応していたわけですが、HTML5でだと、IE6でもどうやらモダンブラウザと同じような解釈をするようで、CSSハックを施していた箇所で、逆にレイアウトが崩れるという状況になっていました。なので、IE6用に施していたCSSを削除し、モダンブラウザと同じCSSにしたところ、表示が良くなりました。

と言いますか、いつまでIE6に対応するのかという部分なのですが。最近のHTML5サイトなどは、殆ど皆、IE6には対応していないようです。マイクロソフトもWindowsXPやIE6のサポートを「来年、2014 年 4 月 9 日 (日本時間) をもちまして、Windows XP、Microsoft Office 2003、Internet Explorer 6 のサポートが終了いたします。 by Windows」としているので、もう対応はしなくても良いのではないかという感じではありますが。今開発中のテーマの分からは考えるかもしれません。しかし、このIE6の為に、世の中のどれだけのウェブ関係者が時間を割かれ、無益な労力を払わされたことかと思うと、やっとこの時が来たのか~としみじみです。IE6が公開されたのが、「Microsoft Internet Explorer 6(マイクロソフト インターネット エクスプローラ 6)、(略称:Internet Explorer 6、IE6、MSIE6)は、マイクロソフトが2001年8月27日(日本語版は同年9月19日)に公開した、Internet Explorerファミリーのウェブブラウザである。 by Wiki」だそうなので、およそ12年。これだけバグがありながら、また、皆からやんや言われながらも、結構長生きなブラウザ様でございました。

明るい未来が垣間見える昨今のニュース

April 27, 2013

今、遅ればせながらもHTML5やMedia Queries、Viewportなどの情報を勉強しています。ここ数日でようやく全体イメージをつかめるようになってきました。今はWeb上に多くの有志の方が書いてくださっている参考ドキュメントが沢山ありますので、昔のように調べたいものがあったら本屋さんに行くであるとか、図書館に行くなどしなくとも、学ぶ環境がすぐ手元にあるのはなんとありがたいことでしょうか。

今日「介護ロボット、年内に安全基準策定へ(東京都)」というニュースを読みました。これによると、「介護用ロボットは、力のない女性でも、着用することで体の大きな要介護者を持ち上げることが可能になるなど、実用化が待たれている。」とありました。これを読んでとてもわくわくしてきました。なぜなら、未来は、このようなロボットの発達とWebの発達で今よりももっともっと便利な世界になるであろうと思われるからです(でも、それと同時にエネルギー革命も必要だとは思いますが。)

例えば、このような未来が垣間見えてきます(私の想像ですが・・)。
iPhoneなどは医療機器として使え(現在既に技術が確立されつつあります)、日々の血圧や心拍数など測れ、データがダイレクトに医師へ送信でき、スマートTVやタブレットなどで、医師と患者がブラウザを通して初診できたり(初診後、実際に医者へ)、上記の介護ロボット?補助ツールのお陰で、自宅での介護が楽になり家族と自宅で過ごせるお年寄りの方が増え家族の負担が減ったり、介護だけの分野だけでなく、この補助ツールは農業分野や建設現場などでも使える優れものになったり、近所にフィットネスクラブなどがなかったり、なかなか外出できない人でも、エクササイズクラブにブラウザを通して参加し、ブラウザを通してエクササイズを他のインストラクターや生徒達と行え、気軽に楽しめたり、将来タブレットやスマートフォンがもっと安価になれば、市が市民へ1人1台ずつ配布でき、市報などの情報も紙とネットで配信できるようになり、市と市民の情報やりとりが活発になり、コミュニティーが活性化し、自分が使わなくなって普通であればごみ化するものでも情報のやり取りの活発化により気軽にやり取りできるようになり、ゴミに出す前に人に売ったりあげることが出来たりして、ゴミの量が減ったり。HTML5の発達で、Videoのライブ配信技術により、誰でも簡単にコンテンツを配信することができ、それをスマートテレビで見たい人は様々なコンテンツを世界中のチャンネルの中から見ることができる、などなど。想像すると楽しそうなことが沢山あります。

上記の介護ロボット補助ツールなどは、高齢化が進む海外でもとても役立つツールとして、沢山使用されるようになるのでは?と思います。こういう分野での輸出も日本にプラスになると思います。実際、歯科医療でも、根管治療の際に使用される根管の長さを測るツール(根管長測定器)は、日本で開発されたもので、それが海外でも普及し使用されています。こちらでエンドドンティテイスの所で根管治療した際に、ピーとなる機械があり、何のデバイスなのか不思議に思ったのでネットで調べたら根管長測定器というものであることが分かりました。

と、このように明るい、楽しそうな未来が垣間見えてくる昨今のニュースや情報ですが、果たして自分がそのような技術が発達した未来でどこまで社会にお役立ちできるのか・・?ということも考えさせられるニュースなのであります。

【追記】調べていたら、このような動画を見つけました。

HTML5を勉強中

April 20, 2013

今レスポンシブWebデザインを始めるためのHTML5を勉強中です(と言っても、XHTMLでもレスポンシブWebデザインサイトは可能のようです。あと、Bootstrapも少し概要を学び中ですが、私の場合は・・あまり使用する場面がないかもしれません。。CSSコンパイラとしてサスやレスなどがあるようですが、Movable Typeでも出来る部分があるので、MTでいいのでは?なーんて思ってしまいます)。レスポンシブWebデザインは2010年から、HTML5はもっと以前から動きがありましたが、HTML5の仕様が定まっていなかったため、余裕を見て延ばし延ばしにしている間、MTテーマ開発に集中しすぎてしまい、HTML5の勉強をもっと早く始めていれば良かったと思っています。なぜなら、HTML5を使うことで、私が必要としていたセマンティックなコーディングを形成できるため、そして、CMSの構造に利用しやすいコーディングを形成することができるためです(しかし、考えてみれば、そのCMSテーマ開発にのめり込んでいたことは、このHTML5に通じるわけで、調度良い時期なのかもしれません)。もちろん、それ以外にもHTML5によって、スマートフォン、車、テレビ、電子書籍、未知なるデバイスへ情報が広がるところに、未来が面白そうに感じるのもその理由の1つです。

HTML5はこれまでのHTML4やXHTML1と、出来る事、概念や構造、ルール、コーディングの仕方が結構異なるので、まずはそこの部分から理解を始め(HTML5はこれまでのHTML、JavaScript、APIを総称して呼ぶこともあるようです)、今はセクショニングやアウトライン、コンテンツ・モデルや各々の要素の変更があったり無かったりの理解に努めています。

しかし、HTML5はこれまでのHTML4やXHTML1とはコーディングの仕方が結構異なり、タグも更にセマンティックな利用の仕方になっているため、その分ルールも以前より厳格化されたようで、これまでのコーディングの仕方よりもより注意を払って構造を考える必要があるのかなと感じています。と言いましても、これまでもXHTMLでコーディングを行ってきた折には、意味合いをいつも考えながらコーディングをしてきましたので、構造という点では同じ概念で大丈夫かと考えていますが、それをうまくHTML5のコーディングで表せたらと思っています。

私が便利だと思ったHTML5のコーディングは、セクションを使用したコーディングで、どの階層のセクションであっても、その中のヘッダーにH1タグを利用できる点(これはCMSのコーディングで役立ちます。これまではMTの方で条件分岐をしてヘッダーのレベルを変更していましたが、これで条件分岐をしなくても良さそうです)、そして、HTML4やXHTML1で言うところのブロック要素をインライン要素のaタグで囲むことができる点です(これはaタグがトランスペアレントというコンテンツ・モデルだからとのことです。)(HTML5ではブロック要素やインライン要素という概念は無くなり、コンテンツ・モデルという概念が導入されたようです。)

しかし、2012年12月17日にHTML5の仕様策定完了(2014年中旬頃にも勧告になるようです)になるまで、オンライン上の様々な有志の方が書いてくださっているHTML5の情報に策定前の変更前の情報があったりするので、そういう部分を気をつけながら最新情報を勉強するようにしないといけないなと思います。

そろそろレスポンシブWebデザインに

March 30, 2013

以前から、しないといけないとは思いつつ、開発に時間が取られ、後回しになっていたレスポンシブWebデザインですが、今日久しぶりにブラウザスタッツの解析を見たところ、29日(昨日)から30日(本日)の24時間にかけてアクセスされた中で、最も多い使用ブラウザは、なんと「Mobile Browsers 47%」でした。その内訳は、

- Android, 28%
- iPhone, 14%
- iPod Touch, 3%
- DoCoMo 2.0, 2%

というものでした。

Mobile Browserに続いて多かったのが、

- Internet Explorer 29%: IE 9.0, 18%、IE 8.0, 8%、IE 7.0, 3%
- Chrome 8%: Chrome 26.0, 1%、Chrome 25.0, 7%
- Firefox 6%: Firefox 19.0, 6%
- Safari 5%: Safari, 2%、Safari 6.0, 1%、Safari 5.0, 2%
- Web Crawlers 4%: Google Wireless Transcoder, 3%、Google Web Preview, 1%
- Other: 1%

というものでした。

と言っても、他のサイトではまた違うスタッツ内容で、モバイルからのアクセスはそれほど多くありませんでしたので、サイトの内容によって、その使用されるブラウザが異なるようです。このサイトでは様々な内容を記していますが、主に蕁麻疹や湿疹やアレルギーについて、そして、チェルノブイリ事故のことを記した記事に多くのアクセスがあり、上記のモバイルアクセスは、主にそのような内容の調べモノをする際に使用されている傾向があるようです。特に健康に関する事にモバイルアクセスが多いことがわかります。

と言う事で、重い腰を上げ、遅ればせながらそろそろレスポンシブWebデザインに取り掛からなくてはなりません。今年初めには、このモバイルに関したお問い合わせが幾つか来ていましたので、やっぱり始めないといけません!開発とレスポンシブWebデザイン同時進行でかなり大変ですが、頑張りたいと思います。

Canadian Geese(カナダ雁)が帰ってきた

March 30, 2013

最近は天気が良いので、よく早朝ウォーキングに出掛けています。近頃は暖かくなってきたこともあり、様々な種類の小鳥の囀りが聞こえて来て、本当に気持ちの良い朝が迎えられます。先日は今年初のブルージェイ(アオカケス)も見る事が出来ました。桜の蕾もゆっくりと大きくなりつつあり、少しずつ開花してきました。私たちが住んでいる地域は標高が100メートルほどあるので桜の開花は他の場所に比べると遅いのですが、昨日サウスバーナビー(フレーザーリバー近く)に行くと、既に桜が満開になっていてとても綺麗でした。

一昨日、いつものように早朝ウォーキング(7時半頃)に出掛けるのにアパートのエントランスを出ると、上からカナディアンギースの独特の鳴き声が聞こえてきました。あれ?珍しいな、もうカナダに帰ってきているのかな?と空を見上げると、カナディアンギースの一帯が一列に綺麗に列をなして、先頭のリーダーがクァ"ークァ"ーと鳴きながら列を引率している様子が見えました。なんと感動的なのでしょうか!

調度、こんな感じでした(↓)。私が見たのは、もっと綺麗に一列でしたが。
■Canadian Geese Flying over my house

偶然、こんな面白いカナダグースのムービーも見つけてしまいました。最後のガガガガーと低姿勢で走る姿が人間ぽくて面白いです。でもよく見ると、左手にネストがあり、雌のカナダ雁がたまごを温めているようです。だからこんなに攻撃的になっているのですね。納得です。しかし、どうしてまたこんな所にネストを・・。毎回人が通る度にこんなでは、グースさんも疲れてしまうでしょうに・・。

■Man vs. Canada Goose (ORIGINAL)