週刊Webテク通信

2011年8月第2週号　1位は，デザイン設計を行うのはPhotoshopかブラウザか？，気になるネタは，スマホで雑誌が無料，お店の中なら

Webテク, Webデザイン, Web広告, Photoshop, iOS, Facebook, ノート, スマートフォン, 雑誌

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

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

1. The big decisions about design and how to make them ≪ Boagworldhttp://boagworld.com/season/2/episode/s2e5/

Webデザインを行う際に，どういった要素を考慮してどう決定していくかのノウハウ記事です。デザイン設計を行う際に，Photoshopとブラウザのどちらで行うかが，メインの話題となっています。

Photoshopなどのグラフィックソフトでデザインしていくより，ブラウザ上で設計していくアプローチが増えているとのことで，以下の点がポイントのようです。

  • 多くのデバイスや画像サイズ向けにデザインすることが重要になりつつある
  • インタラクティブな部分は静的なデザインでは確認できない
  • 一つの静的デザインを見せることはクライアントに誤解を与える可能性がある

また，デザインの原則として

  • グリッド
  • ホワイトスペース
  • （視点の）流れ
  • カラー
  • タイポグラフィ
  • テクスチャ
  • 画像

について解説しています。

図1　Webデザインを行う際の重要な決定事項

図1　Webデザインを行う際の重要な決定事項

2. Tips for Creating Effective Single Page Websiteshttp://www.graphicmania.net/tips-for-creating-effective-single-page-websites/

効果的なシングルページWebサイトを作るためのヒントが紹介されています。

  • 目的を理解する
  • 焦点を定める
  • 魅力的なレイアウトを作る
  • 複雑になるのを避ける
  • ナビゲーションを明確に
  • 創造的に
  • 必要に応じてJavaScriptスクリプトなどでコーディング

といった内容について解説されています。

図2　シングルページWebサイトを作るためのTips

図2　シングルページWebサイトを作るためのTips

3. Showcase of Web Designs with Sexy Serif Typographyhttp://line25.com/articles/showcase-of-web-designs-with-sexy-serif-typography

セリフ書体を使ったWebサイトのショーケースです。「⁠ひげ」などと呼ばれる装飾の付いたセリフ書体の，洗練されたスタイリッシュな美しさが際立つサイトを紹介しています。

図3　セリフ書体を使ったWebサイトのショーケース

図3　セリフ書体を使ったWebサイトのショーケース

4. Persistent Headers | CSS-Trickshttp://css-tricks.com/13465-persistent-headers/

スクロールしても残り続ける見出しの作り方を解説しています。表組みのヘッダ部分に利用するのはいいですね。

図4　スクロールしても残り続ける見出し

図4　スクロールしても残り続ける見出し

5. 33 iOS Mobile App Screen Views for Design Inspiration - Web Design Blog ? DesignM.aghttp://designm.ag/inspiration/33-ios-mobile-app-screen-views-for-design-inspiration/

デザインが参考になるiOSアプリを多数紹介しています。奇抜なモノよりもiOSらしい落ち着いて洗練されたデザインのものが多いです。この，iOSらしいUIデザインというものが共有されているところが，iOSの強みなんでしょうね。

図5　デザインが参考になるiOSアプリのショーケース

図5　デザインが参考になるiOSアプリのショーケース

そのほか，先週の記事の中から，Faebook関連の話題を紹介します。

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

Evernoteに負けない便利なオンラインノートサービス8選 - CNET Japanhttp://japan.cnet.com/news/society/35005971/

今回は，オンラインノートサービスを集めて紹介した記事を取り上げます。

それぞれ特定の機能に特化した，便利そうなツールが揃っています。

複数人で編集できる文書共有は，GoogleドキュメントやFacebookグループのドキュメントでも可能ですが，みんながアカウントを持っていないと使えません。

「Writeboard」や「Jottit」のようにユーザー登録なしでコラボレーション機能が使えるツールは，場合によっては便利だと思います。

Evernoteの直接的な競合にあたるサービスという「Catch」も気になりますが，メモは一元化しておかないと探すときに不便なので，新しいサービスに手を出しにくいという人も多いと思います。

図6　オンラインノートサービス8選

図6　オンラインノートサービス8選

今週の気になるWebネタ

スマホで雑誌が無料，お店の中なら――場所を価値化する「すまほん。」のビジネスモデル - ITmedia プロフェッショナル モバイルhttp://www.itmedia.co.jp/promobile/articles/1108/12/news060.html

スマートフォンを持って店に入ると，1時間だけ雑誌コンテンツが読み放題というサービスが開始されたそうです。その店舗内にいるかどうかは位置情報と店舗コードでチェックするとのこと。お店側がコンテンツ料金を払うというビジネスモデルです。

銀行や病院の待ち時間，読みたいと思った雑誌を人に取られて残念な思いをしたことのある人は多いはず。雑誌がボロボロで読む気をなくした経験を持つ人もいるでしょう。でも，このサービスならそんな心配もなく，見たい雑誌を楽しめます。なかなかいいアイデアですね。

この手のサービスが成功すると，雑誌の電子化に拍車がかかるかもしれません。一方で，紙の雑誌はいよいよピンチになってしまうのかも。店舗による定期購読が売り上げを支えている雑誌もあるようですし，雑誌業界に与えるインパクトが大きいサービスなのかもしれませんね。

Webテク, Webデザイン, Web広告, Photoshop, iOS, Facebook, ノート, スマートフォン, 雑誌

著者プロフィール

アシカガコウジ

フリーのWebデザイナー＆ライター。ポッドキャスト「アシカガCAST」でデジタル活用のヒントを発信中。シャープMZ-80Bからのパソコンユーザーで，Macintosh IIciからのMacユーザーでApple好き。Webテク情報やツール（ソフトウェア）の案内，デジタル活用情報をまとめた「アシカガノオト」をNotionで公開しています。

http://bit.ly/ashikaganote