週刊Webテク通信

2009年1月第4週号1位はインターフェイスの画面パターン12個/気になるネタはオバマ大統領、愛用の携帯端末「ブラックベリー」使用可能に

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。

今回は、2009年1月19日~1月25日の間に見つけた記事のベスト5です。

今週のWebテク記事ベスト5

1.Designing Web Interfaces: 12 Standard Screen Patternshttp://designingwebinterfaces.com/designing-web-interfaces-12-screen-patterns

インターフェイスの画面パターンを12個に分類して紹介しています。

Webページのデザインパターンではなく、Webサービスやアプリケーションのユーザーインターフェイス設計に役立つパターン集です。

各パターンには、実際のそのパターンの使用例として画面ダンプも掲載されています。iTunesの画面がやたらに登場しています。

また、このページよりさらに詳しい内容がPDFでダウンロードできるようになっています。PDF版では画面ダンプにもキャプションが入っていました。PDFのダウンロードはこのページの執筆者Theresa Neilさんのサイト「Download Standard Screen Pattern Library」というリンクを見つけてください。

これは、⁠Designing Web Interfaces」という本の宣伝サイト内のブログに掲載されているコンテンツです。本の目次もこのサイトで見られるのですが、なかなか興味深い本ですね。

図1 スタンダードな画面パターン12個+1つのボーナスパターンの紹介
図1 スタンダードな画面パターン12個+1つのボーナスパターンの紹介

2.More Web Design Trends For 2009 | Design Showcase | Smashing Magazinehttp://www.smashingmagazine.com/2009/01/21/current-web-design-trends-for-2009/

先週に引き続き2009年Webデザインのトレンドをまとめた後編です。今回の分だけで21項目もありました。

いくつかの項目ではタイトルが別記事にリンクしているのも要チェックです。

このネタを受けての日本語記事としては、2009年の Web デザイントレンド 2 | WWW WATCHが詳しくまとめてあってオススメです。前編についても2009年のWebデザイントレンドとしてまとめてあります。

個人的には「⁠⁠Speaking⁠⁠ navigation」と名付けられている補足テキスト付きメニューは、日本でももっと流行るといいかなと思います。

3.Webタイポグラフィまとめ - Archivahttp://archiva.jp/web/html-css/web-typography.html

フォント指定や行間、約物、合字など、CSSでテキストを扱うノウハウ集。 日本語にはあまり関係ない指定が多いのはしょうがないところですが、さくっと簡潔にまとめてあります。

「Web Designing」の2月号の特集が「Webデザイナーのためのタイポグラフィ大特集」ですが、このサイトの作者(⁠⁠Web Creators」に寄稿もされている)によると偶然かぶったようですね。

図2 Web上でのタイポグラフィについての簡潔なまとめ
図2 Web上でのタイポグラフィについての簡潔なまとめ

4.CSS Resources: The Ultimate Collection ? DivitoDesignhttp://www.divitodesign.com/2009/01/css-resources-ultimate-collection/

CSSに関する情報源サイトをまとめた「Ultimate(究極の⁠⁠」と銘打ったリンク集です。この手のものはリンクの数を競いがちですが、このリストは各項目ごとに4つずつくらいの厳選されたリストとなっているのがいいですね。

きちんとアップデートされ続ければ、かなり使えるリンク集になると思います。CSSに限らずWebの世界ではトレンドの移り変わりが激しいですから。

5.[JS]オバマ大統領も使ってるjQueryのプラグイン集 | コリスhttp://coliss.com/articles/build-websites/operation/javascript/jquery-plugins-used-obama.html

これはタイトルの付け方がウマいです。

オバマ大統領の公式サイトとホワイトハウスのサイトでは、確かにjQueryが使われています。jQueryを使って画像を替えているわけです。

有名どころのプラグインばかりで、jQueryユーザーにはオバマ大統領やホワイトハウスがぐっと身近に感じられたことでしょう。

jQueryを使用したサイトを制作する際には、ホワイトハウスのサイトにも使われているものだとクライアントに説明すると、ぐっと安心感が増しそうです。

図3 オバマ大統領(のサイトを作ってる人)が使っているjQueryプラグインの紹介
図3 オバマ大統領(のサイトを作ってる人)が使っているjQueryプラグインの紹介

以上、メルマガ「デイリーWebテク」で先週紹介した記事から独断と偏見で選んだベスト5でした。

先週のWebテク記事を振り返ると、UI(ユーザーインターフェイス)に関するネタが目立っていたようです。1位で紹介した記事もそうですが、他にも、各メーカーなどによるUIデザインガイドラインのリンク集UIデザインガイドラインのまとめや訴求力の高いUIデザインのためのテクニックを紹介する12 Useful Techniques For Good User Interface Design⁠、Yahoo! User Interface Libraryのような、美しいUIを実現するためのライブラリを紹介した10 Beautiful Web UI librariesなんて記事がありました。

また、先週の1月24日でMacintoshが発売25周年を迎えたということで、アップルの歴史を振り返るような記事も見受けられました

デイリーWebテクでは、⁠ほぼ)デイリーでWebテク関連の情報をお届けしています。くわしくは、この記事の最後にある著者プロフィールをご覧ください。

おすすめ記事

記事・ニュース一覧