週刊Webテク通信

2014年4月第3週号1位は、上品な企業サイトのデザインについて、気になるネタは、パソコンなしで音楽CDをAndroidスマホに保存、異色の「CDレコ」買いか?

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

1. Prim Corporate Web Design Style - Is it Good for my Business?http://www.onextrapixel.com/2014/04/11/prim-corporate-web-design-style-is-it-good-for-my-business/

上品な企業サイトのデザインについて解説しています

  • すべてをすっきりきれいに。コードもテキストもグラフィックスも
  • 調和とバランスのとれたレイアウト。すべての要素が階層的に配置され、すべてのページが一貫して配置される
  • リンク色や見出しのような細部まで考え抜かれており、他の部分と調和している
  • デザインやコンテンツを強調するために、十分なホワイトスペースが取られている
  • 極端に実験的なデザインではなく、ほどほどに現代的なデザイン要素を使う
  • 直感的なカラースキームと高いコントラストで、読みやすいテキストと視覚的要素を用意する
  • ビジネスサイトは豪華にしない
  • ミニマルなデザインを選ぶ。訪問者が他のものに注目する機会を与えずに、自社商品に注目させる

企業サイトはシンプルに控え目にということですね。

図1 上品な企業サイトのデザインについての解説

※指定画像がありません※

2. 40 CSS Apps, Tools, and Resources for Web Developers | SpyreStudioshttp://spyrestudios.com/40-css-apps-tools-resources/

デスクトップアプリケーション、オンラインツールなど、CSS制作に役立つツールや素材が紹介されています。

有料のアプリケーションもいろいろ紹介されており、Mac向けアプリが多数紹介されていました。

図2 CSS制作に役立つツールや素材

※指定画像がありません※

3. Responsive Email Patternshttp://responsiveemailpatterns.com/

レスポンシブなHTMLメールのためのパターンがまとめられています。

通常のWebページ制作と違い、HTMLメールの場合はいまだにレイアウトにテーブルを利用するなど、独特のテクニックが必要です。

HTMLメールに限らず、通常のレスポンシブなCSS作成の参考になる箇所も多そうでした。

図3 レスポンシブなHTMLメールのためのパターン集

※指定画像がありません※

4. The 10 best Photoshop plugins for web designers | Photoshop | Creative Bloqhttp://www.creativebloq.com/photoshop/plugins-web-design-41411332

Webデザインに役立つPhotoshopプラグインを10個紹介した記事です。

PhotoshopのレイヤーからCSS3グラデーションを作るもの、スライス機能を強化するもの、ガイド作成を簡単にするものなどが掲載されています。

図4 Webデザインに役立つPhotoshopプラグイン10選

※指定画像がありません※

5. 15 Free and Premium jQuery Flipbook Plugin | Smashmagzhttp://smashmagz.com/15-free-and-premium-jquery-flipbook-plugin/

本をめくるような効果を与えるjQueryのプラグインをまとめています。

電子ブック的な用途に使えそうなものが多いですが、単純に要素がひっくり返る効果を与えるものもありました。

図5 本をめくるような効果を与えるjQueryプラグインを15個紹介

※指定画像がありません※

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

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

Panda - Daily Inspiration and News for Designershttp://usepanda.com/

Pandaは、デザイナーのためのニュースとインスピレーションの参考になりそうな作品とが同時にチェックできるサービスです。DribbbleとBehanceからの作品を見られるサービスはいろいろありますが、ニュースと一緒に見られるようにしたところが新しいですね。

ニュースは、Hacker News、Designer News、Sidebar.ioを切り替えられるようになっていて、新着順か人気順かも選べます。DribbbleとBehanceとも切り替えるようになっています。ニュースはタイトルが表示されるだけで、クリックすると即そのページに移動します。

デザイナー向けポータルとして面白いのですが、もうひとひねり欲しいようにも思えます。今後のアップデートに期待したいですね。

図6 ニュースとデザイン作品が見られるデザイナー向けポータル

※指定画像がありません※

おすすめ記事

記事・ニュース一覧