Free Web Project Tools

9 Free Tools to Make Your Next Web Project a Success

Look. You make beautiful things. It’s your passion, probably your living.

But with the logistics of work life being what they are, you’ve probably landed on a few less-than-gorgeous tools and processes along the way. These ugly parts of your day-to-day can wear on you; your mind may (even now!) be hopping from “ugh, email attachments” to that awful project management tool your client somehow prefers.

For every argument urging “don’t upset the apple cart” is another, more eloquent entreaty to clarify, simplify, beautify now and reap the benefits forever. So before you plunge feet-first into that next big design project, step back and take stock.

What catch points make you dig in your heels and go grab a coffee, putting off progress because you dread the next step? Maybe they seem silly when you say them out loud, but no matter. Hunt them down; tease them out of the fold. Install something more seamless in their place.

It’s not just about the time savings or even the workflow; it’s about holding process to the same personal standards as your product. It’s about keeping only the best, most beautiful apps — nestled on all sides of your work life — on your screen and in your mind.

Typeform for Onboarding

Typeform

The trouble: Oh, the awful hours you could spend rooting around in haphazard email threads for mission-critical information!

The fix: Something as simple as a project-initial survey can stop that craziness dead in its tracks. Ask the meaty questions you need to get started and give clients some space to riff on their wants and needs. The more info you can coax out of them up front, the more seamless the rest of the process will be.

The tool for the job: A simple Google form would do the trick, but Typeform includes many more ways to customize (and, hey, it’s just as free!).

PandaDoc for Proposals

Panda Doc

The trouble: As it stands, you’re probably sending quotes and outlines via email or even (gasp!) fax if they require a signature. And while you absolutely should require a signature to kick a project off right, there’s no reason to do the whole print/sign/scan dance every time.

The fix: Start off on the right foot with a formal business proposal. It’s like an all-in-one outline of expectations, timeline, price, and product. The simple act of setting all this info down in one place gives you a chance to organize your thoughts and align your resources to tackle the project at hand. And with something as complex as a website project, having a signed record of project scope can be an interpersonal and legal godsend down the road.

The tool for the job: Try an all-online esign solution like PandaDoc for a beautiful way to keep your docs organized, secure, and legally binding.

Wireframe.cc for Mockups

Wireframe.cc

The trouble: No matter what, mockups take some serious time. But if you’re building the actual site for screenshots or constructing lookalike files in Photoshop, it’s definitely time for a change.

The fix: The argument for a wireframe tool is twofold: (1) the mockup process is way faster in a tool built just for that purpose and (2) there’s something about a graph paper background that lets the first draft feel sink in. Repeat after me: “This isn’t the final product.” Don’t obsess as if it were.

The tool for the job: Wireframe.cc is pretty, free, and simple. What more could you want?

Trello for To-Do Lists

Trello

The trouble: To-do lists everywhere! On your whiteboard, on the backs of envelopes, and especially rattling around in old email threads with clients.

The fix: Pick a place to keep your tasks nested under the appropriate projects. Simple as that!

The tool for the job: If you’re a fan of the scrum board or even just the post-it, Trello can spell magic for your productivity. The ability to drag discrete tasks between stages of completion syncs up perfectly with the complexities of a website project. You can even attach files to each card and assign team members to each task.

Import.io for Content Research

Import.io

The trouble: It’s impossible to know exactly how the site you’re building will be used or the kinds of content it will house years down the line. All you really have to go on is a current website, a few competitor websites, and maybe your client’s murky vision.

The fix: Go the extra mile — er, couple of clicks — and do a little research on the contents of sites your client mentions. Just a cursory analysis of their popular blog posts can give you a good (and lightning quick!) glimpse into the gist of the stuff you’ve been hired to present.

The tool for the job: Take a leaf out of the marketing book and scrape data from current and competitor sites with a tool like import.io. Then sort, if need be, with Google Refine.

Optimizely for Split Testing

Otimizely

The trouble: You’ve got your beautiful landing page up and running, but you want to improve on perfection — maybe test a button color hunch or follow a font size intuition. Or maybe your client has a few “what ifs” up their sleeve, and you’re looking for a way to incorporate suggestions without sabotaging the site.

The fix: A/B test! You can pit ideas against each other and see how each performs. Better yet, you can set up the tests (all it takes is a few HTML tweaks to your existing theme), and hand your clients the keys to the whole optimization castle.

The tool for the job: Optimizely is a fabulously simple tool that lets you A/B test against existing pages. A free account and bam! An answer to those “what ifs” is just a click away.

YSlow for Site Performance

7 yslow

The trouble: You want to make sure the sites you’re building perform well. Period.

The fix: Keep performance top of mind as you work, and try a tool that tells you more than sizes and speeds. Shoot for something that spits out concrete suggestions about things you can do to improve.

The tool for the job: The YSlow extension perches unobtrusively in your browser. It displays an overall score alongside more specific letter grades to guide your optimization efforts.

Browserling for Cross-Browser Testing

Browserling

The trouble: Repeatedly testing your sites in multiple browsers is just plain cumbersome.

The fix: A cross-browser testing tool can quickly show you your site from every angle in virtually every version of every browser.

The tool for the job: Browserling lays it all out on its homepage. You can run a your (fully interactive) site on any version of Explorer, Chrome, Firefox, Safari, or Opera in just a few keystrokes.

Join.me for Soliciting Feedback

Join.me

The trouble: Sometimes remote meetings with collaborators and clients just don’t seem to cut it, especially at certain stages of a website project.

The fix: Think about how you’d hold a real meeting. Do you stare into each other’s eyes Sykpe screen style? More likely you sit side-by-side, eyes trained on the project at hand. Replicate that collaborative experience with a screenshare app, so you can get the quality of feedback you need to move forward.

The tool for the job: Simplicity is victory for these types of things. Initiate a join.me the next time you’d rather show than explain; your clients can hop on the call with nothing more than the link and 9-digit code you send their way.

Conclusion

You’re now equipped with 9 free tools that will improve your workflow and keep your projects looking beautiful. If your favorite tool has gone unnoticed, let us know in the comments below.

Christy Delehanty

Creative writer and content marketer for Quote Roller and PandaDoc. Loves language flexibility and style guides with equal abandon. Walks SF, shops Goodwill, eats everything.