Building a website can be an intimidating prospect, but with a well-developed workflow, the process can be fine tuned into an efficient and enjoyable experience. A modern workflow for any web project will be continually changing and evolving, but a strong foundation of tools, strategies, and techniques, can help guide you to building meaningful and successful websites. This post marks the beginning of our series on the topic of workflow improvements, and as a first step, here are 5 helpful resources to add to your tool belt.

Sublime Text

Workflow - Sublime Text

Referenced in our course, Building a simple website, Sublime Text is arguably the best text editor on the market. Touting a slick user interface, extraordinary features, and amazing performance, this editor is available for OSX, Windows, and Linux, and doesn’t disappoint. Take advantage of the free evaluation period, and check out our video on setting up a development environment for an in depth look at this application.

ImageOptim

Workflow - ImageOptim

With visitors demanding more and more out of site performance, every bit of optimization helps. A usual culprit in slow-loading websites is that of bulky images, and giving your visitors a smooth user experience means cutting the fat. Enter ImageOptim, a free application available for OSX that works to compress images without sacrificing quality. Simply drag and drop images or folders into the program window and they’ll not only be optimized in-place, but will also maintain their original format.

Subtle Patterns

Workflow - Subtle Patterns

Created by Atle Mo, Subtle Patterns provides an immense library of high quality textured patterns numbering in the hundreds. Easy to implement, and seamlessly tiled, these free patterns can be downloaded directly from the web, or fed into Photoshop through a neat little plugin. The Subtle Patterns website also features a nifty preview option that allows you to experience any pattern on the site before you download.

Google Fonts

Workflow - Google Fonts

If you’re looking to up your typography game, and leave the basic font families behind, look no further than Google Fonts. This free resource features hundreds of open source web fonts that are easily implemented into any project. Optimized for the web, the entire library of fonts is available for download and direct embed. As an added resource, Chad Mazzola has compiled a fantastic selection showcasing the best of Google Web Fonts in his aptly named project, Beautiful Web Type.

Font Awesome

Workflow - Font Awesome

Rounding out our list is Font Awesome, the iconic font and CSS toolkit. Created by Dave Gandy, this open source project delivers over 400 scalable vector icons that are neatly bundled into one single collection. Liven up your next project with these sweet icons that can instantly be customized and added to any website through one line of code.

Leave a Comment