Graphics Advice for the Online Merchant
Nothing will have quite as much effect on the look of your ShopSite store as quality images. Most of us are not artists or graphic designers, and only few are Photoshop experts. Therefore, we either need to hire experts to do our work for us--or we need to practice a little, arm ourselves with some good advice, and use the right tools.
Adobe Photoshop is the standard for creating and editing graphics for the Web. But it's a complicated and expensive piece of commercial software that has many features that the average Web designer will never use. It costs about $900 and can be purchased wherever you can purchase software. Fortunately, there are some less expensive shareware alternatives.
For Windows
LView Pro
A great shareware application that allows you to convert and edit graphics for Web pages.Paint Shop Pro
A larger and more extensive program, Paint Shop Pro has more tools for illustration and image creation, along with conversion.For Macintosh
Graphic Converter
With each new release, Graphic Converter takes on more of Photoshop's functions, and has multifile conversion capability as well as editing features.General Online Graphics Information
Creating High-Impact Documents
This Netscape resource has all the most important information about graphics. This is a must-read.
Make Your Scanner a Great Design Tool
This excellent and beautiful site is a must-read for anyone who has a scanner. You may never have realized what your scanner is capable of.Animated GIFs
Read this C|Net article about GIF animation, then download GIF Animation software for Windows or Mac.
Trimming for Speed
A well executed graphical element lends credibility to a site. It tells the world that you value this site enough to invest the time needed to make it visually appealing. This is especially important for merchants. Let's face it, the Web is full of fly-by-night operations. You won't get the business until customers feel that you're there for the duration. Graphics can also define your public image. There are no faces on the Internet, no hands to shake, no body language. An individual's personal aesthetic can say a lot about their personal sensibility. This is your big chance to make a proper first impression.
Graphics also add functionality to your site. Although reading comes naturally to most of us, having graduated from picture books in our childhood, most of us think that pure text is more professional. It is important to realize, however, that a screen full of text is nothing like a page full of text. You should notice that as you read this paragraph your eyes become fatigued quickly. This is because the text on the screen is actually vibrating very quickly, and your eye is constantly trying to compensate for the change. Graphics can communicate volumes of information at a glance, and don't (often) require the same scrutiny that text does.
A Few Technical Considerations
On the Internet, quality means speed. Speed, speed, speed. Have I mentioned speed? Graphics, therefore, must download quickly--or at least appear to download quickly (we'll get to that in a moment). A few factors dictate the speed of a download:
- The size of the graphic--how much memory it takes... how many "k"
- The speed of the server where it is being stored
- The speed of the surfer's access to the Internet
- The current traffic a server is handling (how many people are accessing the server at any given moment)
- The speed of the surfer's own computer
Each of these larger factors are, in turn, affected by other variables. The size of the graphic is determined by its resolution (pixels or lines per inch), its actual measurements, number of colors and compression.
The speed of the "home" server is predicated by the Internet connection (T1, T3 ISDN, or a common phone line), and the actual number-crunching capabilities of the computer.
The speed of the surfer's access is, in turn, conditioned by modem speed (28.8 or 33.6 being high-end, 2400 being Neanderthal) and the access provider's hookup.
The current traffic is completely random.
The surfer's own computer, finally, dictates download speed by processor speed, graphics capability, and RAM. Sixteen megs of RAM is the lowest I would recommend if you are trying to run a new operating system like Windows 95 or Mac system 7.5.
How to Use this Information to Your Advantage
You only have control over the first two variables: The size of a graphic and the speed of the server where it is being stored. Concerning the latter, ask your service provider how fast their server is and factor that information into your decision. In the case of the former, let's talk about graphics.
As I mentioned earlier, the size of a graphic is determined by its actual size, resolution, palette, and file format (compression). Size, of course, is determined a lot by your needs, but you should keep a few things in mind:
- Create/save your pictures at 72 dpi (refer to your graphic program's manual). 72 dpi is the resolution that a computer monitor displays everything. If your graphics are saved at a higher resolution, they will still appear at 72 dpi on-screen and the rest of the resolution will translate into wasted time and disk space.
- At 72 dpi, your images should not exceed 7 inches in width (preferably 5 or so). Anything greater will not fit inside the common computer monitor.
- The size of image that you need may be smaller than you think. Most logos do not need to be more than 300 pixels wide and 60 pixels tall. Most product images do not need to be more than 150x150.
- If possible, reduce your color palette. Many graphics editors will allow you to convert a "thousands of colors" graphic down to 256 or 16 or 4 colors. Some will let you choose a specific number. A logo that contains only three distinct colors should have its palette reduced to those three colors for optimum performance.
- Decide on GIF or JPEG images. GIFs are better for drawings and line art and logos, because it is easy to reduce their color palette down to a few colors. JPEGs are better for photographs, because they support 24-bit color, and because they compress the image, allowing a more vibrant image with a smaller disk size.
- When possible (when you control the HTML) be sure to delineate height and width measurements in the "img height=X width=X src=X" tags. This will markedly improve download speed. All images specified using pull-down menus in the ShopSite system will have size tags inserted automatically.
- Interlace GIFs if at all possible. Interlaced GIFs aren't any faster than their cousins, but appear so because something comes onto the screen and then gets progressively sharper until the image is complete, which gives surfers something to gawk at while they wait.
- If you are having problems creating decent images on your own, hire a professional. It may seem expensive, but not as expensive as presenting a less-than-professional store to your prospective customers.
Back to Main Help Page | Search | Give Feedback
If you are not finding the help you need, please give detailed feedback.