Vol.276

Written communication is remote work super power - Snir David Blog Jump to heading #

文字でのコミュニケーションの力 Jump to heading #

リモート作業でのコミュニケーションは、オフィスでの作業している場合のコミュニケーションとは大きく異なる。しかしながら、これを理解せずに、リモートにおいてもオフィスでのコミュニケーションを再現しようと、Zoom や Slack で同期的なやり取りをすることは長期的には失敗を招くと、David 氏は指摘する。この記事ではリモート作業での非同期コミュニケーションがどのように有効に働くかについて具体的な例を挙げなら紹介する。

Building a Design System? Start with a map - Prototypr | Prototyping Jump to heading #

デザインシステムは地図から始めよう Jump to heading #

デザインシステムの構築には適用されるべき 3 つのアイディアが存在する。ピースやストックを定義する、それらの関係を定義する、システムの目的を明確にする。この記事では最初の 2 つのアイディアをカバーするアイディアとして、デザインシステムマップを作ることを推奨しており、その地図を構成する、理解、整理、最適化の 3 つのステップについて詳しく紹介する。

Is WebP really better than JPEG? - siipo.la Jump to heading #

WebP は本当に JPEG よりも優れているのか Jump to heading #

一般的に WebP は JPEG 形式よりも小さいサイズで同等の品質を提供できると主張されているが、Johanes 氏が実際に検証を行ったところ、特定の画像最適化ツールでは JPEG の方がファイルサイズが小さくなるケースがあることを発見した。この記事では、様々な画像サイズと変換仕様を組み合わせて検証を行い、特定のケースでは WebP それ以外では他の形式の方がサイズ効率がよくなることがあることを明らかにする。

Optimizing keyboard navigation using tabindex and ARIA — Sara Soueidan – Freelance-Front-End UI/UX Developer Jump to heading #

キーボードユーザーの UX を改善するためのアイディアを紹介。キーボードユーザーはタブを使ってページ内を移動していくが、フォーカス可能なリンクが多い場合、目的の場所にたどり着くためのステップが多くなってしまう。tabIndex などを活用して、マークアップを最適化することで、そういった UX を大幅に改善できる例を示す。

Service Worker Lifecycle Explained Jump to heading #

複雑なサービスワーカーのライフサイクルについてコードを交えながらわかりやすく解説する。

In Brief Jump to heading #

• Using Custom Property “Stacks” to Tame the Cascade | CSS-Tricks: CSS のカスタムプロパティでは第 2 引数に値を指定することで、フォールバックを行うことができる。この記事ではその機能を組み合わせてより予測しやすくメンテナブルな CSS を書く方法を提案する

• ML + Design: デザイン・UX を機械学習、人工知能に組み合わせた例を紹介する

• CUBE CSS - Piccalilli: シンプルな CSS 設計の方法論である、CUBE CSS について詳しく解説する Web サイト

• The importance of clarity in UX: Web ページの美しさのレベルの評価は 1 秒未満で行われるため、明確でわかりやすい設計の重要であることを説く

• Why we switched from Yarn to pnpm - TakeShape, A Platform For The Jamstack: TakeShape のチームでは複数の npm package を管理するために yarn を使っていたが複数の依存関係を管理するためには pnpm が有効であると判断しリプレイスを行った。その過程でどのような判断があったかを紹介する