【checkbox label】出来るだけ押しやすいチェックボックスを作る - リスティング広告運用代行｜カルテットコミュニケーションズ
今回は、checkbox labelの作り方についての紹介です。 簡潔にご紹介していくので、サクッと答えを求めている方は参考にしてください！ checkbox labelの作り方 HTMLで普通にチェックボックスを作ると、こんなふうになると思います。 <input type="checkbox" />チェックしてください チェックしてください しかしこれだと、チェックボックスの小さな□の部分だけしかクリックできなくて、非常に押しづらいです。そこで、チェックボックスを押しやすくするために、<label>というタグを使います。 <input type="checkbox" id="sample_checkbox" /> <label for="sample_checkbox">チェックしてください</label> チェックしてください <label>タグを使って「チェックしてください」というテ
モバイルアプリで場所や住所の入力を容易にするオートコンプリートウィジェットをリリース
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
ユーザビリティやリピータの為に結構大切な訪問済みリンク（a:visited）の色 | 無料SEO対策のススメ
ユーザビリティやリピータの為に結構大切なa:visitedの色 皆様、訪問済みリンク「a:visited」の色はどうしていますでしょうか？ 検索サイトの検索結果やポータルサイトでは紫色になっている事が多いですが、企業サイトやブログなどではa:linkと同じになっているケースも多いと思います。 以前から感じていた事ですが、ユーザビリティやリピータのことを考えるとa:visitedの色は、a:linkとは異なる色を指定した方が良いのではないでしょうか。 そうしている方にとっては今更感満載な内容ですが、このたび管理している全てのブログでa:visitedの色を変更してみました。 a:link、a:visited、a:hover、a:activeの意味 Web制作をしている人にとっては当たり前の知識ですが、無料ブログなどでCSSを修正したいという方の為に一応意味を載せておきます。 a:link ・
コラム一覧｜ビービット(beBit)- エクスペリエンス・デザイン・パートナー
本コラムの前編では、昨今eNPS℠が重要になってきていること、また、eNPS℠には「正当な報酬」・「正当な評価」・「顧客への貢献実感」が影響していることを述べました。 本コラムでは、仕事の役割が見える「部署」を切り口に、eNPS℠の比較を行い、そこからeNPS℠を高めていくための方法について考察・ご紹介します。 「中国のデジタルサービスが進んでいる」「中国のCX/UX※1が優れている」そんな評判や記事を最近多く耳にするようになりました。また、Alibaba傘下のAnt Financialが、Harvard大学から「先進的かつ再現可能」なビジネスとして評価され、Harvardビジネススクールの企業事例集に取り上げられたことは記憶に新しいニュースです。 コピー商品や、「安かろう悪かろう」の製品のイメージが根強くあった中国。しかし、そのような「偏見」はもう昔のことです。中国は今、デジタルを活用し
HTML Speech Input API Specification
Speech Input API Specification Editor's Draft 18 October 2010 Latest Editor's Draft: http://dev.w3.org/... Editors: Satish Sampath, Google Inc. Bjorn Bringert, Google Inc. Copyright © 2010 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C liability, trademark and document use rules apply. Abstract This specification extends HTML and defines an API that provides speech recognition and input to web
Google Chrome11でサポートされた音声入力API - Webtech Walker
Google Chrome11の正式版がリリースされたわけですが、音声入力APIに対応したようです。 音声入力APIはフォームの入力を音声から取得してテキストに変換してくれるAPIです。 HTML Speech Input API Specification 使い方は超かんたん。speech属性をinput要素に指定するだけ。chrome11ではx-webkitっていうprefixつかないとダメっぽい。こんな感じ。 <input type="text" speech x-webkit-speech> 対応してるブラウザだったらテキストボックスにマイクのアイコンがでてると思うのでクリックすると音声で入力できます。 あと、言語をlang属性で指定できる模様。 <input type="text" speech x-webkit-speech lang="en"> ちなみにGoogle検索とかG
大森の郵便局、タッチパネルの余計なところを押せないように強引なインターフェイスを制作
大森の郵便局、タッチパネルの余計なところを押せないように強引なインターフェイスを制作
プログレスバーのアニメーションによって体感速度が違うんだってさ！ - IDEA*IDEA ～ 百式管理人のライフハックブログ
ドットインストール代表のライフハックブログ
Alertbox: ブログのユーザビリティ：デザインの間違いトップ10（2005年10月17日）
ブログは既存ユーザに焦点を合わせすぎていて、重要なユーザビリティの問題を、ないがしろにしている事が多く、サイトを理解し、著者を信頼することを、新規読者にとっては困難にしている。 Weblog Usability: The Top Ten Design Mistakes by Jakob Nielsen on October 17, 2005 ブログはウェブサイトの一種だ。そのため一般的なウェブサイトのユーザビリティガイドラインや、今年のデザイン間違いトップ10 の対象にもなる。しかしながら、ブログはウェブサイトの中でも特殊な部類のものだ。ブログには特徴があり、それ故に特有のユーザビリティ問題を抱えている。 ブログの素晴らしい利点の1つは、本質的に「ウェブデザイン」をしなくても良くなるということだ。文章を書き、ボタンをクリックすると、インターネット上でそれが公開される。ビジュアルデザインも、
メタファーが作り出す期待値と使いやすさの関係
Webをはじめとしたテクノロジーを利用したものには、馴染みのない機能や象徴的で捉え難いアイデアがあります。それらをスクリーンショットで見せたり、分かりやすい解説があったとしても伝わらない場合が多いです。そこで、他にある似たようなものと関連付けさせて理解しやすくします。これを私たちは「メタファー」と呼びます。 メタファーはパソコンの中にたくさん見ることが出来ます。アイコンデザインがその代表格です。絵としてフォルダを表現することで、頭の中で「幾つかの書類をまとめることが出来る」という本物のフォルダと関連付けがしやすくなり、操作を促すことが出来ます。フロッピーディスクアイコン (保存)のようにメタファーからシンボルへと進化した例外もありますが、機能やインタラクションを説明せずに利用者に伝えることが出来るメタファーは、アプリケーションデザインやWebデザインでよく使われます。 メタファーが作り出す
縦長いページデザインは是か否か？ 楽天におけるスクロール量計測導入の裏側
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
「iPadは使いにくい」：米のUI専門家が批判 | WIRED VISION
前の記事 ネットは「偏った意見」を強化するか：研究結果 「米国初の洋上風力発電」：反対運動で難航 次の記事 「iPadは使いにくい」：米のUI専門家が批判 2010年5月13日 IT コメント： トラックバック (0) フィードIT Brian X. Chen 『iPad』はインターフェースの勝利と称されている。しかし、あるユーザビリティーの専門家はこのほどiPadについて、インターフェースに一貫性がなく明確でないという批判を発表した。インターフェースに標準が設定されていないため、それぞれのアプリが違ったように動くのだという。 一部からは「ユーザビリティーの王様」とも呼ばれるJakob Nielsen博士は今週、『iPad』の使いやすさを評価する93ページのレポートを発表した。このレポートは、34種類のアプリとウェブサイトをテストした7人のユーザーからのフィードバックを基に作成されている。
coojin.com - coojin リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
フッターサイトマップのデザイン | blog / bookslope
6 Things To Include for a User Friendly Footer | UX Booth 「Key Footer Information」として、フッターの情報として重要な6つを取り上げています。もうどのウェブサイトを見てもこれらの情報は掲載されていると思いますし、ある意味デフォルト (標準値) であるとも言えます。 フッターに置く重要な要素 About Us Link/リンク (について)Contact Us Link/お問い合わせ (連絡先)Terms of Service/サイトの利用方法 (利用規約)Privacy Policy/プライバシーポリシー (個人情報の取り扱い)Site Map/サイトマップAddress and Phone Number/住所や電話番号 ただし、このうち「サイトマップ」については、単にサイトマップページへのリンクを置くこともそ
【海外事例に学ぶ】 リッチ化するフッター (ユーザビリティ実践メモ)
これまで当サイトでも、いくつかの記事でフッターについて扱ってきました。最近、海外のサイトを見ていると、フッターについて新しい取り組みが見られます。 今回は、海外サイトの動向をサンプルとし、フッターにおける新たな取り組みのメリットをご紹介します。 Geek Trends: 15 Footers with great usability ( pop upon magazine ) 6 Things To Include for a User Friendly Footer ( UXBooth ) Modern Sitemap and Footer ( WebDesignerWall ) Footers (76 examples) ( Smiley Cat Elements of Design ) 例えばTIGERS （http://www.tigers.org.au）のフッター(下図)では、革
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
http://www.designwalker.com/2009/08/usability-test.html
ファーストビューは何pxまで？ ブラウザの表示領域サイズ5年間の変化を大公開 | 初代編集長ブログ―安田英久
IDEA * IDEA
SBI証券