Skip to content

Vol.436

The Design System Ecosystem Jump to heading

デザインシステムのエコシステム Jump to heading

この記事では、大規模組織における成熟したエンドツーエンドのデザインシステムがどのようなものかについて掘り下げている。デザインシステムとデジタルプロダクトの関係は、互いに影響を与え合う循環的なものであると説明されている。デザインシステムはプロダクトに使われ、プロダクトはデザインシステムの内容に影響を与える。また、デザインシステムが持つべき様々なレイヤーを紹介する。それらは、すべての組織において、すべて必要というわけではない。レイヤーのほとんどはオプションであり、繰り返し追加できる。 シンプルなものから始めて、実際のニーズが発生するにつれて、より複雑なエコシステムに至るまで繰り返していくことが重要。

HTML web components Jump to heading

HTML Web コンポーネント Jump to heading

Webコンポーネントは、フレームワークに依存しないウェブ標準としての利点を持ち、ReactやAngularのような既存技術に代わる選択肢として注目されている。これらはポータビリティが高く、長期的なウェブブラウザーの存続と共に利用可能という利点がある。ReactからWebコンポーネントへの移行には学習曲線があるが、HTMLの再利用と拡張に重点を置くことを推奨する。カスタムエレメントを使用して既存のマークアップを強化し、shadow DOMの使用は最終手段とする。これにより、より堅牢で実用的なウェブ開発が可能になる。

Naming Variables In CSS Jump to heading

CSS変数の命名 Jump to heading

この記事では、CSS変数の名前付けについて詳しく説明している。CSS変数は、スタイルシート内で再利用可能な値を定義するのに役立つが、適切な命名をすることが重要。

  • 意味のある名前をつける
  • キャメルケースを使用する
  • 接頭辞や接尾辞を使用する
  • コメントを追加する
  • ドキュメント化する

Lets reinvent the wheel Nerd Jump to heading

この記事は、Vasilis van Gemert氏がNürnbergのborder:noneイベントで行ったトークに関するもの。ウェブデザインツール、HTML、アクセシビリティ、CSSなどについて話し、ウェブ業界の課題について触れる。ウェブ業界のツールとアプローチに対する批判と、より良いウェブデザインとアクセシビリティの実現に向けた呼びかけをしている。

Form Field Usability: Avoid Extensive Multicolumn Layouts (16% Make This Form Usability Mistake) Articles Baymard Institute Jump to heading

フォームデザインにおける単一列と多列レイアウトの使い勝手について解説する。多列フォームはユーザーの注意を分散させる。単一レイアウトはユーザーが情報を入力してスキャンする際に一方向に注意を向けることができ、フォームの完了と確認を容易にする。

In Brief Jump to heading