15 Actionable Tips That'll Take Your DIY Site To Designer, Fast!

Growing up I would see these ads about becoming a model, or learning how to look like one. I’m not exactly sure what kind of lessons were shared, but I couldn’t help thinking about this idea when it came to websites.

It’s easy to feel some envy towards other people’s sites, and they can be a huge inspiration when thinking of our own. The great thing is that there are ways we can easily make our own sites look like a designer did them, even if they are DIY.

In this post, I will share some tips you can easily act on today to give your website that designer look, even if you aren’t one yourself.


Keep it consistent


The secret ingredient to a designer looking site is consistency. Having a consistent look and feel unifies all the visuals on your website.

  • Fonts - a good rule to follow here is to choose 2 - 3 fonts for your website. Decide on where you want each font to appear. For example, select 2 - 3 fonts that vibe with your brand as well as compliment your industry. Next, decide where each font will appear. One font can be used strictly for H1 headings and another for H2, H3, Body, and so on.

  • Colors - Without color a website can seem really bland and boring. There’s a trick to using color since too much of it can take your site from feeling warm and friendly to flashy and disruptive.

    Using blocks of color throughout your site can achieve a really nice look, especially when broken up with some white space. Like fonts, you’ll want to choose a few colors to use on your site.

    A good source is, Coolors. There you can play around and test out up to 5 colors at once. Your palette can even be saved and downloaded so you can have it for reference.

  • Links - With Squarespace, links added to your site can be edited, so instead of having a bunch of long links on your site that do not correspond, try and tidy them up with a consistent naming style.

  • Copy - Website copy refers to text/words on your site. To get that designer look, maintain one single tone of voice on your site. Consider your site visitor - who are they and what speaks to them? Once you determine who your site needs to appeal to, establish and maintain the tone on every page of your site.

    Need to stray a little from your usual tone? Try a cover page instead. Sometimes referred to as a landing page or a one-page website, these web pages can be used when you want to share something that has a different look and feel from your usual offering.

    How to Create a Cover Page in Squarespace

    20 Business-Building Uses for Squarespace Cover Pages

  • Images - “A picture says a 1000 words,” as the saying goes. When it comes to your website, you want to ensure the images are speaking the right words.

    When selecting images, ask yourself: Are the images placed on your site harmonious? Do they support your brand? Do they make sense for your brand? Select images that help tell the story of your brand and compliment your website.

  • Blog posts - Posting at least 1x per month on your blog will keep your site up to date, especially in the eyes of search engine giant, Google.

    Try and aim to post at least 1 - 2 times per month, and if this is not possible, consider placing your blog in a less prominent place, like the footer of your site, or hide it from view.

  • Social media - If your website has links to your social media sites, keeping up with your posting will be important. If you’re not as active on your social channels, consider placing them in the footer of your site or temporarily removing them until a regular posting schedule is an option for you.


Designer tips


There are a few things designers always keep in mind when creating a site. Below I’m filling you in on some of the things a designer considers in order to deliver a timeless, gorgeous site that drives results.

  • White space - All the spaces of your site that does not have color, images, or any other visual elements is referred to as white space. White space is a very strong ally, and with the right balance, color and white space can play very nicely together.

    Initially, white space can seem like it is working against the design of a website. White space allows site viewers to focus and hone in on the parts of your site that you actually want to highlight.

  • Smaller fonts - Smaller fonts help to give a site a timeless look. Larger fonts tends to make a site look dated. There may be concern of site visitors being able to read your site so, you don’t want to go too small here. Single digit pixels (px) is probably too small so, try to avoid it if you can.

  • Less is more - There can be an urge to have #allthethings on our websites. If we have lots of accomplishments and achievements, it can feel all the more pressing to put all the deets up on our site. Though the intentions are good, putting too much content on a site can make it feel confusing and overwhelming.

    The goals we’re trying to achieve might become muddled so, when it comes to web design, less is more. It’s okay to be discerning about what makes it onto the web.

  • High res images - This one is pretty important. Having high res images will make all the difference for your website. If you have yet to hire a photographer and set up a branded photo shoot session, fear not! There are some great stock photography sites out there that deliver on high res photography.

    A quick google search for stock photography will bring up plenty of results. To narrow down results, consider adding adjectives into your search like, feminine, girl boss, or professional.

  • Flat icons and logos - You may recall seeing logos and icons online that were chunky, raised, or had some depth to them. The current style is to have icons that are flat like fonts. Tilting logs to the side or giving them a 3-d look will date your site.


Squarespace settings


Squarespace has some overlooked settings available to their users. Utilizing them will not only customize your site but set it apart from DIY.

  • Favicon/Browser Icon - A Favicon or Browser Icon is a small branded image that appears in the tab of a website page. I love these because it is a such a strong place to brand oneself and standout. Be sure to take full advantage of the opportunity and upload your own favicon.

    For further details, check out this posts!

    How to Add a Favicon to Your Site

  • Squarespace badge - Every Squarespace site comes with a statement at the bottom of the site that reads, “Powered by Squarespace.” This one is a DIY dead giveaway, and it is really easy to switch off.

    For more on this and other settings that can take your site to a whole other level, check out this post!

    14 Not to Be Missed Squarespace Settings

  • Professional email - Through Squarespace it is possible to get a professional, branded email through Google for $5 per month. Displaying a contact email address on your site with your own domain will make all the difference between the site of a hobbyist and a professional. Hook yourself up with one of these, asap!

    This post goes into further detail on the reasons and benefits of a professional email address. Check it out!

    Why a Professional Email Address is Essential


Conclusion


With just a few tweaks and a little organization, your site can not only look designer but it will also stand out from the competition. A well designed website has a very far reach, so use the tools available to you to make an impactful first impression online.

Select high res images that help drive and support your brand’s story. Search for stock photography site that compliment your brand - some of the sites out there offer free photos. Use 2-3 fonts and color sparingly.

White space is a very strong ally in web design. It helps focus the attention on what matters and gives your site visitors a chance to access the information on your site. It’s okay to be discerning about your content.


Related Posts