A consistent visual system for the brand website

A website should remain recognizable as visitors move beyond the homepage. Consistency comes from shared visual decisions that support reading and maintenance, not from treating every page as a separate campaign image.

Confirm the brand foundations

Collect approved logos, colours, names, licensed fonts and usable photography. Distinguish confirmed standards from proposals. Preserve the logo's structure while checking contrast, small sizes and screen use. Learn from reference brands' methods without copying their proprietary assets or compositions.

Define typography and space

Specify heading levels, body copy, notes and controls, including line height, spacing and reading width. Prefer regular and medium weights where appropriate. Let hierarchy and layout provide emphasis, and test English and Chinese line breaks independently.

• Keep equivalent levels consistent.
• Use short headings and useful supporting copy.
• Check numbers, punctuation and translated buttons.
• Maintain comfortable reading sizes on narrow screens.

Give imagery a repeatable language

Agree on lighting, perspective, backgrounds, colour treatment and crops. Product images should reveal materials and construction. People and environments should relate to real business use. Supply editors with examples of suitable compositions and responsive crops.

Test components with imperfect content

Begin with navigation, cards, tables, downloads, forms and footer patterns. Include focus, error and disabled states. Test long titles, missing images and multilingual copy so the system works beyond ideal placeholder content.