「右カラム無視」への対策
Webユーザーは、情報過負荷へ適応するため、重要でなさそう、あるいは広告のように見えるエリアから注意をそらすように自分たちを訓練してきた。しかし、サイドバーは適切にデザインすれば、コンテンツを発見しやすくし、ユーザビリティをうまく向上させることができる。 Fight Against “Right-Rail Blindness” by Hoa Loranger on October 12, 2013 日本語版2013年12月17日公開 残念なことだが、Webサイトクリエイターが右カラム（Webページの右レールとも呼ばれる）を広告の掲載によく使うので、ユーザーはこのエリアをチェックしないように自分たちを訓練してこざるをえなかった。これは右カラムはやめるべきということだろうか。いや、そんなことはない。 ページの右側で消費されるピクセルは利用可能な量のうちの20％程度だが、ピクセルとはコンピュータ
デザインシステム構築におけるオーナーの重要性｜sakito
こんにちは。ユーザー体験を最高にする活動をしているチーム、通称 Mantle チームのプロダクトオーナー(PO)をしている sakito です。 Mantle チームでは、ユーザー体験を最高にする活動の 1 つとして kinotne のデザインシステムを作っています。この記事では、デザインシステムを作る上での PO の役割や、PO がいることによる効果を実際の事例と合わせて紹介します。 デザインシステムは成長するものデザインシステムは作って終わりというものではありません。組織やプロダクトの変化に合わせて、デザインシステムも成長させていく必要があります。初期に設定した課題から導いた理想やロードマップも、その都度修正していく必要があります。 デザインシステムを作ることだけが目的になってしまうと、最初の「完成」をもってメンテナンスされないといったことも起こりえます。 デザインシステムにおけるオー
この発想はすごい！ モダンCSSで実装する、ボーダーをアニメーションさせるテクニック
モダンCSSで実装する、ボーダーをアニメーションさせるテクニックを紹介します。矩形のHTMLはdiv要素1つだけ、ボーダーがどのようにアニメーション化されているのか、その仕組みが視覚的に分かるデモもあります。 CSS border animations by Bramus 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスにもとづいて翻訳しています。 はじめに CSSにおけるボーダーの設定 ボックスモデルの保持 ボーナスコンテンツ: border-image 終わりに はじめに ボーダーをアニメーションさせるCSSのテクニックを紹介します。 ボーダーをアニメーションさせる仕組み CSSにおけるボーダーの設定 CSSで要素にボーダーを実装するには、border, outline, box-shadowの3つのプロパティがあります。Modern CSS Solutionsで詳しく説
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
