ウェブページの高速化のために読んでおきたいサイトのまとめ
ユーザビリティの改善や検索エンジン対策としてウェブページの読み込みスピードの高速化は非常に重要です。ということで、ページの読み込みスピード向上のために役立つサイトをまとめてみます。 ページ読込速度の重要性 次の事例にあるように、ユーザーは表示速度に敏感です。 Googleによるとページの読み込みが0.5秒遅くなると、検索数が20%減少する Amazonによるとページの読み込みが0.1秒遅くなると、売り上げが1%減少する そして、Googleのアルゴリズムにウェブページの読み込み速度が追加されて以降、サイトの高速化への注目度は高まっています。 Google、ウェブページの読み込み速度をアルゴリズムに取り入れたことを発表 | 海外SEO情報ブログ Googleがついに順位決定に表示速度を使い始めた（公式発表） | Web担当者Forum Google、検索順位にページ読込速度の考慮を開始 [詳
『iOSヒューマンインターフェイスガイドライン』はUI解説書の枠を越えている ：国内・海外情報から見える『企業のWEB活用法』：ITmedia オルタナティブ・ブログ
中小企業がITを活用して売り上げにつなげるにはどうしたらいいか？WEBマーケティングとWEB戦略コンサル実績350社50業種以上の実績とノウハウで、海外の最先端情報を中心に、噛み砕いてご紹介。 作成者：中山陽平 iOS、実質的にはiPhoneのアプリケーションを作る際に参照してくださいと言う事で配布されている「iOSヒューマンインターフェイスガイドライン（以下iOS_HIG）」 弊社のシステムを真剣にスマートフォン対応にするために読み始めたのですが、この内容が、ただのインターフェイスのガイドラインだけではなく、さらに踏み込んだ内容になっていて驚きました。 Appleのサードパーティアプリに対する姿勢、サードパーティアプリケーションがiPhoneの大きな魅力であるという認識が、このガイドラインからはにじみ出ています。 App開発者以外もぜひ見ておくべき これはぜひ、WEBに関わる方は見て頂き
ログインフォームに大切な7つの要素と重要な1つの機能
ログインフォームを実装する際に、大切な7つの要素と重要な1つの機能を紹介します。 元記事では下記のCSS3で実装されたフォームもダウンロードできます。 フォームのタイトル このフォームが何についてのものであるか手短に説明されたタイトル。特に、ウェブサイトの名称を記すことは非常に重要です。 非メンバー用のリンク 非メンバーが偶然、このページを見つけてしまうことがあるかもしれません。そして、メンバーを増やすチャンスもあるので、登録ページへの誘導も行っておきます。 ラベルとフィールド ログインフォームは通常、2つのフィールドで構成されていますが、ラベルは読みやすいようにします。 パスワードを忘れた場合 これは同じく、非常に重要なリンクです。多くのユーザーは多数のアカウントとパスワードをもっているものです。そして、しばしばそれはあなたのサイトでどれなのか忘れてしまうことがあります。 また、配置する
キャズムを超えろ！ - 団塊～シニア層向けのWeb設計 やっちゃいけない10のＵＩ
一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービス＆PCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID，ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結
igaiga: 「すごい」ペルソナ法
■はじめに モノ単体が価値を生む時代から、情報やサービスなどのエモーショナルな側面が価値を生む時代へと移り変わって来ている[Norman2004,Tien2003]。企業の製品開発においても、従来のような技術指向の製品開発によるシーズベースのアプローチから実際のユーザを想定したニーズベースの開発アプローチが重視されつつある[Iga2007]。このような流れの中において、ISO13407などの標準化も進み、ユーザ起点で製品開発を行うUCD(User-Centered Design)の考え方も浸透してきている[Kurosu2001]。 企業における製品の研究開発においては、様々なスキルを持った人材が数多く関わることになる。例えば、筆者の研究プロジェクトにおいても、ユーザインタフェース研究者のみならず、材料、物性、メカトロニクス、ソフトウェア工学、心理学、マーケティング、デザイナーなど多種多様に
デザイニング・ウェブナビゲーション
TOPICS Web , Design 発行年月日 2009年05月 PRINT LENGTH 388 ISBN 978-4-87311-410-1 原書 Designing Web Navigation FORMAT PDF ウェブサイトが提供する情報やサービスを、ユーザーが適切に探し出し、利用できるようにすることは、ウェブサイトを構築する上で非常に重要な目標です。本書は、使いやすいウェブサイトの構築において、根幹をなすテーマであるナビゲーションのデザインについて、理論から実践まで、豊富な実例と共に解説した書籍です。 本書は、3部構成となっており、まず第1部ではウェブナビゲーションの概要と、ナビゲーションをデザインする上で考慮すべきポイントを学びます。続いて第2部では、評価、分析、アーキテクチャ、レイアウトなど、最適なナビゲーションを構築するためのフレームワークを解説します。さらに、第3
あのFlashサイトのUIをjQueryで作る (1/5)
「見た目に美しく、ユーザーに楽しさや心地よさを与えるUIを作りたい」 そう考えたときに参考になるのが、Flashで制作されたWebサイトです。最近では、JavaScriptによるリッチなUIを持つWebサイトも増えてきていますが、長年、さまざまなUIが実験的に生み出されてきたFlashの世界には、まだまだユニークなサイトが多くあります。 たとえば、今回紹介する「ハーズ実験デザイン研究所」のWebサイトは、フルFlashで制作された“楽しい”コーポレートサイトです。同社が手がけてきた過去の作品を、時間の経過とともにゆっくりと切り換えていく様子は、まるで1本の映像作品を見ているよう。メニューのちょっとした動きひとつをとっても、ユーザーを楽しませようという意図が感じられます。 Flashサイトのような美しくて楽しいUIを、JavaScriptでも作れないか――それが今回のテーマです。 今回のお手
UXPython - For those who Electronics, Coding & UI design
A public platform to learn Electronics, Coding & UI/UX design A platform to find and contribute answers to technical questions related to electronics, coding, and UI/UX design. The best place to learn electronics & coding with tutorials, articles, and UX/UX toolkits. Also, One of the largest electronic component information databases.
TinyMCE JavaScript Content Editor - naoyaのはてなダイアリー:
とある友人に教えても経ったTinyMCEという WYSYWIGWYSIWYG な HTML エディタライブラリがやばそう。 JavaScript で記述された LGPL でオープンソースな クロスプラットフォームの 多言語対応もしてて 簡単に使える ライブラリ。似たようなものに htmlArea というのがあって結構昔に話題になってたんですが、導入がめんどくさかったりブラウザによってはまともに動かなかったりとか色々面倒な感がありました。TinyMCE の方はと言いますと、Installation instructions にもあるとおり、 <html> <head> <title>TinyMCE Test</title> <script type="text/javascript" src="/js/tiny_mce/tiny_mce.js"></script> <script type=
“時間軸”は次のキラーコンセプトになるか？ 「タイムライン」サービスを考える:connect-the-dots：編集的ウェブ考 - CNET Japan
このところ、“時間軸”を扱ういわゆるタイムラインサービスが、特に海外で元気があるように見えます。 日本では、@nifty TimeLine がこの手のサービスとして老舗的な存在だと思いますが、それぞれに工夫を凝らしながら新しいサービスが続々と登場しているようです。 時間軸を扱うサービスが出始めて、まだそれほど時間は立っていないと思うのですが、この間にもずいぶん進化をしているような印象を受けます。 ドイツ発の「TimeRime」 中でも、今年の３月にローンチされたというドイツの「TimeRime」というサービスが、とてもよくできています。 上は、ObamaさんとMccainさんに関してのTimelineが並んでいる図。 こうして、誰かの人生を並べてみるだけでも、なかなか興味深いです。 画像、出来事、所属情報、といった情報の要素別にエリアが整理されている点も、ちょっとしたことなのですが気持ち
Ext JSを使ったWeb OSの新参·qWikiOffice MOONGIFT
去年あたりまでは時々目にしていたが、あまり最近聞かなくなっていたのがWeb OSだ。ブラウザベースで動くWebアプリケーションが各種登場し、その最たるものとして注目を集めたのがWeb OSだったが、そのキラーアプリケーションやキラーコンテンツになり得るものがまだ現状ではないのが実情だろう。 各種モックアップが提供されている だが世の中にはシンクライアントに代表される、ネットワークコンピュータも運用されるようになってきている。きっとWeb OSならではの利用法があるはずだ。 今回紹介するオープンソース・ソフトウェアはqWikiOffice、PHP製のWeb OSだ。 qWikiOfficeはPHP+MySQLで作られたWeb OSだ。Windows Vista調の画面で、ウィンドウの最小化、最大化、ドラッグによる移動、ウィンドウタイトル部分が半透明など、華麗なインタフェースが特徴的だ。 メニ
会員登録の敷居を下げる入力フォームの作り方(PC編) - キャズムを超えろ！
本エントリは、20〜40代のPCをある程度使いこなしているユーザー向けの会員登録フォームの設計について述べたものである。ケータイサイトは含まないし、シニアも対象としていない。シニア向けUIについては(古いエントリだが)こちら "ユーザーID"と"メールアドレス" 減ってはきたものの、ユーザーIDとメールアドレスの両方を取るWebサービスがいまだに結構ある(ex. Remember the milk)。はてなやYahooAuctionのように「ユーザーIDがニックネームに相当するコミュニティサイト」は除くとして、ユーザーIDを一般客に公開しないにも関わらずIDとメルアドの両方を取る意図がわからない。 ユーザーIDとしてメールアドレスを使うメリットは 会員登録フォームの入力必須箇所が1個減る 好みのIDが取れない事件が防げる "ID忘れ"による機会損失/幽霊会員が減る 流石に自分のメアドは忘れ
Google's Design Guidelines
An unofficial blog that watches Google's attempts to move your operating system online since 2005. Not affiliated with Google. Send your tips to gostips@gmail.com. Jon Wiley, User Experience Designer for Google Apps, outlined some of the most important principles for designing interfaces at Google. In his presentation at the WritersUA conference, Jon listed the following guidelines: 1. Useful: foc
Welie.com - Patterns in Interaction Design
A Pattern Library for Interaction Design This site contains a lot of best practices in Interaction Design. Over the years I have collected examples and insight on their applicability that I share with you here on this. So there is really no 'original' design to be found here, sorry. It has all been done before... See it as a reference or basic 'toolkit' you can use when design user experiences. It
ウノウラボ Unoh Labs: プログラミングに使いやすいフォントを選ぶ
yukiです。 人によってまちまちですが、見易さや生産性にかなり影響する(と思っている)プログラミング時のフォントについて紹介します。 マカーの方はデフォルトで十分読みやすいフォントが入っているので、ここではwindows向けとして紹介させて頂きます。 個人的に選ぶポイントは、 ゼロ・オーは斜線で区別がつく 日本語も使える 長時間見ても疲れない(一番大事) です。これいいよ！というのがあったら絶賛募集中です。 有名どころかもしれませんが M+フォント M+フォント posted by (C)フォト蔵 普段はコレを使わせていただいています。 自分的にはゼロ(0)とオー(O)の差が分かりやすく◎です。 ゼロの中にスラッシュやドットが入っていて読みやすく、等幅なので使いやすいです。 VLゴシックフォントファミリ 上記のM+を元に製作されたフォントです。 弊社CTOが過去に参加
三次元お絵かきソフトTeddy開発者・五十嵐健夫｜【Tech総研】
学生時代からインタラクションやユーザーインターフェースの研究を推し進め、二次元の絵から簡単に三次元の絵を生成できる「三次元お絵かきソフトTeddy」の開発で世界の度肝を抜いた五十嵐健夫氏。その画期的技術は、既に製品に組み込まれ、世に送り出されている。 パソコン上で描いた絵が、あっという間に立体化され、3Dになってしまう。しかも、四方八方に自由自在に回転でき、絵はいつでも修正・加筆することができる……。「三次元お絵かきソフト（＝手書きスケッチによる三次元モデリングシステム）Teddy」を五十嵐氏が初めて発表したのは、東京大学大学院博士課程に在籍しながら、カーネギーメロン大学に短期留学していたときだった。学会関係者を中心とした数百人の聴講者は、デモが始まってすぐに総立ちとなったという。革命的な技術が、世に出た瞬間だった。 この1999年に、アメリカのコンピュータ学会主催による世界最高峰のコンピ
Geekなぺーじ：選択肢を減らすことの重要性
Google TechTalksでBarry Schwartz博士による講演が公開されていました。 「The Paradox of Choice - Why More Is Less」というタイトルでした。 最初は、UNIXコマンドのmoreがlessよりも劣っている理由の事だと思って見始めましたが、そうではありませんでした。 何でも選べてベストじゃないと満足しないというのは、アメリカ人っぽい気もしましたが、かなり面白かったです。 ユーザビリティと機能の問題は良くある問題ですが、お店で展示されている商品の種類を減らした方が売り上げが上昇する話などが新鮮でした。 以下に要約してみました。 ここでは書いていない部分も多いので、詳細はビデオをご覧下さい。 字幕も入っていますし、ゆっくりと話してくれる人なので非常に見やすいと思います。 ただ、スライド(PPT?)が見られないので、何故観客が笑ってい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.e-research.biz/profile/proec/005225.html
Best Practices for Form Design
Efficient data transfer through zero copy
