タグ

*web制作に関するquicktemplateのブックマーク (129)

  • IE6のCSSバグを視覚的にチェック

    てんぽ: IE6のCSSバグを視覚的にチェック CSSHTML、FC2ブログのカスタマイズ、共有テンプレートなど IE用Acidテストとも言えるCSSバグのチェックページを作ってみました。 IE6で表示するとすべてのチェック項目で「NG」と表示されますが、正しい表示を行うブラウザなら「OK」と表示されるはずです。 IEtest (beta) 具体的にはどうやっているかというと、たとえば「position: absoluteが指定されたボックスの幅をパーセントで指定したとき、 幅の参照先を、そのボックスの包含ブロックではなく、間近の親要素にしてしまうバグ」をチェックするコードは以下のようになっています。 <div class="container"> <div class="div1"> <div class="div2"></div> </div> </div> .container {

  • hxxk.jp - DOCTYPE スイッチについてのまとめと一覧表 (HTML 5 や IE 8 Beta 2 のモードスイッチなどの情報も含んだ 2008 年版 )

    DOCTYPE スイッチについて再度まとめ 以前 DOCTYPE スイッチについての検証とまとめと一覧表という記事で DOCTYPE スイッチについてまとめましたが、あれから 2 年弱が経過したので、改めてまとめてみようと思います。 まとめるまでの話がけっこう長いので、一覧表だけ参照したい ! という場合は DOCTYPE スイッチの一覧表をご覧ください。 DOCTYPE スイッチとは何か そもそも DOCTYPE スイッチとは何か、というのがまず書くべきところですが、これは私が書かずとも良質のリソースが各種ありますのでそのリンクのみまとめておきます。 !DOCTYPE スイッチ 各UAのDOCTYPEスイッチについて - CSS Dencitie Mozilla's DOCTYPE sniffing - MDC Mozilla's DOCTYPE sniffing - MDC ( 日

  • font-familyの憂鬱 - Webtech Walker

    最近font-familyの指定で悩んでます。少し前までは、下記エントリーのような理由で、ヒラギノ→メイリオ→MS P ゴシックみたいな感じで指定していました。 CSSのfont-family:ヒラギノとMS Pゴシックとメイリオの悩ましい関係 ヒラギノを指定しなくなった理由 わけあってヒラギノをwindowsにインストールする必要がありまして、しばらくインストールしたまま使っていたのですが、windowsでヒラギノの表示は少々汚くて見づらいものがありました。 しかも、ヒラギノで表示されるサイトがかなり多いんです。それに耐えられなくなり、ヒラギノは使うときだけインストールするようにして、いったんアンインストールしました。いくらwindowsにヒラギノを入れているユーザーが少ないといっても、自分でそういう経験をしたので、ヒラギノの指定はしづらくなりました。あと、自分の周りのデザイナーさんとか

    font-familyの憂鬱 - Webtech Walker
  • 事業案内 - サイブリッジ

    ウェブインテグレーション事業企業のウェブサイトに求められる要求は高度化し、そこに求められる「戦略」「クリエイティブ」「テクノロジー」は統合される必要性に迫られています。コンセプトメイキングやブランディングといったウェブサイトが潜在的に内包する要素を理解したうえでサイブリッジでは戦略立案やアーキテクトといった上流工程から高度なクリエイティブと開発、そしてオープン後のプロモーション、効果測定、フィードバックまでを統合するソリューションを提供しクライアントのビジネスを成功に導きます。 ウェブサイト構築お客様企業の求める機能やサービス、ブランド価値を向上させるために、戦略的な視点に基づいてWebサイトの構築、リニューアルプロジェクトの全体をプロデュースします。 企業サイト構築・リニューアル公共事業サイト構築学校法人向けサイト構築医療法人向けサイト構築新卒・中途採用サイト構築IRサイト構築・リニュー

    事業案内 - サイブリッジ
  • 見出し構造とツリー構造明示 @ ぽかぽかWeb研究室

    どのような方法が定められているか 仕様としては、以下のあり方が考えられています。 hn 要素に関係する要素群を、hn 要素ごと div 要素で括る (旧来の (X)HTML で最も行われてきた方法) hn 要素に関係する要素群を、まとめて divn で括る。 hn 要素自体は divn 要素では括られない (ISO/IEC 15445 の Pre-HTML の方法) hn 要素のみで階層構造を作る (XHTML Primary の方法) section 要素の入れ子で階層構造を明示。見出しは h 要素で明示(かつて XHTML 2.0 (2022 年現在廃止)で提唱されていた方法) セクションの役割 (article, hgroup, section 等) を持つ要素と見出し (h1 ~ h6 各要素) の組み合わせで階層構造を明治する方法 (HTML Living Standard で

  • divを使うということ - Personnel

    人の頭は論理的なものを解釈するようにできている。視覚情報は、文書の論理構造を理解する為の媒体となり得る。故に文書の論理構造に基づいたデザインは、それを理解する手助けとなるだろう。 従って、著者が極めて重要であると認識する(読者に伝えたいと考える)文書構造は、視覚情報に変換すると、より良い。しかし、HTMLのマークアップで明示できる文書構成要素は、最低限のものに限られている。故に、それらに含まれない要素をdivやSPANを用いてマークアップし、CSSを通じて視覚情報に変換することは有益である。 Foot note この記事のURI参照 http://members.jcom.home.ne.jp/jintrick/Personal/css_div.html#overture しかし、私はHTMLで訳もなく複雑な階層構造を表現しようとするのには反対です。理由は2つ。 ある程度ツールに

  • dlで写真をマークアップ | d-spica

    dlで写真をマークアップ 2007-02-15 0 0 XHTML/CSS CSS, dl, XHTML dl,dt,ddの定義リストで写真をマークアップしてみました。 八ヶ岳・甲斐駒ヶ岳 の記事に写真を何枚か載せました。写真とその説明(キャプション)のセットでは,dt要素によって説明する対象を示し,dd要素にその説明を書くと,文書の構造がはっきりします。 <p><img src="/photo/yatsugatake02.jpg" alt="八ヶ岳" /><br /> 山梨県韮崎市神山町鍋山からの八ヶ岳。</p> と,下の記述を比べてみてください。 <dl class="image"> <dt><img src="/photo/yatsugatake02.jpg" alt="photo:八ヶ岳遠景" /></dt> <dd>山梨県韮崎市神山町鍋山からの八ヶ岳。</dd> </dl> dt

  • //// COLOURlovers :: loving colours since 1981

    Share Your Color Ideas & Inspiration. COLOURlovers is a creative community where people from around the world create and share colors, palettes and patterns, discuss the latest trends and explore colorful articles... All in the spirit of love.

  • 3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)

    こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G(FOMA・WIN・3GC)端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末(FOMA・WIN・3GC)がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末(PDC・P型・C型など)を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運

    3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)