All posts

Tips for New Web Designers: 7 Habits Worth Building Early

Seven habits for new web designers: a small, accessible palette, edited images, basic SEO, a page weight budget, whitespace, and sharper client questions.

Layout wireframe with a column grid, colour swatch chips and a type specimen card

You've built a few sites, you can make things look decent, and you still feel a gap between your work and the sites you admire. That gap usually isn't taste. It's a handful of unglamorous decisions experienced designers make the same way on every project.

After more than a decade of building WordPress sites, these are the seven habits worth building first: a small palette, edited images, enough SEO to avoid damage, a page weight budget, task-first layouts, generous whitespace, and better questions for clients.

1. Keep your color palette small

Beginner designs often use too many colors: several brand colors, a few accents, a gradient, and a couple of text shades. The result feels noisy, because nothing stands out when everything is colorful.

A workable starting palette:

  • One primary brand color.
  • One accent, saved for buttons and calls to action.
  • Two neutrals, one for backgrounds and one for text.
  • White or near-white as the page canvas.

That's four or five colors. Bright color then works as a signal that tells the eye "this matters."

Check contrast while you pick. WCAG's contrast minimum asks for at least 4.5:1 between normal text and its background, and 3:1 for large text. Light gray text on white is the most common failure.

A color palette generator or Tailwind's default color palette is a solid starting point. Pick one and stop fiddling.

2. Treat stock photos as a last resort

Generic stock photography makes a site look dated and interchangeable. If the budget allows, commission or shoot real photos of the client's product, team, or workspace. If it doesn't, crop tightly and lean on illustration, diagrams, or typography instead.

When you do use stock, edit every image:

  • Crop to fit the layout instead of bending the layout around the image.
  • Match the color temperature to the rest of the site.
  • Export as WebP or AVIF at a sensible quality setting (around 80 is a common starting point) to keep files small.
  • Add descriptive alt text (see the next tip).

3. Learn enough SEO not to break things

You don't need to be an SEO expert, but a few basics keep you from handing clients a site that's harder to find:

  • Give each page one clear <h1> that says what the page is about.
  • Nest <h2> and <h3> headings in order, and don't pick a heading level just for its font size. Google's SEO starter guide says heading order doesn't matter to Google Search, but it matters a lot to screen reader users.
  • Give every meaningful image descriptive alt text, which helps both accessibility and image search.
  • Keep URL slugs short and readable. Our explainer on SEO slugs covers the details.
  • Know where the sitemap is. WordPress generates one by default, and our walkthrough on finding a website's sitemap shows where to look. Google says a well-linked site of about 500 pages or fewer might not need a sitemap, but having one costs nothing.

On WordPress, install an SEO plugin such as Rank Math or Yoast and spend an afternoon reading its documentation. That afternoon saves your clients from basic mistakes later.

4. Design for the task, not the vibe

New designers tend to optimize for how a page looks in their portfolio. Experienced designers optimize for whether a visitor can finish the task the page exists for.

Before laying anything out, answer three questions:

  1. What is the one thing this page exists to do?
  2. What action should the visitor take first?
  3. What would make them confused or make them leave?

Then design backward from the answers. A pricing page with fourteen animated cards is usually worse than a plain three-column comparison table that makes the choice obvious.

5. Set a page weight budget

Every image, font file, and script adds load time, and your visitors are often on slower phones and connections than you are. Pick limits at the start of a project instead of trimming at the end.

Reasonable starting defaults:

  • Keep most images under about 200KB, in WebP or AVIF.
  • Limit custom fonts to two or three weights, and self-host them.
  • Lazy-load images below the fold, but never the main image at the top of the page.
  • Skip the hero carousel unless the client understands what it costs in speed and attention.

These choices feed directly into Google's Core Web Vitals, especially Largest Contentful Paint. On WordPress, your theme sets much of the performance ceiling, which we cover in how your theme impacts SEO rankings. When a finished site still feels slow, our WordPress speed optimization guide shows how to find the metric you're actually failing before you start fixing things.

6. Treat whitespace as a design element

New designers often treat whitespace as wasted space. Experienced designers give it a job: creating hierarchy, grouping related content, and giving the eye somewhere to rest.

Three rules that hold up on almost any project:

  • Group related elements and separate unrelated ones, because proximity tells people what belongs together.
  • Give sections more padding than feels necessary, then check the result on a phone.
  • Never let text touch the edge of its container.

Layouts with room to breathe are easier to scan and tend to look more credible.

7. Ask for specific feedback, not general approval

"What do you think?" is the weakest question you can ask a client. It invites answers like "can you make it pop more?" that you can't act on.

Ask questions that point at the page's job instead:

  • On this page, is it clear what we want the visitor to do?
  • Is anything here confusing or slow to understand?
  • If you had five seconds on this page, would you know what the business does?

Specific questions get specific answers, and specific answers turn into revisions you can actually make.

Building your own site first

If you're building your own portfolio or blog, you're also the developer, writer, SEO person, and marketer. Our guide to choosing a WordPress theme for SEO helps with the first big decision. Once you're publishing regularly, RightBlogger, which I built, has tools for the writing and SEO side.

A couple of resources worth bookmarking early: free animated icon libraries for interface polish without a subscription, and CSS anchor positioning for the day you're tired of magic-number offsets in your layouts.

Make these habits the default

None of these tips are shortcuts. They're defaults: decisions you make the same way every time so you can spend your energy on the parts of a project that are actually new. Pick one, apply it to the site you're working on now, and add the next one on your next project.