top of page

Custom Web Platform Without Code

hand drawn words that say make your web work

Part two of our web platform series discusses creating a custom look for a professional site without knowing any code.


After weighing your options in part one of this series and choosing a platform like Wix or Squarespace, how do you take their templates and make something look custom? There are many ways to do this, and no one way is right or wrong. This is how we do it.

graphic of shapes in the HHC brand colors showing our 5 easy steps

1. CHOOSE A TEMPLATE

Take your time and choose a template based on the functions you may use. Layouts are easier to change. Do you need a blog? Are you posting events? Is there a shop component to your business? Take these into consideration. Narrow it down to a couple that meet your scope of function, and then pick the one that appeals the most to you. Keep in mind that at this stage, you are picking structure. Fonts, colors, and photos are part of the site’s styling, which will come later. Try not to get hung up on that while choosing a template.


2. INPUT CONTENT

If you are switching from another platform, you may already have content. If you don’t, you will need to write some or hire someone to write it. Writing for a website should consider SEO (Search Engine Optimization) best practices. Either way now is an excellent time to review your website template pages and decide if you need additional pages.

You may also want to delete some. Then, with a word doc open, make an outline for your site and write content for the areas that need filling.


3. APPLY BRANDING

This is where the magic happens. Branding applied thoughtfully not only helps your business or persona stand out, but it can take a blocky template and turn it into something that feels intentional custom. Establishing a brand is a process that requires in-depth discussion about your goals and the heart of what makes your business distinct. It is much more than just how it looks (See our brand breakdown). Each piece builds on itself. While it is advised to go through this process with a professional who can guide you and create something truly memorable if you are making the cart while you are driving, you may need a temporary solution that steps in the right direction. Start by asking yourself what your short-term and long-term goal for the business is. What is your short-term and long-term website plan (in other words, how will you use it to achieve your goals)? And finally, three words that describe the vibe of your brand–What do you want people to feel when they see your work, products, and website? Then begin styling based on your answers to the brand worksheet above to inform your decisions. Choose two to three colors you can stick with for your designs. Choose a headline and a body font in the styling sheet of the website, or use what is preloaded in your template. Note the fonts you use on the website so you can use them later on other promotional items. After applying colors and fonts to your style sheet in the web platform of your choice, upload your logo, and then consult your outline to see how many photos you need and where they go. Check out stock sites if photoshoots are not within budget. There are many free and affordable royalty-free sites out there to choose from. Friendly advice on photos, try to avoid cheesy office photos. Your brand deserves better. Finally, try applying one or two of these techniques to disrupt the boxy, templated feel of typical all-in-one platforms.


Introduce patterns within some of the sections

example of having a brand pattern behind your web pages

Use icons that fit your brand. These might be photos or illustrations. They could even be typographical. The options are endless.


Consider applying a treatment to the photos. Depending on your skill set with design programs like Photoshop, this could take form in many ways, but a couple of examples are a filter or a cutout that takes advantage of whitespace to alter the square shape.


example of adding filters to your images



example of adding treatment to photos on your site

4. ADD INTEGRATION

Add in email list integrations and other connections with external platforms that help you run your business.


5. SET UP SEO

Make sure you have included alt tags on images. Use the SEO areas in each page's settings to ensure all areas are filled out. If there is a spot for a social image, use one of your chosen brand photos so that if people share your site, there will be an image to go with it. Finally, connect your site with the Google Console. This is a great article that talks about how to do this if you are unfamiliar. Connecting it is step one and the only one you need to do. The rest is optional; depending on how in-depth you want o go you’re your SEO according to your goals. This is optional but helps your website index faster.


Web platforms are tools, and we can make them work hard for us if we understand how to manipulate them to our advantage. Get building! And if you need help, we would love to bring your vision to life. Email studio@harthousecreative.com or DM us @harthousecreative on Instagram.


Author/Editor: Jenn Hart


 

Popular Related Articles

Subscribe to The Squeeze on our little piece of the internet to get design promotions, resources, stories about other creatives, and inspiration for your eyeballs and brainstorms.





 

Keep creating Hartists! Follow @harthousecreative on Instagram and Linkedin.


Recent Posts

See All

Hart House Creative, its employees, partners, The Squeeze, and guest writers make no guarantees for results. Methods and marketing suggestions are based on prior knowledge and with the intent to inspire business owners and other creatives. Every client is different with different goals. None will be held liable for any negative results achieved from implementing suggestions from our website.

bottom of page