週刊Webテク通信

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

ネットで見かけた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 複数のソーシャルメディアの投稿をまとめて見ることができるサービス

おすすめ記事

記事・ニュース一覧