Proficiency, well-organised work-flow is important to a web designer but most useful are those time-saving resources that help you focus on important things.
But the problem is keeping track of so many tools, resources out there. Below you will find 30 of the outstanding resources, tools and time savers for web designer and developers.
1. What Font Is
What Font Is is a free web-based service that helps identifying and/or finding alternatives of a font. It works by simply uploading (or mentioning the URL of) an image including the text. The service offers the option to include free and/or commercial fonts in the results or you can browse a gallery of 100,000+ fonts.
2. Launchlist
Launchlist is intended to help and encourage web designers and developers to check their work before exposing it to the world at large. It simply asks your project details and website URL, and then proceed through a list of provided fields with questions like:
- Images have appropriate alt tags ?
- HTML has passed validation ?
- Forms send to correct recipient ?
- CSS has passed validation ?
- Page titles are descriptive and SEO friendly ?
3. Nuggetz
Nuggetz facilitates simple content management for websites that either don’t have database resources or, a full CMS system is overkill for the level of content management required.
4. ShowSlow
Show Slow is an open source tool that helps monitor various website performance metrics over time. It captures the results of YSlow, Page Speed and dynaTrace AJAX Edition rankings and graphs them, to help you understand how various changes to your site affect its performance.
5. Tileables
Tileables is a website which creates and shares various sets of beautiful repeating patterns that you can use all for free and modified them to suit your needs
6. CSS3 PIE
PIE stands for Progressive Internet Explorer. It is an IE attached behavior which, when applied to an element, allows IE to recognize and display a number of CSS3 properties.
7. Which Loads Faster ?
Which Loads Faster is a fun way to spread the word that web performance matters. It’s about friendly competition and about testing in everybody’s browser, not just ones that have nice performance tools already.
8. LAB.js
LABjs which stands for loading and blocking JavaScript is an on-demand JavaScript loader, capable of loading any JavaScript resource, from any location, into any page, at any time. By default, the library helps loading all scripts in parallel (it is possible to define priorities) which is a great speed improvement that we usually see with asynchronous scripts.
9. Stashboard
Stashboard is a status dashboard for APIs and software services. It’s similar to the Amazon AWS Status Page or the Google Apps Status Page. Stashboard was originally written by Twilio to provide status information on its Voice and SMS APIs. Stashboard is designed to provide a generic status dashboard for any hosted service or API.
10. ColorPicker
ColorPicker is an advanced and highly customizable JavaScript color picker that doesn’t rely on any JS frameworks.
11. Font Park
FontPark is a fresh and huge repository of free fonts with over 70,000 items in their database. All the fonts are categorized very well within titles like 3D, Sans Serif, curly, etc. and they can be browsed by “last added”, alphabetically or “top fonts”.
12. HTML5 Boilerplate
HTML5 Boilerplate is an HTML/CSS/JS default template (starting point) which helps the website to-be-built work cross-browser, support HTML5-CSS3 and work fast.
13. HTML5 Reset
HTML5 Reset is a project which aims to offer a base for the HTML5-CSS3 projects which covers these issues by default.
14. HTML5 Rocks
HTML5Rocks is an online resource by Google that regularly shares various resources on HTML5 and CSS3. The site has very detailed tutorials that digg stuff like HTML5 video or @web-fonts which are good starting points on the subjects.
15. Lorem Ipsum Tool
Generate dummy content for your web design & development projects, this tools doesn’t spit out the normal Lorem Ipsum but instead it generates legit, dummy content for your web design & development projects.
16. BonBon Buttons
Sweet CSS3 buttons that are sexy looking, really flexible, but with the most minimalistic markup as possible. There are three different materials. A “mate”, “glossy” and a “glass” version..
17. TypeIt
If you have the need to type anything in a foreign language which has accents and other strange-looking characters, and you only have an US keyboard, your life used to be miserable.
18. Print Friendly
PrintFriendly makes printing on the web better. You´ll save paper and ink, plus get great looking documents.
19. Scr.im
Leaving your email as plain text in forums, on Twitter or on classified sites makes you an easy spam target: spam robots and email harvesters constantly browse these sites to collect new victim emails. Don’t share your email on public sites. Instead, use our free service that will convert your email address ([email protected]) into a safe and short URL (for instance http://scr.im/joe).
20. Name Checklist
Use namechecklist to check if your brand name, user-name, domain and vanity URL are still available on the worldwide web.
21. OpenWith.org
OpenWith.org provides detailed information about most file extension and links to free programs that can open and create each type of file.
22. Cached Commons
Cached Commons is a collection of user-contributed javascript libraries that have been cached, optimized, and hosted on Github’s fast CDN.
23. Toucan CSS Reset
It is a reset stylesheet. Unlike Meyer’s or YUI’s, it not only removes the default styling of HTML elements, but also rebuilds the new generic rules for the typography, headings, paragraphs, lists, forms, tables etc. It’s light-weight, flexible and browser-friendly.
24. Primary CSS
Primary is a simple CSS Framework, designed for Developers and Designers in order to make using CSS as easy as possible.
25. Coloreminder
Coloreminder is a web tool, that helps designer, webmasters… to find colors easily and inspiration. The color variation is very useful when you need to create a web page, design with different areas.
26. Every Time Zone
This is an excellence service which shows an interactive chart of the time in various cities around the world. While it doesn’t show every time zone as the site and is still in beta (at time of writing ). It also includes a slider to see the time in a particular zone at any time of day.
27. Instant CSS Code
Instant CSS Code allows you to quickly create a web project framework with valid HTML/XHTML and CSS in only a matter of seconds, allowing you to get your project up and running faster!
28. ProCSSor
ProCSSor is a free web service for formatting and prettifying CSS files on the fly the service grabs a CSS file by simply copy and pasting, uploading or mentioning the URL directly.
29. Sqetch
Sqetch is an Illustrator Wireframe Toolkit, consisting of several templates and elements these include Browsers, iPad, Smartphone, GUI Elements and Form Elements. Download of sqetch is free and you are allowed to use the toolkit in commercial projects.
30. WobZIP
Working in the web industry, we can receive all kinds of files that is archive in many compressions types (zips, tar) from customers and business partners. And installing each and every decompression software out there is just a pain in the but until now we have one online solution that will help you out called WobZip
