お願いだからWebフォームではを正しく使ってユーザビリティを上げてくれ | 初代編集長ブログ―安田英久
今日は、Webフォームが「うわ、使いづらい」となってしまわないようにする、意外と対応されていないことが多いHTMLタグ「<label>」について。 HTMLを自分で書かないWeb担当者さんでも、デザイナーさんが作ったフォームに関して最低限これだけはチェックしておくといいですよ、というお話しです。 コンバージョンの要である「Webフォーム」。アクセス解析での改善やEFO（入力フォーム最適化）をしていると思いますが、意外と忘れられていることが多い「<label>」をご存じでしょうか。 フォームの入力項目それぞれの「ラベル（項目名）」を書くためのHTMLの作法なのですが、これをちゃんと使っているかどうかで、フォームの使いやすさがガラッと変わるのです。 一番わかりやすいのは、ラジオボタンやチェックボックス。<label>をちゃんと使っていると、ボタン部分ではなく文字の部分をクリックするだけで項目を
行動観察はユーザー自身も言葉にできないニーズを明らかにする。現場のコンテキストから提供価値を考える／大阪ガス行動観察研究所 | ユーザーエクスペリエンスのチカラ
久保隅 綾氏大阪ガス株式会社 大阪ガス行動観察研究所 主席研究員人間が無意識に行う行動を観察し、Webサービスやアプリの改善に活用する。こうしたユーザー中心のデザイン手法は、Webの世界で広まりつつある。今回は、行動観察の手法がビジネスにどのように応用できるのか、行動観察活用について研究・開発を進める、大阪ガス行動観察研究所の主席研究員である久保隅綾氏に、行動観察とは何か、エスノグラフィーやUXとの関係、具体的な事例などについて教えていただいた。 普段意識していない潜在的な領域を掘り下げる――まず行動観察手法とは具体的にどのようなものか教えてください。 大阪ガスの行動観察は、現場の観察からお客様の実態を捉え、商品やサービスの提供価値を作る手法です。サービス現場の生産性向上というテーマもあり、たとえばお客様向けのショッピングの新しい経験や価値を作るためにショップ（店舗やWebサイト）の導線を
Who Needs Web Accessibility? How to Make Accessible Websites?
2013年3月25日 アクセシビリティ 昨年少しの間ですが入院しました。その間は大人しくしていればいいものを、脊髄麻酔や鎮痛剤が効いて苦痛のない時は退屈なもんで、Webサイト閲覧・メールチェックなどはしていました（私の行きつけの病院はインターネット利用可）。しかし体が思うように動かないので、今までどおりWebサイトを閲覧するのは困難。その時初めてアクセシビリティの大切さを身を持って感じ、それから少しずつお勉強している次第です。今回はWebサイト閲覧におけるアクセシビリティについて考えてみようと思います。 ↑私が10年以上利用している会計ソフト！ Webアクセシビリティとは 「アクセシビリティ」とは、アクセスのしやすさを意味する言葉で、転じて利用環境や身体の制約に関係なく誰でも使えるという意味で使われます。どのような状況でもWeb上のコンテンツや機能を十分に利用できるWebサイトを「アクセシ
WEBサイトのユーザビリティ テストツール「GhostRec」の日本語版を試してみた
サイトのユーザビリティ調査をおこなうために、業者さんに依頼するとなると、結構な金額がかかってしまうものですよね。少し前まで、ユーザビリティテストをおこなうのは資金的に余裕のある大企業だけ、というのが主流でしたが、いまでは中小企業でも必要性がでてきています。 そこで世の中に出てきたのが、安価にテストをおこなうことができるユーザビリティ テストツール。 そのツールのひとつである、WEBサイトのユーザビリティ 調査ツールGhostRecを、当サイトでも過去にご紹介しましたが、このツールの日本語版がリリースされていました。日本語版も１００PVまで無料で使うことができるので、早速試してみました。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! WEBサイトのユーザビリティテストをおこなえる「GhostRec
TRANS [hatena] - 印刷用CSSをまとめてみた。
以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用CSSに興味を持って、色々と調べてみたり、自分で書いてみたりした。そのまとめ。 ちなみに、#naviがグローバルナビゲーション、#primaryがメインコンテンツ、#secondaryがサブメニュー、#footerがフッター。 とりあえず、最低限やっておいたほうがよいこと。 body { font-size: 12pt; color: #000000; background-color: #FFFFFF; } a:link, a:visited { text-decoration: underline; color: #000000; } img { border: 0; } 印刷で読まれることを勘案するのなら、font-sizeはある程度
![TRANS [hatena] - 印刷用CSSをまとめてみた。](https://cdn-ak-scissors.b.st-hatena.com/image/square/860579fb9ea6fc896c86331cc2f3af60ddeb6ef1/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F6435988827676522384%2F6435988827676523499%2F1448268251)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ユニバーサルデザイン - FUJITSU Japan