【CSS】覚えておいて損はない CSS の定番テクニック BEST 5 | バシャログ。
ネットで検索をすると CSS のテクニックが山ほど公開されていますが、実際に商用サイトの制作をしていて個人的に利用する頻度が高いテクニックの BEST 5 をご紹介します。 ちょっと凝ったデザインのサイトをコーディングする時に、これらのテクニックに助けられることが多いです。どれも覚えておいて損はないものばかりです！ IE6 でも min-height を使う 例えば、異なる高さのブロックを float しつつ底辺のラインを揃えたい時などに、「IE6 が min-height に対応していたら楽なのに！」と思うことがありますが、以下のテクニックを使えば IE6 でも min-height（相当）の適用が可能になります。 [CREAMU]CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 IE6 に mi
Web制作って大変だよね。
今月のWebsite Designing誌に情報デザインの特集が載っていたので買った。実は、この手のWeb制作系の本を読んだのは初めてだ。 まず、情報デザイン特集に触れておくと、あぁ良い社内プレゼン用の資料ができました。話が整理され、考え方が徐々にフレームワーク化されていくのは良いことです。 Webデザイナなる人々って、僕には真似できなくて、すごいなぁと思うのは、 ・いわゆる情報デザイン的なところをセンス、直感でこなしていること。 でも弱点は、 ・それを論理的に理解をしていないので設計書に落ちない。個に閉じており知が形式化されない。場当たり的なので、複雑なサイト設計やテクノロジーと連携するには限界がある。 この辺のまずいところを、本書は、さらっと触れていてくれるので良いと思いました。 Yugoさんが作られた関心空間Context VIewerを見て、あぁキレイだな、Flashの動きどうやっ
ユーザー中心のインタラクション
Web Designing誌の「ユーザ中心のインタラクション設計の考え方」に賛同・反論してみる。 【賛同】 ・サブミットボタンのラベルには動詞を使う ・システムエラーをユーザーのせいにしない。 これは同意ですね。あまり人のこと言えないかもしれませんが、システム屋さんってエラーメッセージなどのセンスが異様にない人が結構います。 さらにシステムの作りで自動化されてたり複数の画面でメッセージが共通化されてたりしたら、かなりブルーです。 ・クリアボタンは不要 そうそうなんで、いまだにクリアボタンってつけるんでしょうかね？ 僕は今のHTMLにおいて、このボタンの存在意義がわからんのです。なんかセキュリティ周りで、クリアボタンの有用性を説いてたのを見たかもしれませんが覚えてない。消せないことを不安に思うから・・・だったかな。 でも、そういう人は「入力クリア」の意味が理解できないでしょうから、それで消し
Passion For The Future: インタフェースの計量化、その１ KLM手法
■KLMを試す 例えば、こんなアプリケーションのウィンドウがあるとすると、 ユーザに年齢（2桁）を入力させてOKを入力させると0.1秒の処理時間で次の画面で「あなたの生年は○○年です」という情報が表示されるものとする。 ユーザの動きを文章で表現するとこうなる。「ユーザはマウスに手を置き（H)、カーソルを入力欄へポインティングし（P）、キーボードへ手を移動し(H)、年齢2桁を入力し（T)、マウスへ手を移動し（H)、OKボタンをポインティングし（P)、押す（B）。処理時間（W)後に、生まれた年が表示される）。」 KLMの式で表記するとこうだ。 H→P→H→T(2)→H→B→W KLMのルール（論文参照のこと）では、すべてのキー入力（T)とクリック（B）の前には心理的準備時間（M）を挿入せよというルールがあるので適用すると、 H→M→P→H→M→T(2)→H→M→P→BB→W 0.4+1.35+
ベストなWeb画面（アーキテクチャ）の設計ツールは？
パワーポイントで画面設計する人って非プログラマーの人に多いと思うんですが、パワポは基本的に紙に出力するツールなので、ピクセル単位でのサイズが把握しにくい。また、サイズの単位がcmというのは、いただけない。 デザイナーがコアを握るデザイン主体のサイトではなく、情報ポータルのデザインをデザイナーマターで、やらせるわけにはいかない。画面上の要素、特に表の要素が、どういう長さ／フォーマットで表示され、画面に入るのかデザイナーに投げる前の設計フェーズで完了しておく必要がある。すなわち、ヘッダサイズから、スクロールしない範囲で表示されるべきものなどと言った、デザインにも直結する要素も、この段階で決まっておく必要がある。 しかしながら、ここのところをきっちり設計しようと思ったらパワポでは役不足で、もっとCAD的な能力が欲しい。 今回、Visioで設計してみる。 まず、なによりコンピュータに表示する画面の
株式会社diffuse｜デジタルマーケティングを用いて企業に「キッカケ」を提供する会社
株式会社Diffuseは、デジタルマーケティングを用いて企業に「キッカケ」を提供する会社です。
情報デザインって何だろ。
情報デザインって、まるでバレーボールのお見合いでボールが落ちてしまう状況みたいに、みんなの手の間から抜け落ちていませんか？ 前から腑に落ちないのがあって、画面UIって、全部デザイナーが考えるものって、誰しもが思ってませんか？ でもサーバーサイドのロジックやビジネスロジックが絡むのに、デザイナー！UI全部考えろって、ぶっちゃけシステム側の眼で見て能力的に無理を感じませんか？（もちろんその逆もしかりでしょう。） この手の話は、ここで散々書いてますし、レスをいただいた内容や人と話して聞いた内容によると、ちゃんとしたプロデューサーが、この領域のフォローができないのが悪いらしいんです。ある意味、システムもわかる、ユーザビリティも会話できる、デザイナーも説得できる。そういう経験豊かな優秀な人材がいたらという前提で、それは確かにその通りだと思います。 でも、それ以前にお客さんも、身近にいる人も含め、なん
Webの設計は誰がやるの？その３
このサイトの主張では画面レイアウト、すなわち、現在、常識となっている、「Webデザイン」であろう仕事の領域も設計者がやるべしとなっていますが、これは世の中で受け入れられる発想なんでしょうか？ この場合の「レイアウト」は、お客さんが完成度をイメージできるほど厳密である必要があります。特に以下の要素の ・スクロールしない1画面に入る情報量の設計は重要 ・テーブルに表示する文字列、文字列長の設計も情報デザインである＝テーブルのサイズ、数、テーブルとテーブル間の位置関係はここで決まらなくてはならない。 からして、ピクセル単位での設計が必要で、後工程のデザイナーは、誤解を恐れずに言えば化粧のみを行うということになります。 CSSによる作成手法での仕事の切り分けなら、 ・HTMLに載る情報はすべて設計の仕事。CSSの基本構造も設計で完成していること。 ・設計図を壊さないCSSのプロパティ、画像デザイン
Webの設計は誰がやるの？その２
主に設計をこなすアーキテクトという肩書きの人がいない会社では、誰がWebサイトの設計をするだろうか？ 僕はWebデザイナーの方だけに属する人が画面設計をするのは実は反対だ。（Webサイトの設計に求める条件は、Webの設計は誰がやるの？にて記述） 単純に画面をデザインするから画面設計もデザイナーがやるって？そりゃ能力要素が違うだろーと。 もちろん能力は個々それぞれなので反論は承知であるが、ダメ出ししたいプロファイルは、こんなイメージである。 １．ゲームをやらない。（TVゲームは直感的なUIの塊である。もちろんプロ意識で見てること） ２．WindowsのUIやMacのUIの善し悪しがわかるほどITリテラシーが高くない。 ３．Webアプリなどを使うことがない。そもそも趣味としてWebに詳しくない。（興味がない） UIは、本来は認知科学と言った学問をベースに論理的に説明されるものと考えている。 天
F
昔、Word vs 一太郎という対決が雑誌を賑わした。やれ、どんな機能がWordにはあって、一太郎にはないなどと言ったスペック上の比較だけがソフトウエアの価値になった。 つまり、表を書いて、機能の有無の数でソフトウエアの優劣が決まる手法だ。これは、コンピューターのソフト/ハードに限らず多くの商品比較の雑誌が今でも取り入れている手法ではないだろうか。これをやると、MacよりWindowsで、Honda StreamよりToyota Wishという選択にならざるを得ない。 こういう日本の状況に起因してか、システム構築のコンペなどでも比較表の優劣でのみ商品や提案の善し悪しを決める人がいる。正確には判断する自信がないため、比較表の○の数で一番多いものを選んでおけば無難だろうという発想ではないだろうか。また、プロダクトを作る側でも、とりあえず、比較表で○が落ちないように機能実装を行い、個性がなくなる
ポジショントークのスケールが小さいひとたちを嘆く - はてなポイント３万を使い切るまで死なない日記
あ、また、説教エントリフラグの立つようなタイトルをつけてしまったぜ。 人間４０を過ぎると説教が好きになってこまります。 ああ、病めるひと、健やかなひと、肌が黒かったり白かったり黄ばんでいたりするすべてのリア充と非モテたちよ。世界中のあらゆるひとたちにわたしの説教をとどけたい！ はてブのコメントをみていて思うのは、世の中のひとのすべての発言をポジショントークでのみ理解しようとするひとの多さです。ポジショントークなんて人間の発言のしかたを決めるさまざまな要素のひとつでしかないのに、ポジショントークで考えると、すべてのひとの発言が理解できるというポジショントーク万能主義がはびこっていることにぼくは絶望します。 ぼくが思うポジショントーク万能主義の落とし穴を４つにまとめてみました。 ・ 相手がポジショントークをするメリットの大きさをきちんと考えたほうがいい。 ・ 相手が正しいポジショントークをでき
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
テクノロジー : 日経電子版