[B! tips][webデザイン] indicationのブックマーク

入力フォームの工夫 - ワザノバ | wazanova

http://googleresearch.blogspot.com/2014/07/simple-is-better-making-your-web-forms.html 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約2時間前今回、Googleのチームが、アイトラッキングシステムの利用やユーザインタビューを通じて、入力フォームのユーザビリティについて実験しています。参照しているのは、2010年にスイスのUniversity of Baselのチームがまとめた "20guidelines to optimize web forms" です。2000年代のアカデミックな研究成果をもとにまとめられたものですが、現在もまだ当てはまるものと、ここ5-10年で変わってきているものがあり、興味深いです。最近は、スマホ

indication 2014/07/15

（UIの観点のみで）ベネッセの入力フォームは良くできている

リンク

画像を使わずに見出しを水平線で挟むCSS小技

ちょっと素敵だったので備忘録。CSS で見出しを水平線で囲むテクニックです。本とかでよくある表現方法ですが、これを画像を使わず実装しよう、というもの。クロスブラウザで動作しますので汎用性もありますね。これはいいですな・・・IE6でも7でも実装出来て、背景カラーや画像にも依存しません。demoこんな感じ。よく見かけますが、これをCSSのみで実装するTipsです。 h1 { border-top: 1px solid black; margin:23px 0 0; text-align:center; padding:0; height:24px; } h1 span { position: relative; top: -24px; padding: 0 20px; background:white; }borderを使って実装。h1にborderを付けて位置を下げ、spanで

indication 2011/11/05

リンク

★iPhone/iPadのホーム画面用アイコンapple-touch-icon.pngをサイトに設定しよう | 編集長ブログ―安田英久 | Web担当者Forum

indication 2011/08/13

リンク

ユーザを逃さないヘルプの見せ方、2つの注意点 (ユーザビリティ実践メモ)

前々回、前回に引き続き、ヘルプコンテンツの効果的な見せ方についてご紹介します。ヘルプコンテンツは、すべての項目を羅列した﹁よくあるご質問﹂のようなページを持つだけでは不十分です。以前の実践メモでは、疑問が発生したタイミングで﹁その場で﹂参照できるよう、主要な導線となるページ内に、ヘルプ内容を露出する方法を推奨していました。今回は、ヘルプ内容を露出する際の、具体的な2つの注意点をご紹介します。ヘルプの隠れた役割置くだけでは不十分？ヘルプ活用3つのポイントそこで、実際に皆様のサイトで主要導線上にヘルプ内容を露出させる際の注意点を、以下の2つにまとめています。注意点1.　同一ウィンドウでヘルプページに遷移させないヘルプが掲載された別のページに﹁同一ウィンドウで遷移させる﹂︵ページが完全に切り替わる︶という方法はお勧めできません。ページが完全に切り替わると、もとのページに戻るため

indication 2011/03/25

リンク

紙を折ったようなエフェクトを実装するチュートリアル | コリス

画像を使用せずに、スタイルシートで紙を折ったようなエフェクトを矩形の角に適用するチュートリアルを紹介します。 Pure CSS folded-corner effect [ad#ad-2] 対応ブラウザはCSS3と:before疑似要素を使用しているため、Firefox 3.5+, Chrome 4+, Safari 4+, Opera 10+, IE 8+です。デモページ紙を折ったようなエフェクトの実装紙を折ったようなエフェクトは、全部で4種類あります。 HTML HTMLはdiv要素を使用するだけで、class名を変更するだけです。 <div class="note"> コンテンツ </div> 適用するclassは﹁note﹂です。全てのベースとなるスタイルシートです。 .note { position:relative; width:480px; padding:1em1

indication 2010/12/21

リンク

はてなブックマーク

タグ

関連タグで絞り込む (7)

tipsとwebデザインに関するindicationのブックマーク (5)

お知らせ

今週のはてなブックマーク数ランキング（2024年7月第1週）

月間はてなブックマーク数ランキング（2024年6月）

今週のはてなブックマーク数ランキング（2024年6月第5週）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス