Good website design is something that increasingly cannot be accomplished by hand. As the web has evolved and more and more complex elements have begun to converge, it’s important to have tools you can fall back on. Not just the obvious building tools such as Photoshop or a coding environment, but other tools to speed up the time-consuming process of making sure a site is ready for launch.
Properly utilizing these tools is critical. We’ve said it before and we’ll say it again: Even experts can make mistakes. The following tools should limit those mistakes on your end as a web designer and improve the way that you design sites.
In an age where web traffic is divided between traditional PCs, tablets and smartphones, nothing turns away users more frequently than not being able to read a page. Introducing FitText.js, a JQuery plugin that takes headline text on your page and scales it to fit the device it’s being viewed on.
If you’re interested in using FitText, it’s available for download through Github. Once incorporated into your design, it can make the difference between appealing only to one device type and appealing to all of them.
2. Browser Sandbox
Chances are that you have your browser of choice, but you’re also obviously aware that the thousands of people accessing your site won’t be using the same browser. It can also be cumbersome to keep numerous browsers installed and up to date, then check your page individually in each of them. What’s a designer to do?
Browser Sandbox is an awesome tool that lets you run eight of the most popular browsers on the web instantly in an isolated environment. This allows you to demo your site quickly without the need to install browsers you won’t use. The basic version of Browser Sandbox is free, but there’s also a paid upgrade that lets you test your site on different versions of browsers.
3. Plagiarism Checker
This doesn’t necessarily focus on the design aspect of web design as much, however, it’s still a valuable tool to keep around. Submit a block of text, and Plagiarism Checker runs it against massive libraries of other content to ensure that yours is 100 percent unique – and that it isn’t being knocked off by your competitors.
4. CSS Sprite Generator
CSS Sprite Generator is a handy tool for taking the images on your website and combining them into one large image. This speeds up the load times of your website, resulting in a happier end user.
It can be a time consuming process if you do it manually, though. CSS Sprite Generator takes a lot of the legwork away by doing it for you. Just upload your images, and the utility takes care of the rest. For more on the ins and outs of how sprites help your site, see Chris Coyier’s excellent post on the subject.
5. Code Anywhere
This is among the latest wave of tools to take advantage of remote resources, freeing you up from having to do your work on one or two dedicated machines. Like the name suggests, Code Anywhere is an app that lets you log on to your account from any supported device – PC or mobile – and access code you’ve written.
Different storage accounts and files can be accessed. This is a bandwidth intensive process, though. A reliable fiber optic internet connection is a crucial part of being able to use this tool and others effectively.
6. Google Rich Snippets
It’s amazing to consider the volume of websites that don’t pay attention to how they show up in Google’s search results. For many visitors, the first glance they’ll get at your site is going to be from a Google search page. Therefore, it makes sense, then, to give them a proper introduction. Google Rich Snippets allows you to do just that by previewing and customizing what Google’s results say in previews for your page.
Between all of these tools, the idea is to maximize your efficiency. Creating sprites or optimizing the way your site looks on a Google results page aren’t glamorous tasks, but they’re necessary and time-consuming. By having these tools in your arsenal to fall back on, you’ll be able to create higher quality products in less time.
Beth Phillips is a former web design professional who is currently freelance writing about anything and everything related to web design. She can be found typing away on her laptop in Philadelphia, PA. Beth welcomes your feedback at firstname.lastname@example.org.