As with any great endeavor, web design is about both inspiration and perseverance. Back in the day, creating web pages was the sole province of hardcore coders, but that’s not the case anymore given that there are numerous tools to simplify the process. Some of these even have a visual interface, allowing you to drag and drop links, text and images as if you were designing a poster or presentation.
Other web design tools are geared towards programmers, acting as advanced text editors, and allowing for building a website line-by-line. However, most web design tools exist somewhere between these two extremes.
In this guide we have focused on five of the very best tools currently available. When weighing up which to include, we have focused on ease of use, supported web languages, cost, and how easy the tools make it to upload the finished project once you are done.
If this is your first time building a website we recommend using a free tool such as Bluefish before spending any money. All premium tools covered in this guide offer a trial version, in any case, so you can get an idea of what they’re about before you commit.
A web design juggernaut but possibly overkill for some
Very popular web design tool
Suitable for all levels of expertise
Sheer amount of features can be confusing
Dreamweaver is one of the best-known web design tools on the market and has been around in various forms since the turn of the century. The latest iteration of Dreamweaver is available as part of Adobe’s Creative Cloud suite for a fixed monthly fee of €24.59 (£21.60, $28.80).
The tool has a broad appeal to both novice and advanced users. When you first launch Dreamweaver, you’ll be asked to choose between ‘beginner’, ‘intermediate’ and ‘advanced’ skill levels. These help to determine the number of features shown to you, and whether you’ll be given options to perform more complex tasks like building a site from code.
Other advanced features include a ‘live view’ for previewing websites as well as support for certificates and a dedicated workspace for developers. If you’re making your first venture into programming sites, Dreamweaver also offers tips for improving your code.
The general consensus from user reviews is that while this web design tool is amazingly flexible, the arsenal of features can be truly overwhelming. Fortunately Dreamweaver offers a free trial, so take some time to experiment and see if it’s right for you.
Lightweight and easy to use – a big fish in a small pond
Lightweight and quick
Use advanced code via wizards
No visual interface
Bluefish is amongst the smallest web design tools available today. The tiny installer weighs in at just under 53MB and setup takes only a few moments. While the interface is text-only, it’s clearly designed with novices in mind as it employs clear-cut toolbars, user customizable menus and syntax highlighting.
Bluefish has an excellent search function, allowing you to find text across multiple projects. The tool also has no trouble juggling hundreds of documents at the same time. Although Bluefish supports working with remote files, the varied and useful dialogs and wizards don’t currently support direct upload of web pages via FTP.
Despite the best efforts of the developers, Bluefish may take some time to get used to. The tool is available free of charge, however, so you have nothing to lose by giving it a try. During our test on a Windows 10 PC we found we had to install GTK+ 2.24.8 in order to run Bluefish. A download link for GTK is available via the Bluefish website.
An extremely advanced text editor for hardcore coders
Support for multiple web languages
Extendable features via free packages
No visual interface
Described by its developer as a “hackable text editor for the 21st Century”, the free and open source Atom comes to us from the team at GitHub.
As the interface is text-only Atom is geared towards more advanced users. However, there are a number of freely downloadable extensions, such as ‘packages’, which can make this text editor a joy to use. Available packages include Emmet, which allows you to write HTML and CSS using abbreviated code. Another is Pigment which scans your script for color codes and displays these automatically in the background color.
Atom is truly cross-platform as it is available for Windows, Linux and macOS. This makes it ideal for working on copyrighted material. And because it’s open source the development community can quickly respond to any bugs or security flaws which are discovered.
An excellent tool for creating interactive content
Simple WYSIWYG interface
Support for YouTube and Google Maps
Primarily designed for creating ads
The good news is that this is done via an extremely simple to use GUI which incorporates point-and-click design tools covering text, basic shapes, 3D animations and much more. Any 3D features are shown on a timeline at the bottom of the window. The panels on the right-hand side of the interface allow you to fine-tune further options such as colors.
Google Web Designer also incorporates a handy library of extra components such as images, videos and other advertising tools.
Advanced users can toggle between the default ‘design’ view and ‘code’ view, which is why the tool can support creation of more advanced features besides ads – provided you have the knowledge and patience to program these yourself.
Google Web Designer is still in beta testing, so lacks certain features such as being able to open HTML files created outside the tool. Nevertheless, it does include a handy web preview option which will open your current project in your default browser. You can also automatically publish content. This Google offering is available free of charge for Windows, macOS and Linux.
Cloud-based offering that needs no coding knowledge
Drag and drop GUI
Interface takes time to master
Webflow is a cloud-based service which has been created specifically to allow people with no coding knowledge to get started with web design.
Aside from being truly cross-platform, as it’s web-based, Webflow emphasizes the concept of ‘smart codelessness’. In the first instance this means a crisp drag and drop interface allowing you to drop elements such as text and images seamlessly onto a page using one of the freely available templates.
Unlike many WYSIWYG editors, the code produced is very clean and well-written even if you choose the ‘I have no coding experience’ option during setup. Webflow’s automation tool will create the necessary HTML/CSS code for you. You can make granular changes to individual elements using the panels on the right.
Webflow offers a free demonstration of its features via the website, and you can also subscribe for a free Starter package which allows you to create up to two projects. If you require more than this and/or need web hosting services too, prices start at $24 (£18, AUD$32) monthly. This is a little pricey compared to equivalent tools, mind you.
Webflow also has little support for e-commerce plugins or marketing tools. You can use a separate tool such as the aforementioned Google Web Designer to create interactive advertising content if you wish.
You might also want to look at our many web hosting guides: