Cynthia Oswald Logo
CO Logo
  • Home
  • Portfolio
  • Agency Services
  • Shop
  • Learn
  • About
  • Blog
  • Contact
  • Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer
Cynthia Oswald

Cynthia Oswald

Surface Design, Fine Art + Branding for Creatives

  • Home
  • Portfolio
    • Surface Design
    • Botanical Art
    • Landscapes
  • Agency Services
    • Branding & Logo Design
    • Website Design & Development
    • Website Audit
  • Shop
  • Learn
  • About
  • Blog
  • Contact

website checklist series

Consistent Spacing on Your Website & Why It’s Important

Website success tips

Key areas to have consistent spacing on your website

Set up rules for spacing throughout your site, consider creating rules for the following:

  1. Space around images
  2. Space below headers
  3. Space between paragraphs
  4. Space within page sections

For the final tip of the top 10 tips to make your website a success I’m sharing about creating consistent spacing. It’s really a pretty simple concept, but it’s something that’s easy to overlook. When you’re setting up your standards for your fonts, I recommend creating some rules around the spacing as well. 

You want to consider the space around your images and make sure that that spacing is always consistent. For example, you might have a few different ways that your images are showing up (2-column, full-width, etc.). Create rules for each instance so you can establish consistency throughout the site.

Also consider space below and above your headings, making sure that it’s always the same depending on the heading that you’re using, and then also have consistent spacing between paragraphs and in between the different sections within your page. I have previously talked about page breaks, or the page fold, making sure that the space in that page section is consistent throughout so your white spaces throughout is looking cohesive. The whole purpose of this is to create brand cohesion and create some rules around the spacing in your brand so that it feels put together it elevates the way it comes across. 

Want to see the full list of website success tips? Download my FREE Website Checklist!

Ways to create visual hierarchy on your website

website success tips

Visual hierarchy and how to use it effectively on your website

Today’s tip is about creating a visual hierarchy on your website. I want you to be thinking about what happens when you land on your website homepage or any other corresponding page secondary page. How is it that your eye moves through the page? Sometimes it’s really hard to look at that when you’re the one building your own site. I always recommend starting with wireframes for this purpose. If you’re struggling to create a visual hierarchy on your own site, I suggest taking a look at websites that you like to frequent and taking note of how they create visual hierarchy. How are they creating balance and how are you as the viewer moving through the page naturally? 

Here are a few things you can do to create this on your own site:

  1. You can use images and color blocking as a way to create a visual hierarchy by breaking the page into sections. It allows your eye to focus on different locations. 
  2. You can also utilize scale in your imagery and copy. Creating standard looks for headlines, subheads, and body copy is just going to help people understand where they should look first, second, and third, and finally where they should land. 
  3. Finally be thinking about that call to action and how does that fit into the visual hierarchy? This is important because your call to action is what you want people to gravitate toward on your website. 

A visual hierarchy works quickly and subconsciously to guide users through your content. We just look at a page or a composition and we’re naturally moving through the information/imagery. Again, try to take a look at some sites that you enjoy visiting and you’ll start to see what’s working and how they’re doing it. Then you can take some ideas you pulled from looking at those other sites and begin implementing them into your own brand visuals. 

Want to know more website success tips? Download my FREE Website Checklist!

Top 3 Things to Think About Regarding Your Website Page Fold

Website Success Tips

Consideration of the page fold

What is a page fold? For physical projects consider a brochure, a natural break occurs when you open up a panel. It’s when you literally turn the page — creating those very apparent, natural breaks in the text and visuals. In the digital world, a page fold is considered anything you can see within the screen on the device you are using to view the web page, when you find yourself needing to scroll down to see more, you have found the page fold. 

On a website, there are a few things that you want to consider before a visitor starts to scroll down your web page. Below are my top 3 things to think about when viewing your website with the consideration of the page fold in mind.

1. Understand what is showing up on the screen when someone lands on our site from all devices

The first thing to consider is: what does the web visitor see when landing on your webpage? Do they see everything you are wanting them to see or are they not seeing enough? Make sure to consider the devices that someone could be using to view your website (phone, laptop, tablet, desktop). Every device has a different page fold, so you want to make sure to use the viewfinder to see what the screen view looks like on each device. Usually, your website should be responsive to different devices, but it never hurts to double-check that everything translates properly.

2. Including a CTA 

At the top of the page (and this goes for all web pages, not just your home page), you want to make sure that you always have a call to action above the fold. Consider having a call-out section above the fold that includes a header, a little bit of copy that articulates what they can expect to learn or find on this page, and a quick button so they can easily click into the goal location. Some web visitors are coming to your website to take immediate action, so you want to make sure that the CTA is up-front and center so they don’t have to scroll all the way down to the bottom of the webpage to find the link they are looking for.

3. Create Natural Breaks

In the case that a visitor decides not to immediately click on the CTA at the top of the webpage, and begins to scroll, you will want to make sure that you have created natural breaks on the page. Why is this important? You don’t want it to feel like an endless scroll with no hierarchy.  It’s not visually pleasing and can cause your visitor to lose interest. Try these design elements to help create natural feeling page breaks:

  • color blocking
  • images
  • lines
  • whitespace

These options can create mental indicators to the reader which content belongs together and when the next thought has begun. Creating those natural breaks in the page allows the end-user to have a pleasing overall experience when viewing your website. It’s a way to create breathing room online versus the physical world. 

Want to know more website success tips? Download my FREE Website Checklist!

Primary Sidebar

Cynthia Oswald Portrait of an artist

About Cynthia

In addition to creating surface design and fine art, I own and manage a boutique branding agency just outside of Phoenixville, Pennsylvania. When I’m not working you can find me chasing my little ones or dogs around our small home, enjoying a fire with my husband, reading, or riding my bike on the river trail near our home.

What are you interested in hearing about?
Thanks! Keep an eye on your inbox for updates.

Recent Posts

  • Featured on CanvasRebel: A Creative Journey Unveiled
  • Choosing the Best Website Platform for You
  • The “Wild Garden” Collection
  • An Interview with Painter, Printmaker & Mixed Media Artist, Sally Richards | Chester County Studio Tour 2023
  • An Interview with Mixed Media Artist, Emily Mullet | Chester County Studio Tour 2023
  • An Interview with Artist & Photographer, Tina Crespo | Chester County Studio Tour 2023
  • Charting Your Creative Path: Exploring Long-Term Career Goals with Bonnie Christine
  • Behind the Scenes of the Vast Views Collection
  • Curate Your Brand In Really Meaningful Ways
  • 3 Simple Steps to Bring Awareness to Your Preferences & Brand Cohesion

Footer

CO Logo

Click here to email me
Phoenixville, PA

News + Resources

Thanks! Keep an eye on your inbox for updates.

Let’s Connect

  • Facebook
  • Instagram
  • LinkedIn
  • Pinterest

Copyright © 2023 Cynthia Oswald | Website Credits | Privacy Policy | Terms