タグ: HTML/CSS RSS コメントスレッドの表示 / 非表示 | キーボードショートカット

  • noiz 18:02   01/12/2011 パーマリンク | 返信
    タグ: HTML/CSS, ,   

    FONTWORKSのウェブサイト、テキストの基本書体が「FOT-筑紫ゴシックWeb Pro M」でとてもきれい。筑紫ゴシックも明朝もWebフォント版が使える時代。カネかかるけど。

     
  • noiz 19:51   07/10/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    仕事ではIE7が捨てられないので結局新しいことはなにもできない。

     
  • noiz 18:48   07/10/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    あーIE、CSS3で規定された複数の背景指定にまだ対応してないんだった。なんでこんなことでコードふやさなきゃなんないんだよ…

     
  • noiz 15:49   22/07/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    アレクサンダー・カルダーの作品を使ったGoogleのロゴ、canvas要素+JavaScriptで実装されてる。

     
  • noiz 17:39   01/07/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    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項を読んでさらに泣くか、あるいは笑うかはその人しだい。

     
    • 攝津正 10:04   12/07/2011 パーマリンク

      XML(XHTML)はほうむられたのですか? 事情よく分からないのですが。

    • noiz 17:52   17/07/2011 パーマリンク

      正確にいうと葬られたのはXHTML2.0です。あとたぶんXFormsも風前の灯。XHTMLの構文じたいはHTML5のなかで生き延びました。まあでも、企業や団体しかメンバーになれないW3CがWHATWGに屈服したところでなんとも思わないんですけどね。

  • noiz 10:27   15/06/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    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 00:25   16/06/2011 パーマリンク

      IE6のせいで午前様だよおい。PNG対応がクソなレガシーIE死すべし。

    • noiz 10:53   16/06/2011 パーマリンク

      opacityが効かないIEむきー

    • noiz 10:55   16/06/2011 パーマリンク

      なりものいりのIE9でさえCSSのグラデーションに対応してねっす。なんでfilterなんて独自拡張機能つかわなきゃならんの。しかも開始と終了のポイントしかおけない手抜き仕様いぇ~い!

  • noiz 11:09   15/04/2011 パーマリンク | 返信
    タグ: HTML/CSS   

    仕事でHTML5のリサーチをしていて知ったSVG女子。SVGでつくったアニメーションがすげえ、けど「女子」記号の意味がさっぱりわからん。HTML5のサポートが進んだWUA(ブラウザ)でプラグインなしで問題なく描画できる。

    なお日本語環境での公開はIE9製品版のリリース(4/26)にあわせるとか。現在はFirefoxやChromeなどのいわゆるモダンブラウザで、言語設定の優先順位を日本語以外にすると閲覧できる。Chrome(10.0.648.204)のほうが Firefox(4.0)よりレンダリング処理が速かった。

    でもこういう視覚的なスプラッシュを見せつけたい場合って、コーディングができても絵が描けないと意味ないよな……

     
  • noiz 16:14   09/08/2010 パーマリンク | 返信
    タグ: HTML/CSS   

    そうか、IEがクソずれやがるという問題、CSSで

    /* IE6-7 */
    * html セレクタ {}

    /* IE8 */
    head~/* */body セレクタ {}

    /* IE以外 */
    html:not(:target) セレクタ {}

    と記述すりゃいいんだ。CSSハックとかいうやつでなんとかなんじゃん。でもMirosoftはどうしてこんなにダメなブラウザを世に送り出すんだろう。いやがらせとしか考えられない。

     
  • noiz 16:25   23/07/2010 パーマリンク | 返信
    タグ: HTML/CSS   

    CSSで和文と欧文の書体を混植してみる。するとIEでは、混植テキストのベースラインが和文のみのテキストより1px下方向にずれてしまう。クリッカブルなボタンの内容を示す文字列をテキスト×ブロック要素で構成する必要があって、ボタンを横並びさせたところで気づいた。ふしぎなことに、混植指定してあるスタイルシートが適用されるテキストに欧文(英数半角)が含まれていなければずれないこと。うへえ…IEでのずれの原因ってここらへんの実装のまずさが影響してるんだろうと疑心暗鬼。もちろん他のメジャーなWUAではずれない。IEでのずれを見た目でごまかそうとpx単位でいじってると、今度はもとからずれてないWUAでの表示がずれる(あたりまえ)。IE追放!

     
c
新規投稿作成
j
次の投稿 / 次のコメント
k
前の投稿 / 前のコメント
r
返信
e
編集
o
コメントを表示する / 隠す
t
トップへ移動
l
ログイン画面へ移動
h
ヘルプを表示する / 隠す
shift + esc
キャンセル