Vol.364

Writing Better CSS Jump to heading #

ベターなCSSを書くために Jump to heading #

Adam氏の経験に基づいたCSSの設計方法について解説していく。まず、ベターなCSSとはどういったものかを定義する。その後に、それを達成するためにどのような方法があるか、どのような点を考慮していけばよいかを説明していく。

Contextual Spacing For Intrinsic Web Design | Modern CSS Solutions Jump to heading #

コンテキストに応じたスペーシング Jump to heading #

ユーザーのブラウジング環境はひとつに定まっていないため、閲覧環境に応じたスペーシングが柔軟に行われる必要がある。この記事ではコンテキストスペーシング手法を使用して、その予測不可能性に対してどのように対応できるかを説明する。

A Product Design Process for the Real World Jump to heading #

プロダクトデザインプロセス Jump to heading #

Ted氏が実践する、現実的なプロダクトデザインプロセスについて、紹介する。

1. 発見: 問題とは何かを特定し、十分な証拠を収集する
2. 定義: 問題を定義し、目標を定める、目標の指標を明確にする
3. 開発: プロジェクトを実行する

Tokens as intents Jump to heading #

デザイントークンの命名について、どのような点を考慮するべきか考察する。

Learn CSS Subgrid - Ahmad Shadeed Jump to heading #

CSSサブグリッドの機能について、FirefoxとSafari Technology Previewで利用が可能となっている。この記事ではCSSサブグリッドでどのような問題が解決できるのか解説する。

In Brief Jump to heading #

• Web Scraping via Javascript Runtime Heap Snapshots - Adrian Cooney’s Blog: puppeteer-heap-snapshotがどのようにスクレイピングを行うのかについて解説する

• Readability: The Optimal Line Length Articles Baymard Institute: 行に対して適切な文字の量はどのくらいかを考察する

• Ordering CSS Declarations: CSSのプロパティの記述順序をどのようにするのがベターか考察する

• Test in many browsers: ブラウザの多様性の重要性について説く

• Magical SVG Techniques: SVGでユニークな表現をするためのテクニックをいくつか紹介する