Frequently Asked Questions about Text and Graphics

Transcription

1 1 Frequently Asked Questions about Text and Graphics 1. What is a font? A font is a set of printable or displayable text characters that are in a specific style and size. The type design for a set of fonts is the typeface and variations of this design make up the typeface family. For example, Helvetica is a typeface family, and Helvetica italic is a typeface or Ariel is a typeface family and Arial bold is the typeface. 2. What is a font measured in? A font is traditionally measured in points. 10 or 12 points is the normal size for content text. 3. How many font formats are there and what are they? There are four formats for Fonts: 1) True Type standard format for a PC, 2) PostScript PC & Mac 3) Vector scaleable range of fonts 4) Bitmap - is a digital representation of a font that is already fixed in size or a set of sizes. 4. What type of settings and effects can be applied to fonts? There are a number of settings and effects that can be applied to any font Kerning - the space between each letter Leading - space between the lines Vertical and horizontal scaling Antialiasing - smoothes the edges of the text into the background colour. Choice of crisp, smooth, strong and none. Styles - bold and italic Justification - assigned to a paragraph to align it to the right, left or centre

2 2 In PhotoShop you can add the following effects to any font: Bevel edge of the word is carved out Emboss edge of the word is pertruding Engrave appearance of a physical engraving Drop shadow shadow that is dropped behind the text Rotated or curved text appears to follow a path/shape. Glow outer or inner glow 5. Are there any Rules/ Design principles for using text in Multimedia? The font is appropriate for the project. For example, in corporate site you would pick a plain, traditional font, such as Ariel but if it were a cartoon site you would pick a fun, quirky font. The font is readable at an 800x600 resolution. Use a different size of font for the heading and the content text so the user can automatically differentiate between the two. Make sure that heading and related text are close enough to each other so that the user automatically knows they are related. Use the same font family throughout the project any design must always be consistent. Proximity of the text to a related image make sure that they are close together so that the user automatically knows they are related. Make sure the alignment of the text is the same throughout the project. Try to avoid huge blocks of text on the screen, as it is difficult for the user to read and concentrate split it into sensible paragraphs. Antialiasing If the font is too small and antialiasing is applied, then the text will loose its crispness and readability. 6. What considerations are there regarding the use of text in Multimedia? Remember that Macs and PC s display fonts differently bear it in mind. Web - If the font isn t a default font, such as Arial, Times New Roman, Courier or Tahoma, then create the font as a graphic. If you don t create it as a graphic and a user hasn t got the font installed on their machine the computer will pick the closest default font.

3 3 CD-ROM - If the font isn t a default font, such as Ariel, Times New Roman, Courier or Tahoma, then embed it in the text field in the product. If you don t embed the font and a user hasn t got the font installed on their machine the computer will pick the closest default font. Resolution Browsers Netscape and Internet Explorer can sometimes show text differently on the screen. Make it look the same on both browsers or as close as you can get. 7. What does resolution mean? Whenever you here a designer talk about designing anything you ll always here them say design for 800x600 What does this mean? It means 2 things 1) The amount of pixels displayed on screen, width comes first then height. So this means that 800x600 is 800 pixels wide by 600 pixels high. There are two common resolutions that are used and these are 800x600 and 1024x What is a bit? The number of colours per pixel. It s the range of colours that the image can store. For example 8 bit =256 colours. 9. What is a colour palette? A colour palette is a set of colours that is used in a graphic. There are 3 different Palettes RGB, CYMK and Pantene. Each colour within a palette will have it s own unique code or value. For example white in RGB is 255,255,255 or # Each code can be either made up of either 3 groups of numbers or a # with a mix of 6 numbers and letters.

4 4 10. Are there different colour palettes and what they are used for? RGB, CYMK and Pantene. RGB is used for the web and Multimedia. CYMK and Pantene are used for Print. 11. What is a web safe palette? All of the palettes can be web safe or not web safe, really only applies to RGB as it s the only one used for the web/multimedia. Web safe using 216 colours out of the ones available. The reason why we only use 216 is because we have to save some colours so that Macs and PCs can use colour elsewhere e.g. windows. It is important when creating graphics for the web that you try to stick to a web safe palette as you always cater for the lowest common denominator. However most computers now can cope with a non-web safe palette. 12. What is a graphic measured in? In screen resolution it can be pixels, in physical size, it can be centimeters and in terms of file size it is in Kb or Mb 13. What is a vector image? Drawn using point and lines. The point and lines can be repositioned. The lines are stretched and manipulated as if you were stretching rubber band. These images can be scaled and resized without it affecting the quality because they aren t using a set amount of pixels. 14. What is a bitmap image? It s an image has already been created using a set amount of pixels it s created at the size you want. It s not really scaleable. When it is increased or decreased in size the quality suffers and the image becomes very pixelated. 15. What is a jpeg file? It stands for Joint Photographic Experts Group. It can contain up to 16 million colours. JPEG compresses graphics of photographic colour depth whilst retaining a high quality of colour. This makes JPEG files smaller and therefore quicker to download. You can

5 5 choose how much to compress a JPEG file, but since it is a lossy format, the smaller you compress the file, the more colour information will be lost. File Extension:.jpg or. Jpeg 16. What is a GIF file? It stands for Graphics Interchange Format. It contains 256 colours. Small file size. This compact file format is ideal for graphics that use only a few colours. A gif file is lossless compression - as the image is compressed no colour information is lost. Animated gifs - set of images animated Transparent gif - background of the image is transparent 17. What is a png file? It stands for Portable Networks Graphics. A png file is lossless compression as the image is compressed no colour information is lost. It contains up to 16 million colours A lossless graphics file format that combines many of the benefits of GIF and JPEG. File extension:.png 18. What is a psd file? Photoshop file format. Very large file sizes. It contains up to 16 million colours File extension:.psd 19. What is an EPS file? An extension of Adobe System's PostScript graphics file format. EPS is often used for high-resolution images. Vector file. Large file sizes. 20. Are there Rules/ Design principles for using graphics in Multimedia? Always design for 800x600 Always cater for the lowest common denominator 216 colours, 800x600, 8 bit., and 56k modem. Smallest file size as possible Always use RGB pallet Always use a web safe palette Appropriate use of colour Appropriate use of images Always use Alt tags in case the user has the images switched off in the browser.

6 6 What do I have to consider with graphics in Multimedia? Filesize download time Amount of colours used - more colours means a larger file Mac & PC differences be aware it will never look the same on a PC and Mac. Contrast settings are different on Mac and PCs so on one it will appear lighter and on the other darker. Resolution Browser - Netscape, IE and alt tag Format of graphics e.g. use jpeg but not png as not recognised on web by explorer or netscape Web & CD use any format on CD as file size not as bigger issue but jpeg and gif predominantly on web Image quality Pixel size of graphic physical size Be aware that it will never look exactly the same as it does on your monitor settings on monitors are never the same Text as graphics Purpose of graphic. What is it going to be used for? How is it going to be delivered? Balance file size with quality Optimise images for the web