Archive for the ‘Graphic Design’ Category

Why We Use Fireworks Instead Of Photoshop For Most Of Our Website Design Work

Friday, October 21st, 2011

Almost all web designers use Adobe Photoshop software—if not always, then at least a very large percentage of the time. Photoshop has gained notoriety over the years for being the definitive graphic editing program—whether for editing photos, doing graphic design work, or for designing websites. It’s insanely popular.

But here’s the deal—Photoshop is great and all, but Adobe created Fireworks specifically with web designers in mind. For a web designer, it does just about everything Photoshop does and more, but also excels in many areas unique to web design. That’s what it was designed for, after all. Let’s take a look at some of the reasons we use Fireworks instead of Photoshop for most of our website design work these days…

Fireworks is detail oriented in a web design kind of way. With Fireworks, you can get more specific in what shapes, sizes, and angles you want different elements to be. Working with graphics in Fireworks, down to the pixel level, is a lot like working with CSS to specify certain pixel dimensions and sizes on the web development side of things. In other words, for a web designer fluent in CSS, Fireworks just speaks the right language.

Awesome batch processing and exporting tools are part of the package with Fireworks. Many web designers who primarily design in Photoshop still run all of their final graphics through Fireworks for post-processing before uploading them to the site. Why? Fireworks is excellent at processing image files down to a minimum size (great for website speed), without being lossy. It’s sometimes possible to compress an image file to about half the size as Photoshop without any perceivable difference. And to top it off, the batch processing tools in Fireworks make the process of optimizing all of a website’s image files in one shot a breeze.

Fireworks was designed to slice and dice. Many times, a web designer will come up with a “big picture” graphical rendition of how the website will look before diving in to the nitty gritty code and functionality work. When it’s time to break the design down into small individual graphical elements for the website, Photoshop is kind of a bear—all of the slicing and dicing must be done manually one layer at a time. However, with Fireworks, the process of breaking down the large scale design into the appropriate web ready files is built in functionality—it was designed to slice and dice for creating websites.

These are some of the primary reasons we prefer Fireworks for web design…but the list could really go on and on. A few additional quick benefits of Fireworks include:

  • The detailed and deep reaching gradient tool built into the software is much more versatile than the one in Photoshop.
  • For basic web graphic editing, Fireworks is quicker in performance and uses smaller file sizes than Photoshop.
  • Fireworks is built to use pages (just like a website) rather than layers—it’s easier to design in a format that meshes well with the intended final product.

The bottom line?

We like Fireworks. It’s ultimately a matter of preference, but we find that Fireworks is a much more compatible web design environment for us than Photoshop.

Why You Probably Don’t Want A Print Designer To Design Your Website…

Thursday, November 12th, 2009

Print design vs. web design—at first impression, it’s safe to say that there are a few similarities.  But when you really get down to it, the two ambitions are really very different schools of thought.  A web site must work with thousands of different combinations of computers, monitors, and web browsers…print is designed to be displayed (printed) at one specific size.

It’s probably best to stick with a web designer to do your website work and a print graphic designer to handle the traditional offline stuff.  Here’s why…

Online Is All About Speed – High resolution print graphic files are huge.  And after all, why not?  The files aren’t being transferred to the masses via the web, so there’s really no excuse to sacrifice any quality whatsoever by shrinking down the file size.  On the other hand, the goal of optimized graphics for the web is to display on the end user’s monitor clearly and crisply at the absolute lowest file size possible to get the job done.  Sacrificing speed and bandwidth is costly on the web.

Usability Is Essential – While print design is intended to look great and send a message visually to the viewer, web design must take it a few steps further and actually be functionally interactive at the same time.  In other words, viewers aren’t just looking at a web design; they’re actually becoming immersed within it.  The design components all have to work perfectly together to make the website design easy to use and easy to navigate.

Fonts Are Completely Different – Print fonts vs. web fonts are drastically different.  Basically, it boils down to the fact that only a few standard fonts display accurately and universally across the web.  Every web design needs to take into account the “least common denominator” when it comes to fonts, in order to render correctly when the ideal fonts aren’t available on the viewer’s system.  To the contrary, print designers are fortunate enough to be able to choose any font they’d like to use.

Web Design Must Account For Coding – There’s a huge difference in laying out a graphic design for print and implementing it for a website.  In many ways, with print design, what you see is what you get (WYSIWYG).  On the other hand, once the overall graphic design for a website is complete, it must be completely deconstructed—piece by piece—and then code must be written to tell web browser software exactly where each piece of the design needs to be displayed.

A Few Words About Color Space – You might be somewhat familiar with the terms RGB and CMYK.  These are known as color spaces, and along with a few other commonly used systems, they are basically like the “box of crayons” used to create a design.  But computer monitors, by default, work only with RGB—so that’s the standard for web design.  On the other hand, traditional print presses rely on the CMYK “box of crayons.”  Color spaces are just not very interchangeable.

There are many other substantial differences between print design and web design as well.  The bottom line is that you always want to make sure your web designer has extensive experience working with the web—it’s just too much different than print to be considered the same school of design.