SEO Practical
What breaks first when forty cards land on the page
A mockup with six cards usually works. At forty, aspect ratio breaks first, and then three cards of one visual family start reading as a single block.
Technote
6 articles· SEO · Designers
SEO Practical
A mockup with six cards usually works. At forty, aspect ratio breaks first, and then three cards of one visual family start reading as a single block.
SEO Practical
An empty screen has to say why it is empty and what to do next. And where a filter can return nothing, show the counts so the dead…
SEO Practical
Redraw the information architecture and addresses change. If they must, the 301 map ships with the change — it is a deliverable, not an afterthought.
SEO Intro
Scope is set by data, not taste. Screens that bring traffic and conversions get a surface refresh — their structure stays where it is.
SEO Practical
Headings are a document's skeleton, not a type size. Once the size you picked and the level you assigned drift apart, the page loses its table of contents.
SEO Intro
Describing every image is not the answer. Decorative images should be left empty; informative ones should carry the information, not a description of the picture.
Cited
Topics outside WordPress are collected on Dongji Communication Tech Insights, run by the same team. The summaries below are quoted from the originals; the titles link to them.
Working with AI
Writing a CLAUDE.md — teaching an AI coding assistant your project
AI coding tools such as Claude Code, Cursor and Copilot do better work the more precisely they know your project. Here is a structure and a set of principles that hold up.
Working with AI
Prompting an AI for UI design — drafting with Claude and GPT
Asking an AI to "make a nice button" gets you a disappointing button. Structured prompts that carry constraints, references and a defined role get you the design you meant.
Themes & plugins
SCSS from the ground up — variables through module structure
The core syntax of SCSS (Sass) and what it solves that plain CSS cannot: variables, nesting, mixins, @use and module structure — organised around patterns you can use immediately.
Themes & plugins
Design tokens and theme colour systems — brand identity in SCSS variables
How to turn a colour palette from a pile of hex codes into a system that means something — semantic token structure and SCSS variable patterns, from a real project.
Performance optimization
Designing a responsive typography system — the science of readability
Hard-coded pixel font sizes are over. Type scales, fluid sizing with clamp(), Korean webfont optimisation and line-height ratios — building typography that reads well on any screen.
Development workflow
From Figma to SCSS — a designer-developer handoff guide
Minimising what gets lost between a Figma file and the code: extracting tokens, naming components, keeping the spacing system in sync — the whole workflow, step by step.