タグ

Webデザインに関するrascal0403のブックマーク (6)

  • ブックマークしておきたい海外/国内Webデザインギャラリーまとめ30選【2017年改訂版】

    Webサイトのデザインがなかなか決まらない。 そんなときは、他のデザイナーが作成したWebデザインをまとめた、ギャラリーサイトをチェックしてみてはいかがでしょう。レイアウトや配色など、アイデアが湧いてくることがあります。 今回は、ウェブサイト制作の参考になりそうなアイデア、インスピレーションを与えてくれるWebデザインギャラリーサイトをまとめています。リストを一度見直し、2017年現在も更新を続けているサイトのみ厳選、追加しているので、実践的でクリエイティブなデザインを探すことができるでしょう。 詳細は以下から。 デザイン制作の参考にしたい、Webギャラリーサイトまとめ 厳選 国内ギャラリーサイトまとめ Muuuuu.org クオリティが高い縦に長いサイトを厳選して集めているサイトです。 現代デザイン トップページだけでなく中面、下層ページもまとめて表示され便利です。 81-web 当サイ

    ブックマークしておきたい海外/国内Webデザインギャラリーまとめ30選【2017年改訂版】
  • [CSS]実はかなり便利!意外と見落とされがちなスタイルシートのテクニックのまとめ

    Webはその進化が早いと言われ、中でもCSSは日々、新しいテクニックや驚くべき実装方法が発表されています。新しいものに目を向けることはもちろん大切です。しかし、すでに利用可能なもので見落としている有用なテクニックがあるかもしれません。 有用なのに、意外と見落とされがちなCSSのテクニックを紹介します。 9 Underutilized Features in CSS 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 1. レスポンシブ対応に便利な「calc()」 2. 目からウロコの「@media」の使い方 3. カラー指定を変数でおこなえる「currentColor」 4. フォームにかなり便利「:valid, :invalid, :empty」 5. ナンバリングするためにol要素は必要ない「counter」 6. 中身が不明な

    [CSS]実はかなり便利!意外と見落とされがちなスタイルシートのテクニックのまとめ
  • Webサイトのフッターにサイトマップを設置すべき理由

    何年か前は、フッターの部分にサイトマップへのリンクを置くのが一般的でしたが、近年ではフッター自体が、サイトマップとして新たに使われるようになりました。 サイトマップは、サイト内のすべてのリンクを1ページ内に記載したものです。しかし今では、フッターを正しくデザインすれば、ほとんどのサイトにおいては、必要ないページとなっています(XMLのサイトマップは、SEOにおいては未だに不可欠ですが)。 伝統的なフッター さかのぼってみると、フッター自体がユーサビリティの要素として、重要視されることはまれでした。伝統的なフッターとはサイト管理に関する一連のリンクと、コピーライトの情報が載せられているようなものを指しますが、研究によると、ほとんどのサイトが伝統的なフッターを使っていたそうです。当時、大半のユーザーはページの一番下にあるフッターの部分は使わないという思い込みがありました。 そんな伝統的なフッタ

    Webサイトのフッターにサイトマップを設置すべき理由
  • UIデザインの歴史に学ぶシャドウと奥行きの使い方

    Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 近年のUIデザインでは、不必要な要素を省き、機能性に焦点を当てるのがトレンドになってきています。デザインの機能面はプロダクトの成功への鍵である一方、その機能面をサポートするという意味で、ビジュアルへの細かい配慮も同じくらい重要です。 この記事では、シャドウなどの視覚的な要素がどのように処理された情報を伝達するものなのかを見ていきましょう。 UIの進化 : 疑似3Dからウルトラフラットデザイン インターフェイスにおける奥行きの幻覚 ユーザーの見るスクリーンは平らですが、デザイナーやエンジニアたちはスクリーン上の全ての物が3Dにみえるように多大など労力を割きました。疑似3D効果(シャドウ、グラデーション、ハイライト)は、ユーザーが操作可能な動作をひと目でわかるように

    UIデザインの歴史に学ぶシャドウと奥行きの使い方
  • Webデザインのプロのテクニックを非常に簡潔に分かりやすくまとめた -Web Design in 4 minutes

    Webページやブログ、プロダクトページ、ポートフォリオなど、ちょっとした工夫でプロがつくったかのようにかっこよく、魅力的に見せるテクニックを4分で学べるコンテンツを紹介します。

    Webデザインのプロのテクニックを非常に簡潔に分かりやすくまとめた -Web Design in 4 minutes
  • 配色がうまくいく、デザイナーが覚えておきたい7つの鉄板ステップ

    海外デザインブログ Medium で公開された「Desining in Color」の著者より許可をもらい、日語抄訳しています。 配色は、デザイナーにとって強力なツールです。注目を集めたり、感情をゆさぶったり、メッセージを伝えることもできます。配色がどれほど重要なのか分かりやすく伝えるために、よく引用されるThe Impact of Color on Marketing では、いくつかの商品において、90%以上のユーザーが配色によって購入を決めているということも、研究によって分かってきています。 効果的に配色を活用することが、デザインにおいて重要になりますが、新しい色の組み合わせを考えるのも大変です。それぞれの色には意味があり、組み合わせは無限と言えるでしょう。 この記事は、デザインに合った配色カラーパレットのつくり方の紹介ガイドです。より多くの色をつかって、直感的に素敵な色の組み合わせ

    配色がうまくいく、デザイナーが覚えておきたい7つの鉄板ステップ
    rascal0403
    rascal0403 2016/06/28
    デザイナーじゃないけど覚えておきたい!
  • 1