週刊Webテク通信

2012年8月第1週号 1位は,ユーザーインターフェイスのフリー素材とテクニック,気になるネタは,Yahoo!ブログの「イイね!」ボタンの名称が「ナイス!」に変わりました

この記事を読むのに必要な時間:およそ 2 分

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から,Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は,2012年7月30日~2012年8月5日の間に見つけた記事のベスト5です。

1. Designing Killer Web UI Layouts with Freebies ? Ultimate Guidehttp://www.hongkiat.com/blog/killer-ui-with-freebies/

無料ダウンロードできるユーザーインターフェイス素材と作成のためのテクニックとを,カテゴリーごとにセットで紹介した記事です。

以下のカテゴリーで分けられています。

  • ページ全体のテンプレート
  • メインのナビゲーション
  • 入力フォーム
  • リボンとバナー
  • ボタンのデザイン
  • 木と紙のテクスチャー

図1 ユーザーインターフェイス素材と作成のためのテクニック

図1 ユーザーインターフェイス素材と作成のためのテクニック

2. Common Design Mistakes for Creating a Mobile Websitehttp://naldzgraphics.net/tips/mobile-website-mistakes/

モバイルサイトのデザイン制作でありがちなミスをまとめています。

  1. 画面サイズを考慮していない
  2. 小さなボタンが多すぎる
  3. 画像が多すぎる/重すぎる
  4. コンテンツを簡素化していない
  5. フォームが長い
  6. ユーザビリティが貧弱
  7. 通常のPCサイトへの誘導がない
  8. 折りたたみのナビゲーションを使っていない
  9. レイアウトが複雑
  10. テストをしていない

図2 モバイルサイトデザインでありがちなミス10個

図2 モバイルサイトデザインでありがちなミス10個

3. 25 Examples of Responsive Website | AcrisDesignhttp://acrisdesign.com/2012/08/25-examples-of-responsive-website/

レスポンシブWebデザインを使ったサイトのギャラリーです。

レスポンシブなサイトの画面キャプチャーを掲載する場合,複数サイズを並べて紹介したりするのですが,この記事ではPCサイズの画面の上にモバイルサイズの画面を載せています。これだと一度にキャプチャーを撮ることができて便利かもしれません。

図3 レスポンシブWebデザインのサイトギャラリー

図3 レスポンシブWebデザインのサイトギャラリー

4. jquer.in jquer.in ≫ Search Less,Play More : An extensive and visual collection of jquery plugins listed according to its categoryhttp://jquer.in/

jQueryプラグインをまとめて紹介したサイトで,カテゴリーごとに見ていくことができます。

画面下までスクロールすると,検索窓とカテゴリー一覧があります。

図4 jQueryプラグインをカテゴリー別にまとめたサイト

図4 jQueryプラグインをカテゴリー別にまとめたサイト

5. Sneakpeekit | Sketch sheets for Web Designershttp://sneakpeekit.com/

手書きでWebデザインのスケッチをするための用紙のPDF素材を配布しています。

ブラウザの枠の入った方眼用紙のようなもので,複数のサイズや種類が選べるようになっています。また,タブレット端末用とスマートフォン用のデータもあります。

図5 Webデザインのスケッチ用紙素材いろいろ

図5 Webデザインのスケッチ用紙素材いろいろ

そのほか,最近の記事の中から,気になるニュース記事を紹介します。

先週の気になるWebサービス

BBC News - Your Olympic athlete body matchhttp://www.bbc.co.uk/news/uk-19050139

自分と身長・体重の近いオリンピック選手を探すというサービスで,イギリスBBCが提供しています。入力した身長,体重に近い選手を表示してくれるとともに,全選手の分布図の中でどの辺かを確認できます。

この分布図のオレンジの点をクリックすると,その位置の身長・体重の選手が分かります。分布図上でいろいろクリックしていっても面白いですね。身長・体重が一番低いのは,日本の体操女子・寺本明日香選手で136cm/30kgです。

よく見ると,ひとりずば抜けて体重の重い選手がいます。柔道のリカルド・ブラス ジュニアというグアムの選手で,218kgもありますね。もちろん100キロ超級なわけですが,2回戦で敗退したようです。

図6 身長・体重が自分と近いオリンピック選手を探せるサービス

図6 身長・体重が自分と近いオリンピック選手を探せるサービス

今週の気になるWebネタ

「イイね!」ボタンの名称が「ナイス!」に変わりました - Yahoo!ブログからのお知らせ - Yahoo!ブログhttp://blogs.yahoo.co.jp/y_j_blog/31862311.html

Yahoo!ブログの「イイね!」ボタンの名称が「ナイス!」に変更されました。変更した理由は「類似サービスとの混同を防ぐため」とのことです。ツッコミどころが多くて面白いネタだと思うのですが,IT業界的には全く話題になっていないようですね。

もともとYahoo!ブログには「傑作」という人気投票システムがあったのですが,それが廃止されて機能強化された「イイね!」になったのが6月末それからわずか1か月での名称変更ということです。

ちなみにmixiには「イイネ!」⁠GREEには「いいね!」ボタンがあります。Facebookと表記が同じGREEが一番いさぎいいような感じもします。タイムライン機能が追加されたLINEは,⁠いいね!」ではなく笑顔や泣き顔など複数種類のスタンプでコミュニケーションができて楽しそうです。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/

コメント

コメントの記入