Readable version: DeepSeek招聘页-谷歌设计优化方案.html
The page under review is the current DeepSeek招聘职位技能分析.html. Stance: Google Web quality line (Search / Careers / Material 3). Brand still belongs to DeepSeek; do not make the page into Google.com, and do not keep wearing Claude Academy’s clothes.
Shipped (2026-09-08): P0–P2 have been written into the interactive page (white background / Roboto / Chip / direction Tab / highlight can be turned off / short note cards). What follows is still the diagnosis and proposal as written at the time.
Grade C+ (before implementation). The task skeleton is right; identity is worn wrong; contrast and touch targets fail; three keyword grammars are stacked onto the original text.
Diagnosis
| Layer | Current | Change to |
|---|---|---|
| Identity | Cream paper + serif + terracotta | White background, sans-serif, one primary color |
| Canvas | Whole page overflow: hidden |
Document flow; the list can scroll on its own |
| Density | Dashboard too dense → prose too sparse | Scannable structure on an 8dp grid |
| Emphasis | Bold / italic /【】 all on at once | Clean by default; at most 6 Chips; highlight can be turned off |
| Color | Categories rely on color dots | Categories in text; primary color serves CTA only |
| a11y | Rows a bit short; select filters | 48dp, Chip, focus ring, AA contrast |
Principle: use Google’s system (grid, type scale, contrast, task flow); wear the clothes DeepSeek should wear (cold, clean).
Token (P0)
- Surface
#FFFFFF/ variant#F8F9FA - Type
#202124/ secondary#5F6368 - Primary
#1A73E8, container#E8F0FE(if insisting on DeepSeek black and white: fill buttons with#202124, keep links blue) - Typeface: Roboto + Noto Sans SC; role names Google Sans / Roboto Medium 22–28; serif forbidden
- Row height 48–56dp; radius 8 / buttons 24
Four surfaces
- Top bar: Tabs indicated by a bottom edge. Copy “Roles / skill notes.” Apply is the primary button.
- List: Search stays at 48 height; categories are horizontally scrolling Chips; each row is title + “Beijing · intern/full-time”; selected blue 50.
- JD: Skills lifted, at most 6 Chips; multi-direction becomes one direction at a time; “highlight skills” switch uses blue 50, no 【】.
- Notes page: 4–5 short cards + the first 8 skill bars. Do not put the heatmap back. Clicking a bar returns to the filtered list; keep that.
Keywords
Original text is clean by default. Cultural words (open source, long-termism) are not marked. When skills need to be scanned, turn the Toggle on; do not use pseudo-element brackets.
Phasing
- P0 Change identity: drop cream/serif/terracotta, unlock overflow, row height 48.
- P1 Scanning: Chip filters, skills lifted, direction anchors, copy.
- P2 Short note cards + WCAG + font subsetting.
P0 can change only assets/ds-talent.css; the JSON structure need not be touched.