All website designers do things differently. Some offer higher-priced, comprehensive website build packages that include figuring out your branding with you or partner with a graphic/brand designer. Others need you to bring more brand and design details to the table so they can plug them in for you. Some logo and brand designers also offer website design so you can get it all done with one person or agency.
If you’re on a budget or shorter timeline, coming to the table with your brand more fully lined out can go a long way in streamlining a project.
What Brand Details You Need to Have Before Building Your Website
You’ll definitely need a logo for your business. Most reputable logo designers will give you several file formats. You’ll need a SVG or AI file — a PNG file will work in a bind. Your logo should have a transparent background, and ideally you’ve received it in a variety of colors. You might need a full white, full dark, or one-color version of your logo for your website. You’ll also need a smaller icon version of your logo (or a logo mark) to use as the browser icon for your website. Simple is best for favicons.
Whether you work with a brand designer or on your own, you’ll need some sense of colors and fonts you might want to use. Many website designers will help you pick out fonts and colors, but this work often comes with a higher price tag. If possible, work with your logo designer or a proper brand designer to create a full set of brand guidelines that include fonts and a color palette, and make sure this designer knows the brand guidelines need to easily translate to your website.
If you’re coming up with colors and fonts on your own, start keeping an eye on other websites you use in your daily life. See what colors and font styles you like, and save screenshots or links of them. I love exploring fonts on Typewolf or Google Fonts. I also love the Coolors color palette generator. If you want to dive in to color psychology, this article is fun to read through.
It’s also helpful to know of any colors or fonts you DON’T want to use. If you know you want a serif font rather than a sans serif font, that’s helpful to share. If you prefer darker websites than lighter ones, that’s also helpful.
Your colors should go well with your logo so it all looks cohesive, so I always recommend people start with the color(s) used in their logo. Sometimes these colors translate well to website use, but sometimes you’ll need to pick slightly different variations or another complementary color.
The last thing you need to have is some sense of shape/line style you’d like to use. Some websites use harsh, straight lines to separate sections. Other websites use more curved or rounded shapes/lines between sections, for buttons, to crop images, etc. Some websites layer elements on top of each other. Pay attention to this on websites in your daily life and think through what feels right for your business/brand.
What Brand Details Are Ideal to Have Before Building Your Website
Often you can get away with just having the above details figured out before working with a website designer. Feel free to ask website designers you’re talking to how much branding they can help you with and how it will affect the cost of the project. If you’re really enjoying building out your brand design, or are working with a great brand designer, these things will give you a better foundation for building your website on your own or with a professional website designer.
A brand color palette and a plan for how to use these colors is super helpful for any website design project. What light or dark colors will you use for your section backgrounds? Will you use a more bold color as a background with light text over it? Does your color palette include plain white/plain black, or will you use a dark blue, dark gray, or other dark neutral for your main text color? What color should your headings be? What color should your main call-to-action buttons be? And do these colors work together in a way that has sufficient contrast for your website visitors?
You’ll probably want to use one or more colors from your logo, but choose neutral colors too. Here’s a good article if you want to take a deeper dive in creating a website-focused color palette. In general, fewer colors is better than more, and this tends to lead to a more professional-looking website.
Choose a color or two from your logo, maybe a lighter or darker variation on one of these colors, then a white or off-white neutral and black or dark gray neutral, and you should be able to do plenty with those colors. If you’re building your own website, you can play around with colors on your staging or trial site and get a better sense of how each color will look in action.
Fonts can be handled like your color palette — it’s great to figure out font styling or a font pairing before you start building your website, but you can also play around with fonts and font pairings on your staging or trial site to see what looks good in the website context overall. If you’re building on Squarespace, you can check out their Font Packs for ideas and to get a sense of how serif and sans serif fonts look together.
Your website designer might include font selection as part of their package, so always ask, especially if perusing fonts doesn’t sound like a fun time.
In general, you’ll want a heading font that’s not only a larger font size but a heavier weight (more bold) and more eye-catching than your regular paragraph font (aka body font) so people can easily scan your website pages. If you want to use just one font (typically best for page load times), you can use a heavier weight of your paragraph/body font. Otherwise you’ll need one font for your headings and another for your paragraph text.
You’ll also be set up well if you consider other graphic elements like icons, background illustrations, accent illustrations, etc. While you can often use built-in icons or stock icons, having a set of custom-made icons from your logo designer can make your brand and website feel far more professional. Envato Elements and Canva are good places to look for pre-made icons and illustrations if it’s not in your budget to have a graphic designer/brand designer create custom icons for you.
Beyond icons, you might want a background illustration or pattern that feels aligned with your logo style, and you might want to use illustrations instead of photos to break up the text on your website.
The last thing to consider or gather before you start your website build: on-brand photos. You’ll probably need photos somewhere on your website, whether they’re used as section backgrounds, page hero sections or backgrounds, to complement your copywriting, or on your About page or other interior pages. If budget allows, a brand photoshoot is a great call.
A lot of folks want to get their website up and worry about photoshoots later, which can be fine at first — stock photos are a decent option. Here are my go-to websites for free stock photos.
Even if you’re using stock photos, consider what type of photos/editing style feel aligned with your brand. Are you going with a lighter, more boho aesthetic? Or a darker, more serious aesthetic that would look best with darker, high-contrast images? Do close-up detail shots or wide angle landscape shots better convey the feeling of your business?
Other Things to Consider When Working On Branding
I often see brand designers who aren’t familiar with website design and website accessibility come up with color palettes that don’t have adequate contrast to be used on your website. Your website designer can guide you in finding variations of those colors, and often that works fine, but I recommend asking a prospective brand designer if they consider website accessibility and adequate contrast when creating a color palette. Let them know this is important to you.
I also see some really fun fonts used on websites that aren’t readable. If certain letters or sizes of the fonts you chose aren’t easy for people to read — especially on a mobile phone — this is going to turn people away. Color contrast plays into readability, but font style, size, weight, etc. do too. When in doubt, ask a friend what they think, or better yet ask an older friend or family member or someone with vision issues if they’re able to easily read the fonts you chose.
Lastly, keep an open mind, especially if you’re doing your own brand design initially. What feels good when you’re starting out might not feel good once your business evolves, your ideal client changes, or your website content/structure changes. Don’t be afraid to go back to the drawing board with your ideal client in mind to choose new fonts, colors, imagery, illustrations, etc. that will resonate more with them.
If you’re looking for a great brand designer, check out my recommended partners list. I work with website design clients often on simple branding projects, but I always recommend hiring a brand designer if at all possible.
