![Page 1: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/1.jpg)
Color And Text
![Page 2: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/2.jpg)
Color Blindness
• Red
• Green
• Blue
![Page 3: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/3.jpg)
United States Results:
http://www.diacenter.org/km/usa/favcol.html
![Page 4: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/4.jpg)
Psychology of Color
•Red
Raises blood pressure
Stimulates aggressive behavior
Stimulates appetite
Encourages conversation
![Page 5: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/5.jpg)
Psychology of Color
•Blue: Lowers blood pressure Calming effect Provides sense of security Appetite suppressant
![Page 6: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/6.jpg)
Psychology of Color
Green Easiest color for the eye to
focus on for long periods of time Soothes pain Strength Safety
![Page 7: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/7.jpg)
Psychology of Color
Orange Stimulates appetite Happiness Confident Adventure Slight elevation in Blood
Pressure
![Page 8: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/8.jpg)
Psychology of Color
•Yellow Satisfying Optimistic Wisdom Not to be trusted – Western
Cultures
![Page 9: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/9.jpg)
Color wheel according to Michel-Eugène Chevreul. Adjacent colors should all show the same difference to each other.
![Page 10: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/10.jpg)
Triadic color scheme
• Pros: Offers high contrast while retaining harmony.
• Cons: Complementary scheme. • Tips:
– Choose one color to be used in larger amounts than others.
– If the colors look gaudy, try to subdue them.
![Page 11: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/11.jpg)
Color wheel according to Ewald Hering.
![Page 12: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/12.jpg)
Tetradic Color Scheme
• Pros: The tetradic scheme offers more color variety than any other scheme.
• Cons: This scheme is the hardest scheme to balance.
• Tips:– If the scheme looks unbalanced, try to
subdue one or more colors.– Avoid using primary colors in equal amounts.
![Page 13: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/13.jpg)
http://www.toledo-bend.com/colorblind/Ishihara.html
![Page 15: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/15.jpg)
Issues of ColorText
Text
Text
Text
http://www.colormatters.com/
Red/Green
Yellow-/Blue
Black/White
Blue/Green
Text
Text
Text
Text
![Page 16: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/16.jpg)
Color Design Remedies
1. Exaggerate differences between foreground
and background colors
2. Avoid using colors of similar lightness
adjacent to one another
3. Design for maximum contrast Test your pages by printing in black and white.
![Page 17: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/17.jpg)
<html><head>
<title>Data</title></head><body> This is a paragraph. Copy and paste this paragraph into your document three times. Thiswill allow you to work with the tags displayed on theprevious screen. Good luck!!!<!--This text will not appear within the window-->Jetaway Travel
</body></html>
![Page 18: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/18.jpg)
Opening Tag Closing Tag Purpose _________________________________________________ <p> </p> Marks the end of a
paragraph -- doublespacing
<br> (closing Single space -- tag not used) carriage return
<blockquote> </blockquote> Indented paragraph
![Page 19: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/19.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><p>Jetaway Travel is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be!</p>
Call now for special pricing! <br>
1-800-555-1234</body></html>
![Page 20: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/20.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><blockquote> Jetaway Travel is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be!</blockquote>
Call now for special pricing! <p>
1-800-555-1234</body></html>
![Page 21: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/21.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><p><h1>Jetaway Travel </h1>is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be! </p>
Call now for special pricing! <br>
1-800-555-1234</body></html>
![Page 22: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/22.jpg)
Opening Tag Closing Tag Purpose _________________________________________________ <h1> </h1> Largest Size Heading
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6> Smallest Size Heading
Heading Font Size
![Page 23: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/23.jpg)
Text Alignment
Opening Closing Purpose Tag Tag_________________________________________________ <div align=“alignment> </div> Left, Center, Middle,
and Right
![Page 24: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/24.jpg)
Opening Tag Closing Tag Purpose _________________________________________________ <b> </b> Bold
<strong> </strong > Bold
![Page 25: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/25.jpg)
Opening Tag Closing Tag Purpose _________________________________________________ <i> </i> Italics
<em> </em> Italics
<cite> </cite> Italics
<address> </address> Italics with line breaks
![Page 26: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/26.jpg)
Opening Tag Closing Tag Purpose _________________________________________________ <strike> </strike> TEXT
<u> </u> UNDERLINE
<blink> </blink> MonzillaBLINKING
<sub> </sub> SUBSCRIPT
<code> </code> FIXED WIDTHFONT
![Page 27: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/27.jpg)
<HTML><HEAD><TITLE>My title</TITLE></HEAD><BODY> <!--Main Body--><p><i><b>Jetaway Travel</b></i>is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be! </p>Call now for special pricing! <br>1-800-555-1234</BODY></HTML>
![Page 28: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/28.jpg)
Space Maintaining Tags
• <br> - line break
• <pre> - preformatted (registrar and shows carriage returns)
• <p></p> - paragraph
• <ul></ul> - indent
• - non-breaking space
![Page 29: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/29.jpg)
Text Size
Opening Closing Purpose Tag Tag_________________________________________________ <font size=“#”> </font> Relative to
default text-2 to +4
<big> </big>
<small> </small>
![Page 30: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/30.jpg)
<font>
<font size>Absolute value 1 2 3 4 5 6 7
Relative value -2 -1 - +1 +2 +3 +4
Advantage - control over font size
Disadvantage - overrides viewer wants and needs
![Page 31: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/31.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><p><i><b> Jetaway Travel</b></i>is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be! </p>Call now for special pricing! <br>1-800-555-1234<!--Copyright footer--><p><font size=“-1”>Thesepages are copyright 2000 by Jetaway Travel, Inc.</font></body></html>
![Page 32: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/32.jpg)
Name of Color Attributes
Opening Closing Purpose Tag Tag_________________________________________________ <font color=“name”> </font> State
Color<font color=“#hex”> </font>
![Page 33: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/33.jpg)
Colored Text
HEX Color HEX Color _________________________________________________ FFFFFF White 008000 Green000000 Black 00FF00 LimeC0C0C0 Silver FFFF00 Yellow808080 Grey 808000 OliveFF0000 Red 000080 Navy800000 Maroon 0000FF Blue800080 Purple 008080 TealFF00FF Fuchsia 00FFFF Aquahttp://www.w3schools.com/css/css_colornames.asp
![Page 34: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/34.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><p><i><b>Jetaway Travel</b></i>is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be! </p><i> Call now for <font color=“red”>special</FONT> pricing!</i><br>1-800-555-1234<!--Copyright footer--><p><font size=“-1”>Thesepages are copyright 2000 by Jetaway Trove, Inc.</font></body></html>
![Page 35: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/35.jpg)
<i>call now for <font face="arial,helvetica" size=2>
<font color=“red”>special</font> </font> pricing!</i><br>
![Page 36: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/36.jpg)
Fonts• Avoid decorative
![Page 37: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/37.jpg)
Fonts• Avoid decorative
B
![Page 38: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/38.jpg)
Special Characters
Symbol Example HTM Code _________________________________________________ Copyright c © or ©
Trademark TM ™
Registered r ®Trademark
Non-breaking @ Space
![Page 39: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/39.jpg)
<html><head><title>my title</title></head><body> <!--Main Body--><p><i><b>Jetaway Travel</b></i>is your one source for all your travel needs. From tickets to travel information, we can help make your vacation the best it can be! </p><i> Call now for <font color=“red”>special</font> pricing!</i><br>1-800-555-1234<!--Copyright footer--><p><font size=“-1”>Thesepages are copyright © 2000 by Jetaway Trove, Inc.</font></body></html>
![Page 40: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/40.jpg)
Optimal Line Length
• Min 3.6 inches
• Max 4 inches– Standard is base on normal size font (12) – CSS pix 14-16
![Page 41: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/41.jpg)
<html>
<head>
<script>
function changeFontSize(element,step)
{
step = parseInt(step,10);
var el = document.getElementById(element);
var curFont = parseInt(el.style.fontSize,10);
el.style.fontSize = (curFont+step) + 'px';
return;
}
</script>
</head>
<body>
<p>
<a href="javascript:void(0);" onclick="changeFontSize('content','2');">Increase font</a>
<a href="javascript:void(0);" onclick="changeFontSize('content',-2);">Decrease font</a>
</p>
<p id="content" style="font-size:12px;">
My name is Sherlock Holmes. It is my business to know what other people don't know.
</p>
</body>
</html>
http://www.vijayjoshi.org/2009/04/02/changing-font-size-on-a-page-with-javascript-for-better-user-experience/
![Page 42: Color And Text. Color Blindness Red Green Blue United States Results:](https://reader036.vdocuments.us/reader036/viewer/2022062409/56649e9f5503460f94ba110a/html5/thumbnails/42.jpg)
* WWW References:
Dutton, Frank. “Ishihara Test for Color Blindness” < http://www.toledo-bend.com/colorblind/Ishihara.asp > (8, Aug. 2009).
“Factors influencing the design and layout of manuals and other published material.” <http://www.rightwords.co.nz/layout.html> (4, Feb. 2007).
Georgia Tech Research Corporation.” GVU's 10th WWW User Survey.”<http://www.gvu.gatech.edu/user_surveys/survey-1998-10/>
(5, Dec. 2004).
“Komar & Melamid: The Most Wanted Paintings on the Web.”<http://www.diacenter.org/km/usa/favcol.html >
(21, June 2009).