グリッドレイアウト ( グリッドデザイン、グリッドシステム ) はweb制作でのデザイン手法の一つです。 画面やページを縦横に分断する直線で格子状に分割し、これを組み合わせてブロック内の要素の大きさや配置を決定していく方法です。 グリッドはさまざまなレイアウト間の一貫性を維持しデザイン上の意思決定を迅速化するのに役立ち。グリッドを使用すると様々なスクリーンサイズでの配置やレイアウトをより正確にコントロールすることができます。 元を辿るとグリッドシステムはヨゼフ・ミューラーブロックマン(Josef Müller-Brockmann, 1914年5月9日 - 1996年8月30日 スイスのGraphic designer )が考案したデザインの手法だそうです。 960 Grid System https://960.gs/ デモページ 960 Grid Systemはページ幅 960px(コン
弱視・ロービジョンのユーザーのウェブ利用時の課題と解決案(WIP) | アクセシビリティ | SmartHR Design System
弱視・ロービジョンのユーザーの特性と利用環境弱視・ロービジョンのユーザーの多くは、画面拡大や色反転などの支援技術を活用して、ウェブを利用します。 弱視・ロービジョンの視覚特性と、支援技術の仕様によって、特有の困難に直面することがあります。 このページでは、弱視・ロービジョンのユーザーがSmartHR製品を利用する際に観察された問題点と、その解決案をまとめています。 画面拡大弱視・ロービジョンのユーザーは、OSの標準機能や専用ソフトを用いて画面の全体や一部を拡大して閲覧することがあります。拡大時はウェブページ全体を俯瞰することが難しくなります。 色反転機能弱視・ロービジョンのユーザーは、画面上の色を見やすい組み合わせに変更したり、色を反転するOSの設定や機能を利用することがあります。設定や機能の仕様により、ウェブページのUIは任意の色の組み合わせで表示されます。 スクリーンリーダー弱視・ロー
デザイントークンの目的デザイナー・エンジニアに低レイヤーな統一言語を提供します。開発設計担当者に必要な情報を明確に伝えられます。スケーラブルで一貫性のあるプロダクト設計を可能にします。ハードコードな設計を減らし、変更に強いプロダクト開発を可能にします。効率的に速いインターフェース設計を可能にします。種類SmartHR Design Systemでは2つのトークンを提供します。 プリミティブトークン具体性のある値です。もっとも低レイヤーで原子的な意味を持つトークンです。十分な値と、増減も容易な名前空間を設定しておくことが望ましいです。セマンティックトークン特定のコンテキストに関連した値です。トークンの意図した目的を伝えるのに役立ちます。単一の意図を持つ値が、複数の場所に現れる場合に使います。参考文献https://www.lightningdesignsystem.com/design-to
よくあるテーブルで複数のオブジェクトに対して一括操作するUIのパターンです。 構成「よくあるテーブル」のなかで、複数オブジェクトへの一括操作に関するUIは、以下の要素で構成されます。 テーブル内のその他の要素については、「よくあるテーブル」の構成を参照してください。 一括選択するチェックボックス（必須）個別選択するチェックボックス（必須）テーブル内の一括操作エリア一括操作エリアの表示選択状態の表示わくわくチェック（すべてのオブジェクトの選択）一括操作ボタン 1. 一括選択するチェックボックステーブル内の要素をすべて選択できるチェックボックスです。 デフォルトは未選択状態で、クリックされるとテーブルに表示されているオブジェクトをすべて選択状態にします。 表示しているページ外のオブジェクト（他のページのオブジェクト）は選択状態にしません。 「一括選択するチェックボックス」が未選択状態のときに、
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Grid layout design system
デザイントークン | プロダクト | SmartHR Design System
テーブル内の一括操作 | デザインパターン（共通） | SmartHR Design System