case:MobileDesign! モバイルサイトのデザイン紹介ブログ 引っ越ししました。 http://case-mobile-design.com/ case:MobileDesign! モバイルサイトのデザイン紹介ブログ > 2010-02-15 >

有限会社タグパンダ 喜安 亮介 2009/11/17 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） Webブラウザ別CSSハック一覧表 前回の「IE 6で泣かないための、9つのCSSハック」では、仕様通りの正しいコーディングを行っているにもかかわらず、Internet Explorer（以下、IE） 6で見ると、レイアウトがズレてしまうなどのさまざまな問題を解決するための9つのテクニックを紹介しました。 今回は、IE 6とIE 7のためのCSSハックのテクニックを下記に分けて紹介します。 IE 6をハック（IE 6のみに効く、もしくはIE 6のみに効かないハック） IE 6のみに効くハック スタ

IE6のCSSやJavaScriptなどのバグや仕様で困った時の解決方法をまとめたチートシートをVirtuosi Mediaから紹介します。

Notimo Demos site 利用者に対し非常に分かりやすい通知を行うためのJavaScriptライブラリ「Notimoo」。 次のリンクをクリックしてみてください。 → 通知を表示してみる ページの右上にフェードインで表示するのはなかなかインパクトが大きいですね。 スクロールしても、いやみではない感じにちゃんとついてきてくれます。 使い方もかなり簡単で、必要なJSとCSSを読み込んだ後、インスタンスをnewして show メソッドを呼び出すだけです。 showは２回連続で呼び出しても、ちゃんと１個目と区別して表示してくれます。 <script type="text/javascript"> var notimooManager = new Notimoo(); // 通知を表示 notimooManager.show({ title: 'タイトル', message: 'メッセージ

外部スタイルシートの指定は@importとlinkでどちらがいいかと、書籍「ハイパフォーマンスWebサイト ―高速サイトを実現する14のルール」の@importはパフォーマンスに悪影響を与えることについてのフォローアップを紹介します。 don't use @import 内容は、IEでは@importで外部スタイルシートを指定すると、パフォーマンスに悪影響を与えるので使用しないでください、というものです。 下記は、外部スタイルシートを@importとlinkを組み合わせて、それぞれのパフォーマンスを比較したもので、キャプチャはそのサイトのものと、参考に当環境でIE7/Fx3(XP)を検証したものです。 @import @import 2つの外部スタイルシートを@importで指定。 <textarea name="code" class="html" cols="60" rows="5">

6 Things To Include for a User Friendly Footer 以下、その意訳です。 ウェブサイトのフッタは、ユーザーが情報を得るための有用かつ大切なコンテンツとなり得ます。 フッタに情報を配置するということは、ウェブサイトに関する重要な情報を見つけるきっかけを与え、素晴らしいナビゲーションにもなり、ユーザーに与える第一印象にも影響します。 下記に挙げる6つの要素をあなたのサイトのフッタに配置すべきか検討してください。 1. About Us Link 「About Us」のリンク あなたやあなたの会社についての基本的なインフォメーションへのリンクを設置します。 ユーザーがあなたのサイトを確かめる手段の一つになります。 2. Contact US Link 「問い合わせ」のリンク サイトの所有者あるいは担当者に連絡を取る手段を提示します。 サイト上のタイプミス

.htaccessを使用して、他のサイトが画像などのファイルを無許可で使用するのを禁止する方法をThe Web Squeezeから紹介します。 Stop Image Hotlinking with .htaccess 「.htaccess」に、下記を記述します。 ※必要の無い箇所は、削除・修正して使用してください。 ※「.htaccess」を修正する場合は、必ずバックアップをしてください。 ※有効範囲は、設置ディレクトリの配下です。 <textarea name="code" class="html" cols="60" rows="5"> #Stop Image Hotlinking RewriteEngine on RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC] RewriteCond %{HTT

アクセシブルで、美しいフォームを実装するためのチュートリアル集をnoupeから紹介します。 Beautiful Forms - Design, Style, & make it work with PHP &a [...]

SitePoint: New Articles, Fresh Thinking for Web Developers and Designers 既報のとおり、IE6のシェアは純減を続けている。2009年2月のNet Applications調査によればIE6のシェアはFirefox 3に抜かれて3位に落ちた。今後も下落の傾向は続くとみる向きが多い。しかし、依然として19%を越えるシェアはその次のシェアを獲得している4.5%弱のSafari 3.2を大きく上回る。IE8のリリースが控えている状況ではあるが、WebデベロッパやWebデザイナは依然としてIE6対応を継続しなければならない。 IE6固有の問題を回避する方法はいくつもあるが、それらテクニックをまとめたドキュメントがSitePoint: 10 Fixes That Solve IE6 Problemsとして公開されたので注目しておき

