Website Builders: A Complete Guide to WYSIWYG and Drag-and-Drop Options
Drag-and-drop WYSIWYG website builders have always been a topic of mixed opinions, and strong feelings, in the web design and development industry. While WYSIWYG editors and builders have been popular for quite some time, in recent years new options have emerged and in some cases the quality of code produced has improved. With the massive numbers of users that industry leaders like Wix have been able to amass, it’s not a wise decision for most designers and developers to simply ignore WYSIWYG website builders.
If you’re a designer or developer that focuses on larger, more costly projects it is highly unlikely that your clients will decide to build their own website with a drag-and-drop editor. However, the vast majority of freelance designers and small studios work with many clients on small projects with very tight budgets. In these situations the clients may be looking at do-it-yourself options as real alternatives to hiring a designer/developer to create the site for them.
The potential of losing clients to do-it-yourself alternatives isn’t the only way that these website builders can impact designers. Some of the options are created specifically with designers in mind, with the goal of allowing designers to be able to create websites for clients in a more efficient way that will lead to better profitability for the designer. Because the quality of these options, for example Squarespace, have improved in recent years, a growing number of designers are using these drag-and-drop builders to create websites for clients rather than coding everything from scratch. With small projects and limited budgets, these options may allow a designer to turn a profit on a project that would otherwise not be worth their time.
Additionally, other website builders exist specifically to allow designers to create their own portfolio website and show off their work. These options can be great for designers that don’t code, for students who want to show their work to help land a job, and for designers who need to get a portfolio online quickly.
In this article we’ll take a detailed look at the topic of website builders. We’ll look at 13 of the leading options, along with pros and cons of using a website builder. This is not intended to be an all-inclusive list of every website builder that is available. There are literally hundreds of options out there. In this article we’ll look at some of the most popular options, and we’ll also look at some that are created and marketed more towards designers. Of these options 3 of them work with WordPress and 2 of them are specifically for creating portfolio websites.
Leading Website Builder Options:
Wix is an incredibly popular option for creating websites, and their users have currently created more than 37 million websites. If you visit design blogs I’m sure you’ve seen their ads, so many of our readers are probably already familiar with Wix. With Wix anyone can create a free website with no coding required. They have hundreds of different templates that you can use as a starting point for a website, and they also have a drag-and-drop builder and tons of customization options that allow you to create a unique website rather than just a template that will be used by thousands of other sites. Originally Wix created Flash-based websites, but thankfully they now use HTML5.
Wix will also host the websites that you create with their service. They offer the option of creating a free website, including free hosting. For users that want to get lots of additional features and remove the ads on their free site, several different paid plans are available. Premium features like support, the use of your own domain, additional disk space, additional bandwidth, and e-commerce are available. The starting price for a premium plan is just $5.95 per month, but Wix ads are shown on sites at this pricing level. The next price level is $10.95 per month, which will remove the ads and give you higher storage and bandwidth limits. E-commerce is available at $19.90 per month. All plans include hosting, and discounted rates are available for accounts that are paid yearly instead of monthly.
With Wix you can browse the templates that are available before creating an account or signing up for anything. If you find a template that you like you can create a free account and start editing it right away.
Example websites created with Wix:
These sites are modified versions of their templates and serve as examples of what can be done on Wix.
Wix also offers users the option of hiring a designer to create their site, still using the Wix platform. So if you are a designer and you work with Wix you can apply to be listed, which may send some additional work your way.
Squarespace is a hosted content management system that gives users the ability to customize their own designs without the need to code. You can create a business website, a blog, a portfolio site, or even an e-commerce website. With Squarespace you can use the WYSIWYG editor to create responsive websites that will look great on any device.
While Squarespace is popular with end users, it’s also loved by many designers who use the platform for their own websites and for client websites. Although they do offer pre-made templates and a website builder that doesn’t require coding, Squarespace includes features like custom CSS that designers will appreciate. The option to use your own custom CSS provides more opportunities and is less limiting than some other website builders.
Squarespace includes a wealth of other features like a responsive image loader, gallery management, CDN for image hosting, social media integration, MailChimp integration, blogging and commenting, e-commerce for digital goods and physical products, search engine optimization, and more. They also offer a Developer’s Center that provides documentation for those who want greater customization options, which is especially helpful if you want to work with Squarespace for client websites.
Unlike Wix, Squarespace does not offer a limited free plan, however, a 14-day free trial is available on any of their plans. Pricing starts at $10 per month for a site with 20 pages or less. For $20 per month you can get a site with unlimited pages and several additional features. E-Commerce is available on the Business plan, which costs $30 per month. Discounts are available if you pay for a year up-front.
Example websites created with Squarespace:
With IM Creator you can start with one of their base templates, or use their drag and drop creator to start from scratch. You can also create a mobile website using IXM Creator. Nearly 3 million sites have been created using their platform.
One of the nice things about IM Creator is that their pre-made templates look much more unique and of a higher quality than some of the other options that we’ll cover in this article. As a designer you can also use their platform to create websites for your clients.
With IM Creator you can create and host a website with limited features for free. Premium plans start at $9.95 per month, with discounts available for 1, 2, and 3 year payments.
Example websites created with IM Creator:
Zoho Sites is another option. Zoho offers the ability to create a website for free with your choice of templates and with the user of their drag-and-drop customization. While Zoho does target end users rather than designers, it does also include features like custom HTML and CSS so as a designer/developer you do have the option for increased control and customization.
Users of Zoho Sites will benefit from other features like blogging, social media integration, mobile websites, custom web forms (including event registrations), and more. Unlike most of the other options covered in this article, Zoho Sites does include email.
You can get a free website with limited features through Zoho Sites. The free site will include a Zoho ad in your site’s footer, and it will not include features like web forms, payment integration, and image carousels. For $39 per year you can get all features, and you can have up to 6 sites on the same account all at one price.
Example templates available from Zoho Sites:
The templates offered by Zoho are not as attractive as those offered by Wix, Squarespace, or IM Creator, as you might expect from the lower pricing.
Weebly offers more than 100 different templates that can be used as a starting point to create a website. You can then customize all the details like fonts, sizes, and text colors. They also offer a drag-and-drop builder to create a site, and sites built with Weebly are mobile-ready.
All sites built with Weebly are also hosted by Weebly, including the free websites. Designers/developers have the option of full HTML/CSS control for greater power and customization. Weebly also includes basic e-commerce functionality with PayPal or Google Checkout integration.
With Weebly you have the option to create an ad-free website with some feature limitations for free. The other plans are only $4 per month or $8 per month.
Example templates available from Weebly:
The Weebly Design Platform also offers designers the option to create white-labeled websites for their clients.
With Webs you can create a website using their wide selection of templates and their drag-and-drop builder. You can also create mobile websites to improve usability for visitors who are using mobile phones and tablets. Webs also offers more advanced features like e-commerce, blogs and forums, and Webs Apps that allow you to add a wide range of functionalities to your site.
You can create a free website with limited features that will include ads. Or, pricing starts at $3.75 per month. Other features, including email addresses, are available with higher-priced plans.
Example websites built with Webs:
Edicy offers a unique feature, you can create multilingual websites. You’ll need to create the different translated versions of content (you can use an automated tool like Google Translate if you’d like), but Edicy will then allow visitors to access the different versions of your site.
Edicy offers a variety of different templates, plus you can drag and drop items like text, forms, photos, galleries, and more. They also offer additional customization options for designers.
Edicy starts at $11 per month billed monthly, or $8 per month billed annually. The Plus plan offers additional features like more disk space and unlimited pages for $18 per month billed monthly or $13 per month billed annually.
Virb allows users to create websites quickly and easily. They’ll host your site and with the help of the beautiful templates/themes offered by Virb you can have a mobile-ready, responsive website online in no time. Virb doesn’t offer all of the advanced drag-and-drop layout and customization options that you get with some of the other web builders featured in this article, but they do offer customizable templates that are very well designed that will make your site look great.
Virb’s pricing is simple. It costs $10 per month and you’ll get access to all of the features, including unlimited pages, unlimited media, blogging, analytics, and more. You can even integrate Virb with Big Cartel or Etsy to sell products.
Example templates that are available with Virb:
For the past several years PageLines has been a popular drag-and-drop WordPress theme and theme framework. Just recently they released the new PageLines DMS (design management system) which allows you to create your own themes and templates with their new drag-and-drop builder for WordPress. You can create mobile-ready, responsive websites/themes without the coding.
DMS can be downloaded for free, with lots of upgrade options available. You can purchase a personal, business, or developer plan to unlock added features. The personal plan costs $10 per month ($8 per month if billed annually) and allows use on 1 website with pro sections and pro editing tools. The business plan costs $20 per month (or $16 per month if billed annually) and offers up to 6 websites. The developer plan costs $30 per month ($24 per month if billed annually) and allows use on unlimited websites and works with WordPress multisite.
Using DMS you can edit your designs from the front end, saving time and making the process more efficient. PageLines is built on Bootstrap, which many designers already know and use. Developers also have plenty of options for creating advanced customizations and templates, and you can even sell your creations in the PageLines store. As a user you can purchase all kinds of extensions and add-ons to bring new functionality to DMS.
Headway is another drag-and-drop WordPress theme builder.It uses a responsive grid, so you can create websites that will work well on any device. Headway uses a block system to allow you to add different elements wherever you want, and then you can customize the look without any coding.
Despite the fact the Headway offers drag-and-drop theme development, developers get access to features like live CSS editing and the blocks API that allows you to add custom block types.
The base license of Headway costs $87, which allows for usage on your own websites plus one year of support and updates. The developer license costs $174, which allows for use on unlimited websites with 1 year of support and updates.
Examples websites built with Headway
Ultimatum is also a drag-and-drop WordPress theme builder. It uses widgets to allow you to move content around and choose the layout that you want. You can also edit styles without touching the CSS code. Ultimatum also comes with a powerful shortcode generator that allows you to insert things like columns, buttons, forms, and more.
You can create unlimited templates with Ultimatum. You can also use unlimited custom post types and taxonomies. It also comes with the ability to use several different sliders, including the popular Nivo Slider.
A starter license for Ultimatum costs $65, which allows for use on one site. The developers license costs $125 and allows for use on unlimited websites.
Examples websites built with Ultimatum
Dunked is a free, simple-to-use solution for creating a portfolio website. With the free option you can create a portfolio site that showcases 6 projects, includes 2 pages, and 50 images. Optionally, you can upgrade to the freelancer plan for $49 per year, which allows for 50 projects, 50 pages, and 500 images. Or you can choose the agency plan for $99 per year which will give you unlimited projects, unlimited pages, and 2,000 images. Both the freelance plan and the agency plan also allow you to remove the link to Dunked, the use of a custom domain, priority support, and Analytics integration.
Dunked is a new option, but already boasts over 50,000 users. It is a project of popular WordPress theme designer Orman Clark, and the templates offered by Dunked use a beautiful minimalist style that have made Orman’s WordPress themes so popular. At the moment there are only 2 different templates to choose from, but they plan to add many more templates in the future.
Examples of templates available with Dunked:
Prosite is an option from the popular Behance Network for designers, artists, and photographers that want to create a portfolio site. Prosite uses a drag-and-drop builder to allow you to design a site without touching any code. For designers and developers, HTML and CSS can be coded and customized as well.
Prosite is especially a good option for those who already have an account with Behance. You can sync the two so that whenever you publish work on your Behance profile it will automatically be added to your site using Prosite. Prosite can also be integrated with LinkedIn, AIGA, Adweek, and more.
You can create your site for free with Prosite, but you’ll need to pay in order to have the site published. The cost is $11 per month or $99 per year. You’ll get features like Tumblr and WordPress integration, Typekit fonts, unlimited bandwidth, use of your own domain name, Analytics integration, and more.
Examples of sites made with Prosite:
Pros and Cons of Using Website Builders
So now that we have looked at some of the leading options for creating a website with no coding required, how about we take a look at some of the pros and cons?
Speed of development
One of the biggest advantages that any of these systems have when compared with creating a custom site from scratch is that they can be created very quickly. End users love this because they can create an account and have a live website up and running the same day, without the need to even involve a designer. For those designers that use a website builder to speed up their own design and development process for client websites it means that they can save a lot of their own time by not needing to do all of the custom coding.
Along with the speed of development, the low cost is the other major factor for end users. Many of the options we looked at in this article include no up front cost and then only a very reasonable monthly or yearly cost. And with hosted options it becomes and even lower cost when you factor the amount that you would have to pay for hosting somewhere else if you were having a site custom designed.
The prices of custom designs will vary greatly depending on which designer/developer you hire. Factors like the location of the designer will play a large role in the cost because operating costs vary tremendously from one location to the next. Freelancers who work from a home office may be able to charge lower prices than a bigger design agency that has to maintain the overhead of a rented office and many employees. Of course, the designers experience and the specifics of the project will also be determining factors. However, regardless of all of those details, even the lowest-priced custom design will be a much higher price than a do-it-yourself option.
The cost of using any of the options covered in this article would be more comparable to the price of buying a premium template or theme, but in most cases the template or theme will not offer as much customization for someone who doesn’t want to touch the code.
Technical skills not required
WYSIWYG builders allow users to create a website without the technical knowledge of being able to design and code a website. This, of course, does not mean that any user will be able to create a website up to the highest standards of a custom design, but they technically can get a functioning website online without any specific knowledge or experience.
May include hosting
Many of the options that we looked at in this article include hosting. This can be a good thing or a bad thing depending on how you look at it, but in terms of costs it usually makes the deal even better. Every website will need to be hosted somewhere, and some of the do-it-yourself options come with monthly or yearly costs that are similar, or at least not significantly higher, than you would pay for a hosting account somewhere else. One other benefit of using a hosted system is that the support is generally better. You’ll be getting support for hosting and CMS from one place, and they will know their own product very well.
Ease of site management and updates
With these options an end user can update the website easily without the need to hire a designer. This is nice, but it’s basically the same situation that would apply for any website that includes a content management system.
Sometimes produces poor quality code
The biggest issue that most designers/developers have had over the years with WYSIWYG website builders is the quality of code that is produced. Poor coding can negatively impact usability and accessibility, can slow down page loads, and can generally hurt the performance of the site. The code produced by the leading WYSIWYG builders today is better than the quality of code produced 5 or 10 years ago. While it is still not a replaced for custom hand coded websites, it is a step up from the early days of WYSIWYG editors.
Lower quality of design
What has always been an issue with WYSIWYG editors, and what is always likely to be an issue, is the reduced quality of the design created by users when compared to a custom design from a professional. Just because a system allows anyone to be able to create a website without the need to code does not mean that the person will be able to create a website of high quality. A custom design from a professional will certainly cost more than a do-it-yourself job, but the work should be of higher quality because of the designer’s expertise and experience.
If you browse through the website builders listed in this post and check out the pre-made templates that are available, you’re likely to notice that there are some differences in the style and quality of those templates. For users who are going to stick primarily with the base templates this issue may be less of a negative because some of the templates are professionally designed. Other users that are going to create their own layout from scratch using a drag-and drop builder, or those who are using poorly designed templates, will be left with a design that looks low quality and unprofessional.
While do-it-yourself options can be handy for users who want to create basic websites, the options will never be truly unlimited. Any system that allows you to build a website with no coding will have its limitations. With a custom design and build you will have far more options. Of course, the ability and experience of the designer/developer will play a role here, but there will be much greater potential with a custom design.
Not a good fit for all types of websites
Do-it-yourself systems can be good options for certain types of websites, not they’re not a good fit for all types of sites. They can be a good fit for basic business websites, personal websites, blogs, and even portfolio websites. But there are countless other types of websites (for example job boards, large magazine-style sites, large e-commerce sites, social media sites, etc.) that you just won’t be able to create with a WYSIWYG builder.
Another issue that some users will face is the learning curve. Although a WYSIWYG website builder may not require specific technical knowledge, it will still have a learning curve. New users will need to learn how to use it, just like you would need to learn how to use new software. Of course, the learning curve is different with each system and some are more or less complicated than others.
While a do-it-yourself website may save money in the design and development of the site, in the end it could wind up costing money because of lost business. If the site is not effective and doing its job to bring in new customers/clients, wouldn’t it be better to hire a designer and get a more effective website? Too many times people look simply at the upfront cost and the monthly/yearly cost and overlook the difference that and effective website will produce for the business.
From a Designer’s Perspective
If you design and code websites for a living, even part-time, chances are you have a negative outlook towards do-it-yourself options. However, as much as designers may dislike WYSIWYG editors, they are not going away. While researching the different web builders covered in this article I came across a great statement from Joshua Johnson that I think is dead on:
The thing that holds my interest in this area is that, despite rejection by we snobby coders, the market refuses to die. In fact, it seems to be not only growing, but quickly improving. Each new fancy do-it-yourself website builder that I come across is a little bit better than the last. Incremental improvement is nothing to scoff at, in the long-term it could lead to products that even serious professionals have to appreciate.
As much as those of us who are involved in the design/development industry may dislike WYSIWYG options, they are attracting so many customers that it simply can’t be ignored. This doesn’t mean that designers should stop coding from scratch, but it does mean that it is wise to at least be aware of what is going on in the industry and what options are out there for end users who want an affordable website. In some cases, designers may find that an option like Squarespace or PageLines is a good fit for their own workflow and can be a tool to improve their efficiency even when creating custom sites for clients.
If you haven’t taken a look at the do-it-yourself options that are available for the past several years, you might be surprised at some of the stuff that is out there. From an end users perspective there is a lot to like about being able to create a site easily, quickly, and inexpensively. And when you add in the fact that some of these options offer attractive templates, e-commerce functionality, and other perks, you can see why many users would choose to go this route instead of hiring a designer to create a custom site for a few thousand dollars.
If nothing else, becoming familiar with the do-it-yourself options may help you, as a designer, to see what you need to emphasize when you are talking to perspective clients about a proposal. If the client is comparing your services to what they can get with a do-it-yourself option you should consider that when presenting what you have to offer. For example, your experience and expertise in designing custom websites is something that cannot be replaced by a do-it-yourself system. Sure, they can have templates that are designed by professionals, but they are not customized to the exact needs of the client. You can sell your experience that will help to make their website more effective and more profitable for their business. Providing case studies or examples that show how you have been able to boost the bottom line for your clients through a custom website is a great way to sell the need for your personalized services.
In my opinion do-it-yourself website builders can be a good fit in the right situation. Those who are looking to put up a simple personal website or a basic business website may be able to get everything they need from a company like Wix or Squarespace. I think every business should have a professional-looking website to make a good impression with visitors, and in some cases that is possible with a do-it-yourself website builder. For most businesses I would recommend that if they are using a do-it-yourself builder that they at least get some estimates and proposals from designers or agencies to see what is possible at a price that they can afford. For most businesses a custom website will be worth the cost.
For designers, some WYSIWYG or drag-and-drop builders may be able to be worked into the design/development process. If you’ve found that you’re losing a lot of potential clients to cheaper alternatives, you may want to look at a few tools and see if they are able to help speed up your design and development process, which could allow you to reduce the cost for clients. If small-budget projects make up the majority of your client work, improving efficiency in this area could make a big difference in what you are able to offer.
For designers who are looking to implement one of these options into their own workflow, the most intriguing options, in my opinion, are Squarespace, PageLines DMS, and Headway. Squarespace has improved a lot over the past several years. They have an impressive feature list and they also make it a priority to provide a useful product/service for developers rather than just targeting end users. PageLines DMS is still very new. The concept is interesting, but it has been received by very mixed opinions from PageLines users.
What’s Your Opinion?
Are you a designer/developer? How do you feel about do-it-yourself website builders? Would you ever consider using one for a client project? If so, which ones look like the best options to you?