Chapter 9 Quiz
1. If you were going to print a full color
image, which color model would you use?
CMYK because that
is more
2. Which color model should you use for all
graphics on the web?
RGB
3. Is indexed color RGB or CMYK?
RGB
4. How many colors can be in a graphic that
uses the indexed color mode?
256
5. On the screen, what is more important to
how good an image looks (how well “resolved” it is)—the pixels per inch of the image (such as 72 ppi or
144 ppi) or the bit depth of the monitor?
The bit-depth is far more important than pixels
per inch. That’s because the bit-depth governs the amount of colors a monitor
can display. The amount of colors help create a smooth surface on the image.
6. How many colors or shades of gray can an
8-bit graphic display?
8-bit = 2^8 or 2 to
the 8th power. That is equal to 256 colors.
7. How many colors can be displayed in a 24-bit
graphic?
24-bit = 2^24 or 2
to the 24th power. That is equal to 16.7 million colors.
8. If you have an 8-bit monitor, will you
ever see the full color range of 24-bit graphics?
No, because the monitor limits you to 256
colors because an 8-bit monitor will only have the ability to display 2 to the 8th power (2^8) number of colors. A 24-bit monitor can display the number of colors to 2 to the 24th power
(2^24).
9. How many colors can a 16-bit monitor display?
65,536 which is the
same as 2 to the 16th power (2^16).
10. If you set your monitor at a very high
pixel count, does everything look larger or smaller, and why?
It will look smaller
because the number of pixels will increase within the same amount of space.
11. Why can some monitors display more colors
when you set a lower pixel count?
The amount of memory determines how much color
the computer can generate. With monitors that have fewer pixel count, the computer
doesn’t require as much memory to generate the colors.
12. Write the RGB values for a web-safe color.
All RGB values are
either 00, 51, 102, 153, 204, or 255
13. Write the RGB percentages that would create
the same web-safe color in answer #12.
All percentages of
color are either 0, 20, 40, 60, 80, or 100 percent.
14. Write the hexadecimal code that would
create the same web-safe color in answer #13.
All hexadecimal codes
are either 00, 33, 66, 99, cc, or ff.
Chapter 10
Find an example of each of these graphic items.
This tour includes concepts from both the color and the graphic definitions chapters.
A
graphic or background with colors that dither. (If you have a monitor with fewer than 256 colors, everything is probably dithered.
If you have a monitor displaying thousands or millions of colors, you probably won’t find anything dithered. In that
case, change your monitor to 256 colors or fewer so you can see what others might see with an older monitor.)
I changed my monitor to the lowest resolution
possible. I wasn’t able to get it down to 256 colors. The lowest I could get it to was 16-bits, not 8-bits. Nevertheless,
I did see some dithering on graphics on websites such as Apple.com, Yahoo.com and Toyota.com.
An
interlaced GIF image. How do you know it is interlaced?
A GIF image uses solid colors and doesn’t
require all 256 colors. If the image has layers that appear when you are waiting
for the page to load, then you know it is an interlaced GIF image. An interlaced
GIF image would grow from fuzzy to sharp as the data downloads. An interlaced
GIF image will also allow you to scroll down the page and read while the image loads.
Here is an example of an interlaced GIF image
on the left and a non-interlaced GIF image on the left. http://loriweb.pair.com/interex.html
A
JPEG image. What makes you think it’s a JPEG?
A JPEG image is an image that requires 256
or more colors to display correctly. JPEG images are usually photographs or graphics
that has many different blends of colors. http://www.widearea.co.uk/designer/ducks.html
A
graphic with text that is not anti-aliased, or a graphic image that is itself not anti-aliased.
A graphic with text that is not anti-aliased will
have jagged edges. The image on the left from this website http://www.widearea.co.uk/designer/anti.html is not anti-aliased.
A thumbnail image that is linked to a larger
version of the same image. Did the designer tell you how big the larger file is?
http://www.alevans.com/TNailsSystem.html No the designer did not tell
me how big the larger file was. That’s probably because I have DSL and
the picture loads too quickly.
http://www.dpreview.com/gallery/canoneos450d_samples/ This website told me how big the large file was using a caption on the
smaller image.
An image map. Did the designer include an
alternate navigation bar in case the image map wouldn’t work on your browser, or in case you are browsing with your
graphics off?
http://www.nikon.com/ This website has an image
map which allows the visitor to click anywhere on the world to go to the headquarters in that country. There is an alternate navigation bar on the left hand side in case the image map doesn’t work.
A
graphic file that takes so long to download you don’t have the patience to wait for it (unless you have a very fast
connection so you don’t notice).
http://web.canon.jp/imaging/eosd/eos1dsm3/html/eos1dsm3_sample4-e.html This is an example of one
website where full size images are between 8 to 9mb. I have DSL but the images
will still take half a minute to load.
A
useless graphic that doesn’t add to the content, the communication, or the aesthetic value of the page.
I tried and tried but could not find a website
with a useless graphic. I spent an hour on this question alone and didn’t
find anything. My guess is that there are websites out there that have useless
graphics because they are trying to fill empty space on their webpage.
Turn
off the graphics in your browser. Go to some new pages you haven’t seen yet. Are there alternate labels that tell you
what the unloaded graphic is? If the unloaded graphics are links to other pages, are there alternate labels that tell you
where the link will take you?
I couldn’t turn off compressed graphics
in my two browsers Internet Explorer and Opera. This is possible only in the
AOL browser. Perhaps this book is a bit obsolete now.
Keep
your eyes open for progressive JPEGs. You should be using a current browser.
http://home.rochester.rr.com/dougg/progress.htm This website has an example
of a progressive JPEG. Here is another website that has progressive JPEGs samples. http://webstyleguide.com/graphics/jpegs.html
Chapter
10 Quiz
For questions 1 through 4, choose which of
the following images would be best saved as JPEGS or as GIFS – circle your choice.
State the reason why.
1. JPEG – It’s a photograph with many colors.
2. GIF – This would best be saved in this format because it has one color (black).
3. GIF – Because this is a graphic, it is best to save as a GIF
4. GIF – Because this is a graphic, it is best to save as a GIF
5. Which of the following is not an advantage
of a GIF file?
a. unlimited color
6. Which of the following is not an advantage
of a JPEG file?
b. lossless compression
7. Which of the following is not an advantage
of anti-aliasing?
b. smaller file size
8. Name two reasons to use alt labels.
1. Visitors
will know what to expect as the page loads.
2. If
a visitor is surfing without graphics
9. How many separate graphic files does it
take to create the thumbnail-to-larger-image concept? 1 2 3 4
You will need two graphic files. One is for the thumbnail and the other is for the larger image.
