Posts Tagged graphic design

4 More Things Print Designers Need to Know About the Web

We posted our first 4 tips earlier this week, and got some great feedback on some other things that print designers need to consider when designing for the Internet:

1. Use Low Resolution Images: For print, you are probably used to 300 DPI or higher. For the Web, we can get away with lower quality work, 72 DPI is just fine. 300 DPI images wouldn’t add much, and would take much longer to download.

2. Be Flexible: When you print something, it should come out just the way you expected. On the Web, different browsers, different computer monitors, and different operating systems will mean that there will be slight variations between how your piece looks on each computer. These can include minor changes in fonts, minor changes in color, and even minor layout changes. There are techniques your HTML producer can use to minimze these issues, but it will never be 100% the same in every environment.

3. Use RGB, Not CMYK. All color on the Web is constructed using RGB. Make sure when selecting a color in Photoshop, that you do so using RGB.

4. The Web is not a print piece: In addition to mostly mechanical differences between Web and Print, it is also important to know people use the Web differently than they may use your print piece. Consider a postcard: It appears in the mail – it has two sides – and a potential “user” of your postcard will spend a specific amount of time looking at it and also will scan in it a specific way. A user of your Web site will be at a desk, using a mouse, and will be at a different point in their day. It may help t put yourself in the mind of a potential Web user and consider how long they might view your piece and what they may look for.

As always, please add your thoughts below! :)

, , , , , ,

1 Comment

4 Things Print Designers Need to Know About the Web

Many of our clients are Graphic Designers who need help taking a great design and making it into a fully functional Web site. We’ve prepared this list of tips that every graphic designer needs to know when making a design for the Web. We’re aiming this list at print designers looking to make the transition.

1. Know your Target Screen Resolution: In print, you need to know how long and wide a piece will be. On the web, that length and width is measured in pixels. For mass market Web sites, you should target your site to be no longer than 775 pixels across. The actual resolution is 800 pixels across, but we need to leave room for the browser window border and the scrollbar which may be on the right side. For Web sites targeted at a younger or more technical audience, you may be able to design for a high screen resolution — plan for 1000 pixels in this case. In any case, be prepared for your site to look different depending on the screen resolution settings on the user’s computer: some computers will show your Web site very small, on others it will take up the full screen. Vertically, there is no maximum length, but note that the user may need to vertically scroll to see your entire page.

2. Are you fluid? Sites like Amazon.com can fill up the browser window — try loading the front page and resizing your Browser Window. Witness how it distributes the extra space that appears when you resize the window. This is called a Fluid design. You can ask your HTML producer to do this, you just need to specify where the extra space should go.

3. Use Text When Possible: On the Web, there are two different types of text: text that is an unusual font and actually stored as a graphic, and text that uses an ordinary font that is stored as text.  Text loads faster, but can vary somewhat from computer to computer. A graphic loads the same everywhere, but loads slower and can’t be read by a search engine. Text that is stored as text can only be one of 6 very ordinary fonts and can be edited easily, text as a graphic can be any font you wish to use, but is harder to make changes to. Our advice is to use text as much as possible, but use graphics when you need to — this means that body text and navigation elements should usually be kept to one of the 6 fonts that are on most people’s computers: ArialCourier NewGeorgia,Times New RomanVerdanaTrebuchet MS.

4. Hire someone to help with HTML production: as a print graphic designer, we would recommend you have someone else help with the technical work (we, of course, think you should hire us, but any Web programmer will do). The skills that make you a great graphic designer will make the technical work involved with producing Web sites harder. It is a classic left brain / right brain issue — very creative folks will have a hard time with technical work, and vice versa.

That’s it from us, we welcome your input below.

, , ,

7 Comments