週刊Webテク通信

2014年5月第2週号 1位は，Webサイトのデザインをリニューアルするときに陥りがちな間違い，気になるネタは，アップル，「iTunes Match」の提供を日本国内で開始

Webテク, Webデザイン, Web広告, Google Chrome, モバイル, IE, ソーシャルメディア, iTunes Match

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

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

1. Top Mistakes When Redesigning a Websitehttp://www.onextrapixel.com/2014/05/02/top-mistakes-when-redesigning-a-website/

Webサイトのデザインをリニューアルするときに陥りがちな間違いをまとめた記事です。

以下の項目に分けて解説しています。

  1. やみくもに流行を追う
  2. 自分の知識に固執する
  3. 明確な締め切りと手順を設定しない
  4. 一度に全てのことをやろうとする

3で紹介されている，明確な締め切りを設定しない，優先順位を決めないというのは，確かによくある失敗するパターンだと思います。ここでは，そのプロダクトに対しての主観や感情をなるべく排除することが大切だという解説がされていました。

図1　Webサイトのデザインをリニューアルするときに陥りがちな間違い

図1　Webサイトのデザインをリニューアルするときに陥りがちな間違い

2. Unique Web Page Design | The Best Web Page Design Tips You Will...http://www.medianovak.com/blog/unique-web-page-design/

独自性のあるWebページデザインに必要なことを解説しています。

  • もっと空白を使う
  • タイポグラフィを改善する
  • 一貫性を持ってデザインする
  • ユーザビリティを考える

図2　独自性のあるWebページデザインに必要なこと

図2　独自性のあるWebページデザインに必要なこと

3. Easy Mobile Browser Testing with Chrome Emulation - Designmodohttp://designmodo.com/mobile-browser-test-chrome/

Google Chromeで，モバイル端末でのブラウズをエミュレートする方法を紹介しています。

デベロッパーツールにエミュレーション機能が付いていることを，知らない人も多いんじゃないでしょうか。

ピンチによる拡大縮小は，シフトキーを押しながらマウスホイールかトラックパッドでスクロールすることで対応しています。

なお，同じWebKit系のSafariのデベロッパーツールには，この機能は付いていませんでした。

図3　Chromeでモバイル端末のブラウズをエミュレートする方法

図3　Chromeでモバイル端末のブラウズをエミュレートする方法

4. 25 Websites Designed with a Limited Color Palettehttp://line25.com/articles/25-websites-designed-limited-color-palette

限定された色数しか使っていないWebデザインのギャラリーです。

3，4色くらいのカラーパレットだけでデザインされたサイトが25個紹介されています。

図4　限定された色数のWebデザインのギャラリー

図4　限定された色数のWebデザインのギャラリー

5. Stunning Shades of Grey in Web Designs | SmashingApps.comhttp://www.smashingapps.com/2014/05/04/stunning-shades-of-grey-in-web-designs.html

グレーの陰影が魅力的なWebデザインのギャラリーです。

グレーをベースにすることで，キーとなる色やカラー写真が目立っています。写真もふくめて全てグレースケールというサイトもありました。

図5　グレーベースのWebデザインのギャラリー

図5　グレーベースのWebデザインのギャラリー

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

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

Feedient - All of your social life in one placehttps://feedient.com/

Feedientは，複数のソーシャルメディアの投稿をまとめて見ることができるサービスです。TwitterのタイムラインとFacebookのニュースフィードをはじめ，InstagramとYouTubeも見ることができます。

複数のタイムラインを横に並べて見ていくことができ，Twitterのリプライやリツイート，Facebookの「いいね！」やコメントもこのサービス上で行えます。

HootSuiteのようなものですが，実質有料なHootSuiteに対し，こちらは無料です。しかし，現在ベータ版のため，将来どうなるかはわかりません。

複数のTwitterアカウントを持っている人には，特に便利だと思います。デザインもすっきり見やすくていい感じです。

図6　複数のソーシャルメディアの投稿をまとめて見ることができるサービス

図6　複数のソーシャルメディアの投稿をまとめて見ることができるサービス

今週の気になるWebネタ

アップル，「iTunes Match」の提供を日本国内で開始 | マイナビニュースhttp://news.mynavi.jp/news/2014/05/02/314/

突然，日本でもiTunes Matchが使えるようになりました。簡単に言うと，自分の持っている楽曲全部をクラウドに置くことで，いつでもどこでもiPhoneなどで自分の音楽コレクションを楽しめるというものです。

実際は全部の楽曲をクラウドにアップロードするのではなく，iTunes Storeにある楽曲の場合はそっちを使うようになっています。あなたの持っている楽曲がiTunes Storeにあるかどうか自動でMatchしてくれるというわけですね。

なお，わたしも発表を知ってすぐに登録を済ませたのですが，設定がなかなか終わらず，使えるようになったのは連休明けでした。5月2日に設定開始したのに，使えるようになったのは5月7日の朝と時間がかかりすぎですが，結構多くの人が同じような感じだったようですね。

Webテク, Webデザイン, Web広告, Google Chrome, モバイル, IE, ソーシャルメディア, iTunes Match

著者プロフィール

アシカガコウジ

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

http://bit.ly/ashikaganote