These 14 Tools Will Help You Create (Outstanding) DIY Websites

Editor’s Note: The following article on pricing strategies for digital products was penned by Robert Brandl, Founder of ToolTester Network and Leadpages Guest Blogger. Interested in writing for the Leadpages blog? Hit us with your best shot!

Creating DIY websites from scratch—the writing, the layout, the photos…it’s not an easy task! You’ll need the right tools to create a visually appealing, user-friendly, converting and effective site.

When you decided to build your site, you checked out the competition, right? You likely found that many companies are finding new and unique ways to market their concepts, products or services online. Those companies that are doing it well have everything nailed down: from a well-maintained blog to search engine optimization to stunning landing pages and seamless navigation.

In other words, their customers are fully engaged on their site because they have unique and interesting content – or at least they should – and that’s what you want as well.

We will share with you 14 tools to make your website memorable and unique while attracting the right customers to your site.

Click here to subscribe

1. Coolors.co

One of the first things you’ll want to do when building a new site is to decide which color scheme you want to use. If you are not familiar with this expression, it basically means you need to decide which 3-5 colors will you use on your site and in other promotional activities.

Deciding which colors will represent your brand is not an easy choice. Luckily for you, with tools like Coolors.co, you can quickly burn through a lot of interesting color combinations that work well together until you find “the one”.

What we like about this tool is that you can lock and adjust colors on the fly, adjust selection for a variety of color blindness conditions, export and save your favorite schemes, as well as import and pick colors from a picture.  

Having good taste is a must, but you need to keep your personal preferences in check. You need to take into account who your target audience is and what your website is about. For example, you don’t want to have a bunch of dark colors for a “child daycare” website or pink/lime/yellow scheme for your “death metal band” website.

2. Logojoy

Every business needs a logo. If you don’t already have a clear picture of how your logo should look like, you can use Logojoy to create one.

Before you get some suggestions, you need to fill out some information:

  1. Brand name
  2. Industry
  3. Slogan (optional)
  4. Choose 5 logo examples you like
  5. Choose color styles you like
  6. Choose color schemes (optional)
  7. Add some symbols you want to use (optional)

After that, you get a bunch of suggestions and an option to redo your choices (change slogan, icons, etc.)

Even if you don’t get the perfect result, you can use this as an inspiration or as a starting point you can forward to a chosen designer.

3. Unsplash

As far as free stock photo sites go, Unsplash is one of our favorites. If you are looking for a background picture for your landing page or simply an appropriate photo to serve as a featured image for your new post, this is a great place to start.

You can explore different collections, filter pictures by a bunch of different categories, or just type in a keyword and see what pops up.

Image credit: Unsplash

The beauty of free high-resolution stock photo sites is that you can use the pictures for free for both personal and commercial purposes. While this is a great way to avoid potential copyright issues, it comes with one small problem – image size.

It is important that your site looks good, but it is as important that it loads quickly enough. There are plenty of free tools that can help you with that. However, if your website is already running and you want to quickly check and optimize (if needed) pages that are already live, here is another neat free image compression tool that can help you do just that.

4. Adobe Spark

For a long time now, Adobe is one of the leading brands when it comes to providing solutions for creating stunning and engaging visuals.  

From the long list of their digital solutions, we decided to include Adobe Spark to this list. Adobe Spark is actually 3 tools in one:

  1. Spark Post (create graphics by picking a photo, adding text, and apply some design filters)
  2. Spark Page (use words and images to quickly create a web page that is automatically optimized for all devices)
  3. Spark Video (use photos, video clips, icons, soundtrack, cinematic motion, and/or your own voice to create engaging video stories)

Here’s a short video that covers all three bases (the video is from 2016 and through the interface might have changed slightly, the concept is still the same):

5. Grammarly

If there is a tool on this list you already heard about, it is probably this one. We know that spelling mistakes on your site can cost you big: reputation-wise and even financially. Grammarly is a free Chrome extension which proofreads any text you write on your website or blog.

It corrects for punctuation, style, and grammar, and gives you context-specific suggestions. The great thing is that Grammarly can also be used almost anywhere from inside Microsoft Office tools and Gmail to Facebook and other social media sites. Recently, they have also added support for Google Docs so you can use it to proofread drafts of the pieces that you create as a part of your content plan.

6. Leadpages

Are you trying to figure out a way of collecting your visitors’ emails? Well, look no further.

Leadpages enables you to create beautiful pop-up boxes and opt-in forms to collect contact info from your prospects and pull them into your marketing funnel. You can create a fully customizable contact form to collect the details you want.

Let’s go over it in a bit more detail. The two main ways to build your email lists by using landing pages and pop-ups. The other way is to create opt-in forms. The only issue with opt-in forms is that you need to have design and coding skills to create an effective opt-in form.

You don’t need design skills with Leadpages since they have high converting templates that you can start off with. They have an editor that helps you make changes to the template and add your branding.

You can add pop up opt-ins on your website at certain times or after a certain number of page views.

WordPress users can download the Leadpages plugin to access all the landing pages and Leadboxes they made on their account.

7. Disqus

Disqus offers a great way to “socialize” your website. It is a free WordPress plugin that can actually be used on other content management systems and platforms.

This is how it essentially works: Users can post comments to your blog posts by logging in with social media platforms. Your readers can also upvote or downvote comments as well as favorite and subscribe to certain threads.

Image credit: Disqus

Your web visitors only need to create one account in order to be able to comment on all sites that have Disqus implemented (even though you can allow “guests” to post comments if you want). Pretty convenient, right?

Another benefit of Disqus is that you can store comments off-site in order to improve your site performance. It also has an anti-spam filter that is powered by Akismet – which is often a reason enough to use it (as some marketers still think that leaving “Great post. [insert random URL]” comments is a legitimate way to build their backlink profile).

