Web designers and developers do a lot of work in Dreamweaver or Fireworks, but tons of time is also spent in a web browser. Screenshotting, checking out source code, validating for web standards… the browser is an essential design tool. And if you have Safari, these tasks can be made easier with some cool plugins.

My latest favorite is Red Snapper. This $8 shareware (with three-day free trial) from Tasty Apps takes perfect, fast screenshots of web pages. You can of course do this with Mac key commands or applications like Snapz Pro (both of which I also use), but one click of the Red Snapper button (added to the Safari toolbar on installation) gives you quick, useful save options. Choose your format, size, and even quality level for JPEG shots, and you’re done.

When you click the Red Snapper button in the toolbar, you’ll get lots of save options for your screenshot.

Love Safari, but hate that it’s one of the only browsers that doesn’t color the source code for easy reading? SafariSource from TildeSoft (free, but donation suggested) does the job. To install this handy plugin, you’ll need to also install SIMBL, which comes with the download. (Don’t worry if you don’t know what SIMBL is—I don’t either, and don’t care, but it turned out that the installer said I already had it. Go figure.) Once it’s installed and Safari is restarted, view the source code of a page (View > View Source) and it’ll appear in color similar to the coloring you see in Dreamweaver. Want different colors? Just head to Safari’s preferences, where you’ll find a new SafariSource tab with tons of color options.

The preferences also let you disable SafariSource if you want to go back to the dark ages for some odd reason.

Another SIMBL-related Safari plugin comes from Kasper Nauwelaerts. Safari Tidy (also free, donation suggested) shows you an XHTML validation report for any site you visit. This is tons quicker than any validation site you might currently use. Info appears automatically in the Safari status bar for every page you visit, such as “1 error/30 warnings”—click it and you’ll see all of the errors and warnings in detail. This is a great way to fix your work, of course, but also a great way to learn web standards.

Don’t panic when you see warnings on your pages—check them out in detail and prioritize what should be fixed.

Each of these Safari plugins automates common designer and developer tasks. If you’ve found any others, comment here—I’d love to know what saves you valuable design time!

–

From the NoD Sponsor:

Sessions Online Schools of Art and Design is an accredited online graphic and web design school offering:

- Web design classes and web design Certificate Programs taught by renowned design instructors.

This entry was posted on Monday, September 17th, 2007 at 1:17 pm and is filed under Web Design. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.