Facebookの新しいUIデザインで見つけたCSSのテクニックのまとめ
先月からエンドユーザーに段階的に適用され始めたFacebookの新しいUIデザイン、そこで見つけたCSSのテクニックを解説した記事を紹介します。 CSSの実践的なテクニックが数多く使用されており、パフォーマンスや何らかの制約による実装時などの参考になると思います。 CSS Findings From The New Facebook Design by Ahmad Shadeed 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに アバターにSVGを使用する マージンの代わりにスペーサーdivを使用する CSSフィルターの使用 シャドウに画像を使用する CSS変数の多用 テキストの省略表示（複数行テキストの切り捨て） ホバーエフェクトにdivを使用する insetプロパティの使用 dir=autoとCSSの論理プロパティ
UIデザインで大切な空白スペースの効果的な使い方
空白スペースは単なる美ではありません、ユーザインターフェイスの成功への鍵です。空白スペースがWebデザインやUXデザインにおいてどのように使うと効果的に機能するかを紹介します。 Why White Space Is Crucial To UX Design 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 はじめに -UXデザインにおける空白スペースの価値 1. 空白スペースでコンテンツを理解しやすくする 2. 空白スペースで関係を明確にする 3. 空白スペースで注意を引きつける はじめに -UXデザインにおける空白スペースの価値 メインとなるオブジェクトを強調し、ユーザーの注目を引きつけるネガティブスペース・空白スペースの重要性をすべてのビジュアルアーティストが理解しているでしょう。 ネガティブスペース（デザイナー的には空白スペース）
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Kaizen Platform における UI ライブラリのワークフロー
