给内容建立层级
一个页面需要能够独立概括主题的标题。接着用小标题组织段落，而不是仅仅把文字加粗、放大。把主要内容放进 main，把导航放进 nav，可以让页面结构更容易被理解。
链接和按钮各做一件事
跳转到另一个地址使用链接，触发当前页面动作使用按钮。让交互元素保留键盘焦点和清楚的名称，通常比给普通 div 添加点击事件更省事。
先检查没有样式的页面
暂时关闭 CSS，观察阅读顺序和内容层级。如果内容依然可以理解，再加入布局和颜色。这种检查也能发现依赖图标或位置表达含义的问题。
先把 HTML 的结构写清楚
标签的意义，往往比页面最初的视觉效果更耐用。
继续读
用 CSS Grid 组织一组卡片
从内容需要多少空间出发，让网格自然适应屏幕。