8. Canva

If you currently have a boring website design but don’t have the technical know-how, you might want to check out Canva Button. It allows you to create designs on your website through a simple drag-and-drop function. For example, you can add your own site elements like headers and banner ads just by – dragging and dropping.

To make it that much easier for website owners, Canva partnered with websites like GoDaddy, Agora Pulse, Tailwind, Post Planner and TabSite so users of those platforms can implement a Canva Button instantly. However, it can work on any site where you can paste the Canva button code.

Image credit: Canva

Why is that super convenient?

Many platforms regularly prompt you to upload your content. However, when you have Canva Button enabled, you can click on any blank area of your site and Canva Button will take over and offer different designs.  

It also doesn’t hurt that they have millions of photos, graphics and fonts in their library for you to choose from. You simply drag and drop where you want objects and text to go. When you have something you’re proud of, it is time to use that “Publish” button.

9. GTmetrix

Think With Google reports that 53 percent of website visitors quickly exit a page if it takes less than three seconds for the page to load.

Simply put: you lose potential customers or clients if your website speed is slow, and your conversions will decrease.

Enter GTmetrix (which is free). It’s a site analysis tool that shows you common performance problems on your site. All you need to do is type in or paste your website URL and click the “Analyze” button.

It will then analyze your site and show you typical performance problems and specific data like your browser and location; the page loading speed, total page weight, and your website’s performance metrics.

All recommendations are sorted by importance and will tell you exactly what needs to be optimized. That being said, some of them are easier to understand than others for the average user.

Interesting fact: Leadpages leads the pack when it comes to landing page load speeds.

10. Screenfly

More than a year has passed since Google introduced mobile-first indexing. Combine that with the fact that the share of mobile traffic worldwide in 2018 was 52.2 percent, and it should be obvious why it is so important to have a properly optimized website. With such a large percentage of users visiting your site on their mobile phones, if it doesn’t display well on mobile devices, they are likely going to get annoyed and you’ll have a hard time converting.

What Screenfly does is analyze your pages to ensure that they look good across all devices. It’s a free tool that enables you to quickly check how your site displays on different devices.

Their user interface is pretty simple as there are no unnecessary buttons and tools. You just enter your website URL and see how your website looks on different devices.

They also have a ruler that shows you the window width and height which makes it easier to see if you need to work on adaptability. For example, if Screenfly shows you that your buttons aren’t in the right place, that the content doesn’t fit on the screen, or that the text too big/small, you need to work on adaptability.

11. SEO Site Checkup

SEO Site Checkup is a free tool that analyzes your site for SEO problems in five minutes or less!

It is straightforward and easy to use: simply paste your domain URL and you’ll have a full analysis of your site in a minute or two. As a bonus, it’ll also check your competitors’ sites for comparison.

Other notable features include:

  • Checking how your site looks like on mobile.
  • Checking site speed, performance, and security.
  • A graph that shows the number of mistakes and problems with a list of recommendations, which can be downloaded as a report. Their recommendations are detailed so you can even see where in HTML you need to add more code or an alt attribute.

12. Optimizely

When you have your site up and running, it is always a good idea to do some A/B testing to improve your overall conversion rates. Optimizely is an A/B testing tool that enables you to create 2 or more different versions of your site and then track how users interact with them – and which one performs better.

It tests everything on your site: images, headlines, CTAs, graphics and much more.

After you’ve started the A/B tests, Optimizely will collect data on how the new elements you put together are performing.

It has a visual editor which allows you to make different kinds of changes by clicking instead of coding.

You can use the personalization feature to provide specific and novel experiences to a certain set of audiences. For example, you can change the offer on your homepage based on the region or user behavior of your audience.

In terms of integrations, you can connect it with analytics tools like Google Analytics, Adobe Analytics, etc.

We have to mention that Optimizely requires some technical know-how in order to use the tool effectively. It is geared towards bigger businesses so it may be something you want to explore later as your business and site grow.

13. Mouseflow

Mouseflow is a heatmap tool that enables you to visualize how users are using your site. It provides an overlay on top on your pages to show areas where the activity is low or high.

The great thing about Mouseflow, like other heatmap tools, is that you get visual analytics of the areas that users click, scroll and look at. That information is particularly useful if you want to understand usability issues on your website; so that you can optimize it for better user experience and conversions.

Mouseflow also offers recordings of user activity online so you can look at exactly how they interact with your website.

Image credit: Mouseflow

Furthermore, Mouseflow has detailed analytics which enables you to track funnels and see why users are not filling out your leads forms.

14. Google Analytics

The last tool on this list is the one every website owner should know how to use. Why, you ask? Well, if you want to make an outstanding website that is adjusted to your target audience, you need to have reliable data to track how it performs.

Google Analytics (or GA for short) provides a plethora of useful data like:

  • traffic information (overall traffic, traffic sources, session duration, bounce rate, best and worst performing pages…)
  • audience information (number of new and returning users, demographics and interests)
  • conversion information (i.e. the number of people that activated a free trial or sent a message through a contact form and how they found your site/landing page)

The above bullet point list only scratched the surface of the data you can pull from GA. It will take some time until you learn how to fully leverage its capabilities so this is something you want to get started with as soon as your website is up and running.

When it is all said and done…

…there are many tools out there to make your life as a website owner much easier. The ones we’ve covered in this article are an excellent pack of tools to start out with!

Click here to subscribe

Meet the author

Robert Brandl
Founder
ToolTester Network

Robert’s passion has always been web tools that make your life easier. That’s why he founded the WebsiteToolTester, where you can find reviews and tutorials for the world’s best website builders and e-commerce platforms.