Mar 16, 2016
How to define your brand the right way Part 3
In Part 1 of this branding article series, I defined what a brand is and why knowing who your ideal client is plays a crucial role in your branding.
In Part 2, I explained why fonts, colors, imagery, and web content need to align with your brand’s personality to influence how your target audience feels about your brand.
In the final article in this series, I use as an example an actual wedding and event planning website. By making a few minor tweaks, I’ll show how even small changes can affect how we perceive the brand.
Wedding & events planning
Let’s look at a wedding and event planning website home page (I’ve changed the business name, by the way).
Disclaimer: This business has never approached me about a website redesign and have no affiliation with the business. I came across this site at random and thought that I could make some improvements to it. Hence, I’m using it as an example for this article series.
Because I’m not familiar with this business, I don’t know who the ideal client is. However, based on their web content and images, I think this business targets professionals from their late 20’s or early 30’s to mid or even late 40’s.
Because wedding planning is more a luxury than a necessity, clients likely have at least an average to above average wedding budget and perhaps not much time or experience to plan a wedding by themselves. Likely, for these clients, making their events memorable is important to them.
On its service page, the brand describes itself as having a “boutique-style,” which would imply a certain level of personal service as well as style. Presumably, clients can expect to pay accordingly for the attention to detail as well as the personal attention they receive.
While the business is both wedding and events planning, the majority of the work appears to be wedding planning, judging by the site’s photo gallery. My design decisions are based on these assumptions about the brand and its audience.
The gray and pink used throughout the site gives the brand a feminine appeal. However, while the pink is soft, the gray looks dark and maybe a little too somber. The darker text stands out against the gray background, but the navigation bar gets a bit lost.
It could be that the business chose to use both pink and gray to appeal to both men and women. But when it comes to wedding planning, I’m willing to bet there are more female than male clients.
I replaced both the pink and gray with white for a more timeless and clean look. By eliminating the background colors, the text becomes immediately more noticeable, and your eye is drawn more easily to the elements on the page (photos and text).
Also, with an all white background, there appears to be more space. There’s a lightness about the page. With the gray on pink background, the content felt confined.
When you compare the original home page to this last version of the same page, you get a different feel for the brand. While it still has a feminine appeal to it, the brand now exhibits more sophistication.
The next change to make is to the fonts. The page title, “Wedding and Events Planning,” uses Libre Baskerville, a serif font. If you recall from the previous article, serif fonts generally convey feelings of stability and tradition.
If this wedding and events planner specializes in more traditional weddings, then Libre Baskerville is a good choice of fonts. If the planner wanted to changed things up, she could replace the all caps “Wedding and Events Planning” title with an all lower case version. Doing so would give the text a modern twist on an otherwise traditional font.
Both the navigation links at the top of the page and the line “Uniquely Personalized Event Planning and Design” use Futura PT, a sans serif font, one with a clean, modern feel to it.
In keeping with our feel of sophistication, let’s see what this home page looks like with a script font. In the following screenshot, I replaced both Libre Baskerville and Futura PT (except in the navigation links) with Alex Brush, a free font available for download from FontSquirrel.
Alex Brush is casual and friendly, but also elegant. This font gives the home page a more modern feel than the Libre Baskerville and is a bit more feminine.
In this next screenshot, I replaced Alex Brush with Porcelain, a free script font from Misprinted Type available for download from FontSquirrel.com. If the wedding planner wanted an even more formal and elegant feel, then Porcelain may be a good choice of fonts with letter forms reminiscent of pointed pen calligraphy.
While Porcelain is a beautiful font, it’s not the easiest font to read, so use it for page titles and large headings only. It may be difficult to read long passages of text with Porcelain, and it’s not a good choice for body text.
In addition to the font change, I also changed the navigation link color from pink to gray, and I lightened the title and text color. The shades of gray on the white background enhance the sense of luxury and sophistication.
Content and images
The next step for this brand may be to add more text to the top portion of the home page. Telling your target audience a little about yourself on the home page is important. Web visitors want to know right away if they are in the right place.
Text is also important for search. While I see many sites today with big images or multiple images and little text on the home page, those pages don’t usually rank well in search results. Over reliance on images to convey a message to your audience may be hurting your site, but that’s a topic for another article.
For this business, letting its visitors know where it’s located may be important. A bride may prefer a wedding planner either local to her or local to the place in which she plans to marry.
Because the home page image occupies a significant amount of real estate at the top of the page, a designer could incorporate text into it. That ensures that there is a content above the fold for both search engines and visitors.
Another thing for the business to consider is making the call to action prominent. While there is a contact link in the navigation (Say Hello), it doesn’t stand out among the other links. Another contact link is available at the bottom of the page, but not every visitor will scroll to the bottom of the home page.
In the new home page image below, I brightened the image, overlaid the text on it, added a little more description, and included a call to action that looks like a button.
For the final home page, I opted for Alex Brush because the font is less formal, but more legible than Porcelain, but chic and more friendly than Libre Baskerville. I also changed the text color to a lighter shade of gray, but left the pink for the navigation links.
You may be a business owner with a site that functions the way you’d like, including a responsive design, but that doesn’t truly represent your brand to your target audience.
I hope that this series shows that, in some cases, what your site needs may not be a complete rewriting of the underlying code, but rather a facelift. Aligning the elements of your website—fonts, colors, images, and text—to your brand is important.
While this article series is over, I may return to this topic from time to time with another website facelift example.