Cool Web Tools
Things! that are shiny! and webby! Our passion is everything on the web, from design to development to eCommerce. So naturally, our team of EYEMAGINATORS is pumped about sharing the web tools that make our design and development gears turn.
Here are our top 10 articles, web tools, and design and development resources for this week:
1. CSS Trashman.
An online tool to "wipe your old CSS clean and download replacement styles" to "say goodbye to crufty style." Run your stylesheets through it for more elegant and well-parsed CSS.
2. Equalize.js.
When our art director was a developer, one of his constant bugaboos was creating even-height columns with different amounts of content in each. This helps!
3. CSS-animations.js.
A library to "Create, Modify and Remove CSS3 Keyframe Animations with JavaScript."
read more
4. Slowy App.
A "real-world connection simulator and bandwidth limiter" to simulate connection conditions and test your websites at real-time speeds, even on a local server.
read more
5. Bootstrap Tour.
A Javascript Library to build product tours with Twitter Bootstrap Popovers and tooltips (i.e. if you want to guide a user through stages of your website). Doesn't rely on Bootstrap other than the tooltip and popover files, so you can use it anything.
6. An advanced guide to pre-processors (HAML, SCSS and Sass).
For anyone interested in learning more, this seems like a pretty awesome deep-dive into pre-processors.
read more
7. 10 jQuery Plugins to enhance your web typography.
A collection of awesome .js libraries to deal with creating typographic effects. Things like lettering.js, which lets you control each letter in a word precisely, and kerning.js, which lets you adjust everything from size to color to angle on a per-letter basis.
8. CSS Wizardry's guide to optimizing front-end loading/performance.
Long, but thorough article on maximizing front-end performance to minimize that wait-time for your end-users!
read more
9. Roughdraft.js.
This is probably more useful for the designers. Use this to "quickly prototype" things like grids, lore ipsum, etc. so that you can quickly mock-up a wireframe in the browser. For developers, you can "cut down on development time by figuring out layout kinks, prior to heavy code lifting."
10. Opentip.
A free JS tooltip framework to quickly add tooltips to a site. Even comes pre-configured with set tooltip styles! The tooltips are drawn using canvas so they're light, modern and very configurable.
read more
These web tools should serve you well until the next edition of Shiny Webby Things: Cool Web Tools. If you want more info, talk to us.