Checkbox alignment in IE and Firefox | Xinotes チェックボックスを綺麗に並べるCSSサンプル。 次のように、チェックボックスの横に、改行入りのテキストを入れても綺麗に配置するサンプルです。 簡単そうでなかなか難しいテクニックかもしれないので覚えておくとよいかも。 サンプル IEでもFirefoxでも動作。Chromeでも試してみたところ動作しました。 関連エントリ クリーンなデザインでピュアＣＳＳなフォームを作るサンプル CSSでクールなINPUTフォームを作成するサンプル CSSベースのクールなフォーム、サンプル集 CSSでフォームデザインをする際のチュートリアル

Make a note of it: Web tech, montaineering, and so on. ナビゲーション等で画像を切り替えたい場合、CSSを用いて a:hover の背景画像をずらしたり消したりして実現する方法が良く取られます。この時、Internet Exploler 6 において背景画像のちらつき（砂時計のアイコン表示）や動作の遅延が発生する（ローカルでは確認しにくいので、注意）。サンプルは以下。 »IE6 background flickr この問題はIE6固有の問題であり、他のモダンブラウザやIE5等では発現しない。背景画像のキャッシュに関わる問題。hover時のbackgroundに変更を加えると再読込が起こるようです。したがって転送速度やファイルサイズによって程度が変わる。ブラウザの設定によっても回避できるみたいですが、Web屋としてそこはスルーしたい。解決

Due to the success and rapid growth of the k6 open source load testing tool we decided to rebrand LoadImpact as k6! go to k6.io

レイアウト用のグリッドをオーバーレイで表示します。 URLを変更すれば画像の変更可。 Bookmarklet Layout Grid Overlay MRI

Internet Explorer 6/7/8rc1, Firefox, Opera, Safari, Chromeなど主要なブラウザをWindows上で同時に起動できるXenocode Browserを紹介します。 Run IE876, Firefox, Safari, Chrome, and Opera from the web Fx, Op, Safari, Chromeはそのままで同時に起動できますが、IE 6/7/8rc1の異なるバージョンをOSに依存せずにインストール・起動できるのはブラウザ検証の大きな武器になります。 IE 6/7/8rc1でAcid 2のテストを表示してみたところ、レンダリングはそれぞれのバージョンのものになっていました。

Ywcafe.net This Page Is Under Construction - Coming Soon! Why am I seeing this 'Under Construction' page? Related Searches: Free Credit Report music videos Migraine Pain Relief Best Mortgage Rates Credit Card Application Trademark Free Notice Review our Privacy Policy Service Agreement Legal Notice Privacy Policy

そして同氏は、世界で最も高速なウェブサイトの1つであるGoogleのパフォーマンスにかかわる仕事をしているのである。 ウェブのパフォーマンスには2つの重要な側面、すなわち効率性と応答時間がある。効率性は、世界ランキング100位に入るようなウェブサイトを構築する際に出てくるスケーラビリティという難問に取り組むための武器である。あなたのウェブサイトが何百万人単位のユーザーと、何十億単位のページビューを擁するような規模のものである場合、バックエンドアーキテクチャ全体に対する理解を深めておくことが重要となるだろう。 ページの速度というものは、HTMLドキュメント内に記述する一連の指示によって決定されると言っても過言ではない。 iGoogleを例に挙げると、バックエンド処理に費やされる時間、すなわちデータがキャッシュされていないために毎回リクエストされることで費やされる時間は、ページ全体の処理時間の

この文書は「HTML5 differences from HTML4 (W3C Working Draft 25 May 2011)」の日本語訳です。 原文の最新版 は、この日本語訳が参照した版から更新されている可能性があります。 この日本語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。他の仕様の訳については Web 標準仕様 日本語訳一覧 を参照してください。 更新日: 2011-09-15 公開日: 2011-05-26 翻訳者: 矢倉 眞隆 <yakura-masataka@mitsue.co.jp> HTML5 における HTML4 からの変更点 2011年5月25日付 W3C 草案 (Working Draft) この版: http://www.w3.org/TR/2011/WD-html5-diff-2011