ドットインストール代表のライフハックブログ
Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない1つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
第 2 回目は「色々なカラムレイアウト(段組)を実現する」です。 WEBサイトには色々なカラムレイアウトが使われています。 その中でも今回は最近よく使われている、レイアウトパターンをいくつかご紹介します。 2カラム固定レイアウト 2カラム固定レイアウトは、企業サイトなどでよく使われるレイアウトパターンです。 サンプルページ 2カラム固定レイアウトの解説 XHTMLの構造は以下のように設定します。 CSSは以下のように設定します(重要な箇所だけ抜粋)。またご紹介するレイアウトすべてで第1回記事のデフォルトリセットも使用しています。 /* ========================================================= ■wrapper ========================================================= */ d
_携帯JavaScriptとXSSの組み合わせによる「かんたんログイン」なりすましの可能性 このエントリでは、携帯電話のブラウザに搭載されたJavaScriptと、WebサイトのXSSの組み合わせにより、いわゆる「かんたんログイン」に対する不正ログインの可能性について検討する。 5月28にはてなダイアリーに書いた日記「i-mode2.0は前途多難」にて、今年のNTTドコモの夏モデルP-07AにてJavaScript機能が利用停止されたことを指摘した。同日付のNTTドコモ社のリリースによると、「ソフトウェア更新に伴い、高度化した機能の一部をご利用いただけなくなっていますが、再びご利用いただけるよう速やかに対処いたします」とあったが、それ以来2ヶ月以上が経つものの、未だにJavaScript機能は利用できない状態のままだ。 実は、NTTドコモ社が慌てふためいてJavaScript機能を急遽停止
WEB開発者は必携かもしれないHTTPパラメータ解析用Firefoxアドオン「UrlParams」 2009年08月17日- UrlParams :: Firefox Add-ons WEB開発者は必携かもしれないHTTPパラメータ解析用Firefoxアドオン「UrlParams」。 もうご存知の方も多いかもしれませんが、知らなかったのでご紹介。 Yahoo! などの検索エンジンにアクセスすると、「http://search.yahoo.co.jp/search?p=test&ei=UTF-8&fr=moz2」のように色々と引数がつきますが、これを分かりやすく解析してくれます。 さらに解析するだけでなく、独自パラメータを定義して送信するといったことも可能です。 上記GETによるアクセスで、以下のようにパラメータを分かりやすく表示してくれます。 POSTの場合は別のペインにパラメータが表示さ
●お知らせ 2011/05/01 ※この記事のUser Agent Switcher用XMLは古いデータです。最新のXMLは下記リンク先のエントリーで公開中です。 →[User Agent Switcher用XML : 携帯+スマートフォン(+おまけ)対応版] 先日2007/11/17(土)に行われたPiF(PHP in Fukuoka)の第9回勉強会のスピカーで「携帯の機種判別」を話せさてもらいました。 その時、携帯開発で便利な、Firefoxの拡張でUserAgentを切り替えられるUser Agent Switcher を紹介したんですが、各携帯のUserAgentをメモったuseragentswitcher.xml を公開します。 修正:20080917) リンク切れ直しましたm(_ _)m useragentswitcher.xml (7KB) →最新版のXMLはこちら 元ファイ
端末IDを設定でき、ケータイサイトの開発に便利なFirefoxアドオン「Modify Headers」 Tweet 2008/4/17 木曜日 matsui Posted in ソフト紹介 | 5 Comments » 本日は、ケータイサイトの開発に便利なFirefoxアドオン「Modify Headers」をご紹介します。 ケータイ向け開発を行っていると、ログイン部分のプログラム作成などで、端末IDを取得したいケースがあります。 エミュレータには端末ID出力のための機能がついていたりするのですが、そのためにいちいちエミュレータから操作するのは面倒です。 「Modify Headers」を使うことで、HTTPヘッダを指定の通りに書き換えることができるため、携帯電話になりすまし端末IDを出力することができます。 → FireFox Add-ons Modify Headers [mozill
A Mobile Code (aka 2D barcodes, QR Codes, Data Matrix, Semacode) is a simple way of transferring text and links from print or a computer screen onto a mobile device. Mobile Barcoder fits into this process by integrating the generation process into Firefox. Simply hover over the square target icon on the status bar to generate a barcode of the current page. Right click on a link to generate a barco
HTML 5用のブラウザのスタイルをリセットするスタイルシートをHTML5 Doctorから紹介します。 <textarea name="code" class="css" cols="60" rows="5"> /* html5doctor.com Reset Stylesheet v1.4 2009-07-27 Author: Richard Clark - http://richclarkdesign.com */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl,
スタイルシートのmarginで使用する「ネガティブマージン(マイナスマージン)」について理解しておくべきこと、ネガティブマージンを使用したテクニックなどをSmashing Magazineから紹介します。 The Definitive Guide to Using Negative Margins 1. ネガティブマージンの理解 2. ネガティブマージンの使い方 3. ネガティブマージンのテクニック集 4. ネガティブマージンのバグフィックス 5. 終わりに 1. ネガティブマージンの理解 スタイルシートを使用する際、必ずといっていいほどマージンを使用するでしょう。しかし、ネガティブマージンになると意見は分かれ、それは悪魔の仕事であると考える人たちもいます。 ネガティブマージンをは、例えばこういうのです。
これ、すごく良い資料ですな。 How Packではさまざまなパッケージデザインを型紙付きで紹介している。 ちょっと凝った箱やらケースなんかを作りたいときはおおいに参考にすると良いだろう。 気になるパッケージがあったら型紙を印刷して作ってみるといいですな。 プレゼントなんかをするときに思い出したいサイトである。
TOP > WebService > だんだん小さくなるドット柄の背景パターンを制作してくれる「Dotted Background Generator」 WEBデザインの印象を決定付ける大きな一つの要素の一つに背景があります。様々な背景素材やジェネレーターがWEB上で公開されていますが、今日紹介するのはだんだん小さくなるドット柄の背景パターンを制作してくれる背景ジェネレーター「Dotted Background Generator」です。 上記のように上部から下部に向ってだんだんと小さくなっていくような背景を簡単に作る事ができます。 詳しくは以下 使い方は至って簡単でドットのカラーと、背景色、そして高さを指定すればOKです。色はカラースライダーなどは実装されていませんので、指定する必要があります。また選べるカラーはドット、背景ともに2色までとなっています。背景色は2色選んだ場合はA
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く