Web Design Tools, services & free resources to help get you online
Here’s a helpful list of resources to help you get underway and go further with your web design skills. You’ll find where to go to register a domain name, set up your web hosting, coding tools, web platforms for you to build with, web browsers, ftp applications, graphics editors, web templates, stock graphics, icons, and web elements, and additional tools and services for you to look into. As I discover new resources, I’ll continue to add them here—so be sure to bookmark this page, and come back often!
In the article below, I’ve provided a lot of resources, links, and additional material to help get you started in web design. Some of the links are for free products and services, while other links are affiliate links. This means that if you choose to click on those links, and wind up buying the product, I earn a little bit. But, it doesn’t cost you any extra, and in fact, using these links may even save you some money.
Registering a domain name
There are many places to register a domain, and you can even register a domain while simultaneously setting up your web hosting (see below).
- GoDaddy.com A widely used domain registration site, with .com domains running about $15. Other services, like web hosting and email marketing, are also offered.
- NetworkSolutions.com Another popular domain name registration company, and like GoDaddy, Network Solutions also offers additional services, like hosting, design, and marketing.
Setting up Web Hosting
Like domain registration companies, there are many places to find affordable web hosting. You can either register your domain and set up your hosting separately, or set up both at once.
- WebHostingHub.com: A great place for new users and experienced designers alike to set up their hosting. Use this link to get your hosting for just $3.99/month!
- AnHosting.com: Geared more towards smaller, more budget-conscious websites, making them a great host for those just getting started.
- MidPhase.com: This service is more for businesses and larger sites, and dedicated servers are also offered.
- MediaTemple.net: For those with medium to large-scale sites looking for top-quality service and support, Media Temple is a great choice.
Software You’ll Need
The software you choose to build websites with can range from low to high caliber, depending on your needs. You can go with a plain text editor (be sure it’s a plain text editor, not a word processor), or you can use a dedicated code editor or a WYSIWYG application.
- CoffeeCup HTML Editor: This editor makes coding sites a breeze with great built-in features like code completion and built-in validation (Windows, $49).
- CoffeeCup Web Editor: Also from CoffeeCup, this is the Mac version of the above software, and packs the same caliber of features as its Windows counterpart (Mac, $49).
- Adobe Dreamweaver: Adobe’s highly popular and widely used web editor, Dreamweaver’s available as a standalone application or as part of Adobe’s Creative Cloud (Windows and Mac, $20/month for Dreamweaver, or $50/month for the entire Adobe Creative Cloud suite).
- NetObjects Fusion: An alternative to Dreamweaver, NetObjects Fusion makes building and managing websites fast and easy (Windows and Mac, $130).
Web design platforms
There are lots of ways to build websites. One of the fastest, most straightforward ways is to use a platform like WordPress—which can handle pretty much anything you can throw at it. You might also be interested in looking at an e-commerce platform like Zen Cart, or look into other available options.
- WordPress.org: The most popular, most widely used CMS (Content Management System), because of it’s ease of use, open-source code, it’s huge online community, and it’s flexibility and customization via plugins and themes.
- Zen-Cart.com: A very powerful, feature-rich shopping e-commerce application, which allows you to sell products, services, and digital goods online.
While you’re building your site, you’ll want to preview your work in at least a few web browsers. Below is a list of the most common browsers. If you don’t already have them, go download and install ’em (they’re all free).
To connect to your hosting account, your live web server, you’ll need what’s called an FTP application, sometimes called an FTP client. FTP stands for File Transfer Protocol. There are lots of great FTP applications available, and most of them are free. So you’ll probably want to try one or two out first before choosing one to stick with.
- FireFTP: A free Firefox plugin, which adds FTP capabilities directly within your browser. This is my FTP application of choice.
- Filezilla: A popular FTP application, which is a free for Mac, Windows, and Linux users.
- Cyberduck: A widely-used free FTP application for Mac and Windows.
- CoffeeCup Free FTP: An easy-to-use FTP client, freely available for Windows users.
Having some kind of graphics editor on hand makes building websites a whole lot easier. Even some software that’ll letcha do simple stuff like rotating, cropping, and minor colour correction would be a huge help, but you may want a little more horsepower than that for your web design ventures.
- Photoshop: With loads of horsepower and tons of features, Photoshop is, of course, the most popular raster (pixel-based) image editor available ($20/month, or $50/month for the entire Creative Cloud suite, which includes Dreamweaver, mentioned above, and Illustrator, below. Windows, Mac).
- Illustrator: Photoshop’s sidekick. A lot of web designers (myself included) use Illustrator to create logos, buttons, icons, layout mock-ups, and so on (Also $20/month or $50/month for the full CC suite. Windows, Mac).
- Gimp: A popular, free, and open source raster image editor (Windows, Mac, Linux).
- Inkscape: Free and open source vector graphics editor (Windows, Mac).
Get your website up and running in no time by using pre-made, ready-to-use web templates. There are heaps to choose from, whether you’re building your website with straight HTML and CSS, WordPress, Zen Cart, or other web platforms.
- Template Monster: Browse through Template Monster’s impressive collection of WordPress and Zen Cart themes.
- Theme Forest: WordPress and Zen Cart themes, and themes for other web design platforms.
- Thesis Theme: A very popular and easy to customize WordPress theme by DIY Themes.
- Studio Press: Powering over 86,000 sites, Studio Press offers up industry standard premium themes.
- My Theme Shop: SEO-friendly and responsive themes for your WordPress site.
- WPZoom: Professional, easy to use themes with lifetime support.
Stock Graphics, icons, fonts, photos, music & Scripts
You don’t have to be a professional designer to have a professional looking site. Below you’ll find some great resources to bring your website to life—pro-quality graphics, stock photography, scripts, and more.
- GraphicRiver.net: Find loads of icons, fonts, web elements, and a whole lot more. A resource you’ll definitely want to bookmark!
- PhotoDune.net: High quality, royalty free stock photography.
- IconDemon.com: Stock icons and imagery that are perfect for your web projects.
- CodeCanyon.net: Find tons of scripts, polls, forms, WordPress plugins, CSS elements, and more.
- MyFonts.com: The right font can really bring a layout to life. Find some great fonts for your next web project at MyFonts.com.
- AllStockMusic.com: Finding the right jingle or intro music for your projects can be a real pain. But, you might find the perfect tune at AllStockMusic.com.
- AudioJungle.net: Another music resource, AudioJungle.net offers up thousands of intros, loops, sound effects and more.
Additional Tools & Resources
Push your web design skills even further with these additional tools, services, and resources. These extras will help you build better websites, diagnose issues, and assist you in testing your projects on various platforms and devices.
- Google Analytics: Free and easy to set up, Google Analytics gives you a massive amount of information about who’s visiting your site, what pages are most popular, what pages visitors exit from most often, browsers, screen resolutions, and a whole lot more.
- Screenfly: Stick a URL into Screenfly, a completely free service, and then choose a mobile, tablet, or other device from the menu, and you’ll get a preview of your site on the selected device. This is huge for designers who want to build responsive layouts that function across multiple devices.
- Web Developer Toolbar: Get your hands on a huge set of web design-related tools with this free plugin for Firefox.
- Firebug: Another fantastic plugin for Firefox, Firebug is essential for diagnosing page structures and CSS. A must-have.
- Browsershots.org: A decent cross-browser, cross-platform testing tool.
- Parallels: Run Windows on your Mac ($80). This is exactly what I do, and if you’re a Mac user, I highly recommend installing Parallels and Windows. It makes browser and platform testing a breeze. In fact, I’m running two versions of Windows, Linux, and Chrome OS, all inside Parallels, all on my Mac laptop. Of course, you’ll need a copy of Windows too ($120).
- XAMPP: Turn your Windows computer into a temporary web server. XAMPP allows you to run platforms like WordPress and Zen Cart directly on your computer, so you can develop locally rather than on a live webserver. Best of all, it’s completely free!
- MAMP: For Mac users who want to install and build websites using platforms like WordPress and Zen Cart on their computer. Like XAMPP above, this means you can build your site directly on your computer rather than on a live webserver. Also completely free.
Alright, let’s leave things here. I hope you found this article to be of tremendous value. There’s lots here for you to go on, and lots of extra options for you to consider. If you have anything you’d like to add, any questions, etc., the comments are wide open below. Or, catch me at firstname.lastname@example.org.