ユーザビリティ

HTML5の動画上に字幕や、デザイン変更可能なツールチップをキャプションっぽく埋め込めるライブラリ・BubblesJS

これはなかなか便利かも、と思っていつかの日 のために備忘録。HTML5製の動画に、字幕や デザインの変更が可能なツールチップ的なもの を埋め込めるライブラリ、BubblesJSです。応用 すればニコニコ動画のような動画コンテンツも ...

設定も簡単・軽量(5KB)・シンプルな、Webサイトのフォントサイズを変更できるjQueryプラグイン・Font sizer

なかなか便利かもと思ったのでメモ。よくある、 フォントサイズを変更できるやつなんですけど、 設定が凄く楽で軽量なjQueryプラグインです。 導入も楽なので積極的にうまく入れて行きたい ですねー。正直使ってもらえるか分からない も...

地味に使えるCSS小技のメモ&サンプル集

cssの小技的なテクニックが便利なので好きなん ですが、cssそのものが嫌いで覚えられないので カンペ的な記事を作ることにしました。便利な小技 は沢山あるんですが、特に自分が良く使いそうな Tipsをメモします。既に出回っている情報...
Ads

フィードバック用のフォームを簡単にブログに設置できるWordPressプラグイン・Usernoiseが便利そうだったので日本語の翻訳ファイル作った

WordPressでWebサービスやブログを 運営していく上で、もっとユーザーのニーズ を知りたい、という方は普通のコンタクト フォームよりも、その場で表示できて、 送信も手軽に行えるフィードバック用の フォームを設置したほうが何...

キーワードを入力するだけで自動で該当する候補をキーボードで操作可能なテーブル内に表示するjQueryプラグイン・jQuery ComboGrid

オートコンプリート機能でキーボードで操作できる コンボボックスを出してくれる、というjQueryの プラグイン・jQuery ComboGridのご紹介です。 なかなか高機能なプラグインですね・・・文字を 入力するだけで自動で候補を...

リンク先のPDFファイルを、Google Docs Viewerでその場で閲覧できる様にするjQueryプラグイン・gDocsViewer

使い方次第ではなかなか便利かも、と思った のと諸事情でメモがてら記事にします。よく あるPDFファイルへのリンクを、その場で Google Docs Viewerで閲覧出来るように するjQueryプラグイン・gDocsViewer...

240pxから最大2560pxの画面サイズまで対応出来るレスポンシブWebデザイン構築用のグリッドシステム・Golden Grid System

iPhoneなどのモバイルや、超ワイドなモニターサイズ までサポートしているレスポンシブWebデザイン構築用 のフレームワーク・Golden Grid Systemなるものが 登場した模様です。最大で2560pxまで対応できる らし...

Webサイトにおけるユーザービリティの復習をしたので、よくチェックするポイントをリスト化した

ユーザービリティに関して少し復習したので メモっておきます。初心忘れるべからずという 事で・・・Webサイトは基本的にユーザビリティ を考慮したレイアウトやコンテンツが理想です。 もちろんケースバイケースではありますが、 これは全...

わずか4KBと軽量でクロスブラウザ対応の、シンプルなデートピッカー(カレンダー)を実装するjQueryプラグイン・glDatePicker

軽量でカスタマイズしやすいデートピッカー のjQueryプラグイン・glDatePickerのご紹介。 とてもシンプルで、4KBと超軽量です。汎用 的で使いやすいかなと思ってエントリー。 jQueryUIでもいいっちゃいいんですけど...

Lightbox内にサムネイルも表示出来るイメージギャラリー系jQueryプラグイン・ppGallery

ポップアップしたLightbox内にサムネイルも表示可能 なjQueryプラグイン・ppGalleryのご紹介です。Lightbox 系のjQueryプラグインの大半は1つずつ見ていくか、 一旦ポップアップを閉じてからもう一度開く必要...

タッチデバイス対応、HTML5で構築したWebサイト向けのUI用フレームワーク・Kendo UI

HTML5製のWebサイト向けUI専用の フレームワーク・Kendo UIのご紹介。 iPhoneなどのスマートフォンや、iPad などタブレットデバイスにも対応したWeb サイトのUI設計用に作られたようです。 使いやすいかどう...

その場でインタラクティブにレイアウトやデザインを変更できるWordPressテーマ・WP Paintbrush

以前も似たようなテーマをご紹介しましたが、 管理画面にも入らず、FTPも不要で、その場 でインタラクティブにテーマのデザインや幅の 変更など、レイアウトも変更可能なWordPress のテーマ・WP Paintbrushです。以前ご...

横に飛び出すメガメニューを実装するjQueryプラグイン・JQUERY VERTICAL MEGA MENU

最近かなり見かけるようになった印象の、 大量のコンテンツを格納するメガメニュー の横に飛び出すタイプ。jQueryで実装して います。メガメニューはECサイトやポータル サイトなどなど、階層の深いWebサイトにて ユーザビリティ向...

スマフォ向けサイト構築等に便利そうな、指定サイズに応じてclass名を加えてくれる軽量jsライブラリ・Selector Queries

これはかなり便利そうだったので備忘録。 ディスプレイサイズに応じて指定した要素 にclass名を加え、そのclassを使ってデザ インする事でレスポンシブなWebデザイン を設計出来るようにする為のライブラリ。 かなり便利そうです...

フォームのselect要素内をインスタンス検索出来るようにし、美しいデザインにも変更できるjQueryプラグイン・Chosen

結構便利そうだったのでご紹介。フォームの select要素内に羅列されたoptionから、入力 するだけで結果を表示するインスタンス検索 を可能にするスクリプト・Chosenです。表題 にはjQueryプラグインと書きましたが、この...

並べられたアコーディオンパネルを開くと幅が可変して可読性を高める・Jquery Animated Grid

横に並べられたアコーディオンパネル を開くと、幅がアニメーションで広がり つつ、隣のアコーディオンが狭くなる ので、全体のレイアウトを維持できる というプラグイン。幅を気にしなくて いいのは場合によっては助かるかも。

接続をセキュアにしているFBユーザーの離脱を避ける為にFacebookページをhttpsでアクセス出来るように設定する

僕も最近指摘を受けて対応したのですが、 アカウントのセキュリティをセキュア接続 にしているユーザーだと、普通のFacebook ページにアクセスした際に、ユーザーが 一旦解除しなくてはなりません。面倒だし、 割と離脱率高い気もする...

フォームのselect要素で複数選択を簡略化できるjQueryプラグイン・jquery.multi-select

フォームのselect要素で、直感で複数選択 出来るようにするjQueryプラグイン。複数 選択できるようにしたい場合は多くの場合は 選択項目が多く、Ctrlを使わせるのはあまり ユーザーフレンドリーとは言えませんので、 簡単に選...

少しのjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする

シンプルでいいアイデアだったのでメモ。 HTMLテーブルの列そのものにリンクを 指定できるようにする、というもの。jQuery でサクッと出来るようですね。ちょっと思 いつきませんでしたけど・・テーブルまわり は使いやすさを向上し...

お手軽WordPress Tips:管理画面のドロップダウンする「ヘルプ」の内容を変更して存在価値を(少し)高める

WordPressの管理画面内でドロップダウンする ヘルプ。個人的に正直あってもなくてもいい程度 のものという認識です。WPに疎いお客さんへの 納品で説明するくらいだと思うんですが、それは それで分かりにくい気がするので、中身を変え...

fieldset要素単位で横スライドするバリデーション付きの入力フォーム用jQueryプラグイン・jQuery Stepy

縦長になるような入力フォームにいいかな と思ってメモ。fieldsetでグループ化された 要素単位でスライド化してくれます。下部 までスクロールする必要が無くなるのと、 どこが誤入力か分かりやすい、場所を取ら ないなどのメリットが...

jQueryを使って閲覧中のWebサイト自体をその場でプレゼンするサンプル・Screen Presenter

似たようなのがどこかにありました が。閲覧してるWebサイトそのもの をユーザーにプレゼンする、という インターフェースをjQueryで作った デモ。サンプルはダウンロード出来る のでお暇ならぜひ触ってみてください。
Ads