FONTWORKSのウェブサイト、テキストの基本書体が「FOT-筑紫ゴシックWeb Pro M」でとてもきれい。筑紫ゴシックも明朝もWebフォント版が使える時代。カネかかるけど。
タグ: HTML/CSS RSS コメントスレッドの表示 / 非表示 | キーボードショートカット
-
noiz
-
noiz
仕事ではIE7が捨てられないので結局新しいことはなにもできない。
-
noiz
あーIE、CSS3で規定された複数の背景指定にまだ対応してないんだった。なんでこんなことでコードふやさなきゃなんないんだよ…
-
noiz
アレクサンダー・カルダーの作品を使ったGoogleのロゴ、canvas要素+JavaScriptで実装されてる。
-
noiz
Long live XHTML
HTML5ではほんとに一つの文書のなかでHTMLシンタックスとXHTMLシンタックスを混在させてもいいのかなと思いながらHTML5のワーキングトラフト(草案)を読みつつ他の文書をリサーチしていて出会ったこれ、 Thinking XML: The XML flavor of HTML5。たぶん機械的な和訳より原文あたったほうが気分が分かるような気がする。
たとえば、「XHTML は死に、XHTML は永遠に」と訳された見出しはこうだ。
XHTML is dead. Long live XHTML
語感の問題にすぎないけれど、「XHTMLは永遠に」より「XHTMLよ永遠に」のほうが哀惜をこめているようでしっくりくる。どっちにしたってXML/XHTML派は泣けてくる内容。Uche Ogbujiはこの文書泣きながら書いたんじゃないかという気さえしてくる。そうだ。XHTMLはほうむられた。ベンダ側の逆襲にあってW3Cは負けた。おかげで「現実主義」のHTML5が今後のウェブマークアップ言語のスタンダードになる。
あと、the desperate web hacker って、「必死の Web ハッカー」というより「やけのやんぱち(ヤケクソ)web ハッカー」でいいんじゃないかと思います。
これを読んでから、アンサイクロペディアのW3C項を読んでさらに泣くか、あるいは笑うかはその人しだい。
-
noiz
IE地獄
賃労働でコーディング中のサイト、今後のメンテも考えてHTML5で組んでいる。またサイトの仕様上、いわゆるモダンブラウザが実装するCSS3のプロパティも使っているのだが……それが間違いのもとなのかもしれない。生産性あがんねーとか賃金奴隷が考えてもしかたがないんだけど、省力化をもくろみながら下ごしらえで時間がかかるという。
まず Internet Explorer 9 以前の IE で HTML5 のエレメント(の一部)を解釈できるように IE9.js を適用(IE固有のバグもあるていどは潰してくれる)。また CSS 対応をよりましにするため PIE.htc も使用。あとは各旧バージョンの IE 用に適宜プロパティを使用するだけなのだが、ここまでくるのにだいぶ時間をついやしてしまった。こういうしょぼい職能も習得すればあとあとラクできるわけだけど、むなしい。
IEでCSS3対応させるためのスクリプト(htc)はいろいろあって試験にまず手間をとられた。なるべくなら軽い方がよいので border-radius.htc や ie-css3.htc も試したが期待通りにはいかず。border-radis.htc では入れ子で角丸処理ができず、ie-css3.htc では四隅まとめての角丸処理が不可能で個別の設定がきかないためペケ。それで PIE.htc に落ち着いたのだけど、border-radius 以外の shadow や gradient などの処理にも対応しているせいか、この手の htc のなかでは大きい(33kb)。
(htcなんぞは使わない角丸処理について解説した「世界初!たった2行のコードで角丸のスタイルを実現する方法」を読み、IEってやっぱり鬼っ子扱いなんだなあと声に出して笑いそうになった)
Web2.0とやらのせいでプロデューサーからは glossy な反射光を画像にほどこすように(いちいち画像ごとに編集せずに)との要請あり対応したけど(空のspanで別途glossyな画像を用意してアクロバット的に処理)、これなんの意味があるんだろーと思いながらようやく地獄の一里塚あたりにたどりついたくらいか。
-
noiz
IE6のせいで午前様だよおい。PNG対応がクソなレガシーIE死すべし。
-
noiz
opacityが効かないIEむきー
-
noiz
なりものいりのIE9でさえCSSのグラデーションに対応してねっす。なんでfilterなんて独自拡張機能つかわなきゃならんの。しかも開始と終了のポイントしかおけない手抜き仕様いぇ~い!
-
-
noiz
仕事でHTML5のリサーチをしていて知ったSVG女子。SVGでつくったアニメーションがすげえ、けど「女子」記号の意味がさっぱりわからん。HTML5のサポートが進んだWUA(ブラウザ)でプラグインなしで問題なく描画できる。
なお日本語環境での公開はIE9製品版のリリース(4/26)にあわせるとか。現在はFirefoxやChromeなどのいわゆるモダンブラウザで、言語設定の優先順位を日本語以外にすると閲覧できる。Chrome(10.0.648.204)のほうが Firefox(4.0)よりレンダリング処理が速かった。
でもこういう視覚的なスプラッシュを見せつけたい場合って、コーディングができても絵が描けないと意味ないよな……
-
noiz
そうか、IEがクソずれやがるという問題、CSSで
/* IE6-7 */
* html セレクタ {}/* IE8 */
head~/* */body セレクタ {}/* IE以外 */
html:not(:target) セレクタ {}と記述すりゃいいんだ。CSSハックとかいうやつでなんとかなんじゃん。でもMirosoftはどうしてこんなにダメなブラウザを世に送り出すんだろう。いやがらせとしか考えられない。
-
noiz
CSSで和文と欧文の書体を混植してみる。するとIEでは、混植テキストのベースラインが和文のみのテキストより1px下方向にずれてしまう。クリッカブルなボタンの内容を示す文字列をテキスト×ブロック要素で構成する必要があって、ボタンを横並びさせたところで気づいた。ふしぎなことに、混植指定してあるスタイルシートが適用されるテキストに欧文(英数半角)が含まれていなければずれないこと。うへえ…IEでのずれの原因ってここらへんの実装のまずさが影響してるんだろうと疑心暗鬼。もちろん他のメジャーなWUAではずれない。IEでのずれを見た目でごまかそうとpx単位でいじってると、今度はもとからずれてないWUAでの表示がずれる(あたりまえ)。IE追放!
攝津正 10:04 12/07/2011 パーマリンク
XML(XHTML)はほうむられたのですか? 事情よく分からないのですが。
noiz 17:52 17/07/2011 パーマリンク
正確にいうと葬られたのはXHTML2.0です。あとたぶんXFormsも風前の灯。XHTMLの構文じたいはHTML5のなかで生き延びました。まあでも、企業や団体しかメンバーになれないW3CがWHATWGに屈服したところでなんとも思わないんですけどね。