Name: 
 

IT125SS17 Study Guide - Chaps4-6 Visual Elements, Web Design, & Page Layout



ins002-1.jpgThis Study Guide is organized with questions grouped as follows: MC and Matching.  The questions are drawn from questions at the end of each chapter, the author’s Test Bank, and lecture. 
This constitutes the “test bank” for Quiz 2.
Select answers using the pull-down windows in the boxes to left of each question (do not use roller-wheel on mouse as it will shift answers). 
All questions have equal weight. 
When completed, select the "Check Answers" button at the bottom of the Webpage.  Results are returned only to you.  You may change selections anytime prior to completing Study Guide and you may take as often as desired.

Multiple Choice
Identify the letter of the choice that best completes the statement or answers the question.
 

 1. 

Chapter 4 Multiple Choice Questions
Choose the item that creates an image link to the school.htm page when the school.gif graphic is clicked.
a.
<a href="school.html" src="school.gif" alt="school"></a>
b.
<a href="school.html"><img src="school.gif" alt="school"></a>
c.
<img src="school.gif" href="school.htm" alt="school">
d.
none of the above
 

 2. 

Select the best reason to include height and width attributes on an <img> tag.
a.
they are required attributes and must always be included
b.
to help the browser render the page faster because it reserves the appropriate space for the image
c.
to help the browser display the image in its own window
d.
none of the above
 

 3. 

Select the browser’s action when you configure BOTH a background color and background image for the body selector.
a.
display the background color instead of the background image
b.
will display no background for the page because it is “confused”
c.
display the background color while the background image loads and before the background image is displayed
d.
you cannot configure both a background color and a background image
 

 4. 

Select the tag used to place an image on a web page.
a.
<a href>
b.
<img>
c.
<image>
d.
<graphic>
 

 5. 

Choose the attribute used to provide accessibility by configuring a text alternative that is available to browsers and other user agents that do not support graphics.
a.
alt
b.
text
c.
src
d.
none of the above
 

 6. 

A type of graphic that is best-suited to photographs is:
a.
jpg
b.
photo
c.
gif
d.
none of the above
 

 7. 

A type of graphic that can be made transparent and is commonly used on the Web is:
a.
gif
b.
jpg
c.
bmp
d.
photo
 

 8. 

The Web Safe Color Palette is a collection of 216 colors that______.
a.
display quicker than other colors
b.
display the most similar on both the Mac and PC platforms
c.
relate to the fashion industry and change each year
d.
none of the above
 

 9. 

Choose the color below that is considered a Web Safe Color:
a.
#0045CC
b.
#653456
c.
#000044
d.
#33FF99
 

 10. 

Use the ___________________ property to resize or scale the background image.
a.
background-image
b.
background-clip
c.
background-origin
d.
background-size
 

 11. 

When a web page uses graphics for the main navigation links, provide accessibility by:
a.
using alt attributes
b.
providing text links on the bottom of the page
c.
both a and b
d.
none of the above
 

 12. 

A smaller version of a larger image that usually links to the larger image is called a:
a.
hyperlink
b.
thumbnail image
c.
small image
d.
none of the above
 

 13. 

Choose recommended methods to obtain graphics for your web site.
a.
Purchase a CD of graphics
b.
Use a graphics application and create your own 
c.
Right click and copy a graphic you like from any web site
d.
both a and b
 

 14. 

A(n) ________ is an image that is configured so that parts of the image can be used as one or more hyperlinks. 
a.
image map
b.
hyperimage
c.
navigation image
d.
none of the above
 

 15. 

The tag used to create a horizontal line on a web page is:
a.
<hl>
b.
<br>
c.
<hr>
d.
<line>
 

 16. 

Select the code below that will configure a background image called parchment.gif for a web page using CSS.
a.
body {background-image:url(parchment.gif); }
b.
document {background:parchment.gif; }
c.
body {background:parchment.gif’}
d.
None of the above
 

 17. 

Select the code below that uses CSS to eliminate the default border on an image configured as an image link.
a.
a {border: 0; }
b.
img {border: 0; }
c.
img {border-style: none; }
d.
None of the above
 

 18. 

The _____ element displays a visual gauge of a numeric value within a known range.
a.
progress
b.
meter
c.
border
d.
hr
 

 19. 

The _______ is the area between the content and the border. 
a.
border
b.
spacing
c.
padding
d.
none of the above
 

 20. 

Select the code below that configures a background image to repeat horizontally across a web page.
a.
hspace="10"
b.
background-repeat: repeat-x;
c.
valign="left"
d.
background-repeat: repeat-y;
 

 21. 

Select the code below that associates a favorites icon named favicon.ico with a web page document.
a.
<link rel="icon" type="image/x-icon" href="favicon.ico">
b.
<img href="favicon.ico" alt="favorites" width="16" height="16">
c.
<a href=”favicon.ico”> <img href="favicon.ico" alt="favorites" width="16" height="16"></a>
d.
<link rel="favicon" type="image/gif" href="favicon.ico">
 

 22. 

Choose the item below that describes the process of creating an image with the lowest file size that still renders a good quality image.
a.
validation
b.
multimedia
c.
optimization
d.
bandwidth
 

 23. 

The process of ensuring that web pages coded with new or advanced techniques still are usable in browsers that do not offer support for the newer features is called:
a.
validation
b.
valid enhancement
c.
progressive enhancement 
d.
optimization
 

 24. 

Use the _______ property to configure multiple backgrounds on an element.
a.
multiple-background
b.
multiple
c.
background
d.
backgrounds
 

 25. 

Use the _______ property to configure multiple backgrounds on an element.
a.
if you omit them, the browser won’t display the image.
b.
the browser will be more efficient and the page will load faster.
c.
they are required to pass W3C HTML validation.
d.
they are required to pass W3C CSS validation.
 

 26. 

The HTML5 ______ element visually displays a bar that depicts a numeric value within a specified range. 
a.
progress
b.
meter
c.
time
d.
section
 

 27. 

Use the ________________ property to configure rounded corners with CSS.
a.
border-round
b.
border-radius
c.
box-shadow
d.
background-corner
 

 28. 

The CSS3 _______ property configures the transparency of an element.
a.
opacity
b.
transparency
c.
background-opacity
d.
opacity-background
 

 29. 

A _________________ is a smooth blending of shades from one color to another.
a.
transition
b.
transform
c.
shadow
d.
gradient
 

 30. 

The letters in the acronym HSLA indicate:
a.
hue, selection, lightness, alpha
b.
hue, saturation, luminosity, alpha
c.
hue, saturation, lightness, alpha
d.
hue, shade, luminosity, alpha
 

 31. 

Use the ________________ property to confine the display of the background image.
a.
background-image
b.
background-clip
c.
background-origin
d.
background-size
 

 32. 

Use the ___________________ property to resize or scale the background image.
a.
background-image
b.
background-clip
c.
background-origin
d.
background-size
 

 33. 

Chapter 4 text Multiple Choice Questions
Which of the following graphic types can be made transparent?
a.
GIF
b.
JPG
c.
BMP
d.
PHOTO
 

 34. 

Which of the following configures empty space between the content of the HTML element (typically text) and the border?
a.
vspace property
b.
padding property
c.
margin property
d.
border property
e.
none of the above
 

 35. 

Which of the following creates an image link to the index.html page when the home.gif graphic is clicked?
a.
<a href="index.html" src="home.gif"alt="Home"></a>
b.
<a href="index.html"> <img src="home.gif" alt="Home"></a>
c.
<img src="home.gif" href="index.html" alt="Home">
d.
<a href="index.html"> <img href="home.gif" alt="Home"></a>
 

 36. 

What is the purpose of coding height and width attributes on an <img> tag?
a.
They are required attributes and must always be included.
b.
They help the browser render the page faster because it reserves the appropriate space for the image.
c.
They help the browser display the image in its own window.
d.
none of the above
 

 37. 

Which attribute specifies text that is available to browsers and other user agents that do not support graphics?
a.
alt
b.
text
c.
src
d.
none of the above
 

 38. 

What is the term used to describe a square icon that is associated with a web page and is displayed in the browser address bar or tab?
a.
background
b.
bookmark icon
c.
favicon
d.
logo
 

 39. 

Which HTML tag configures a horizontal line on a web page?
a.
<line>
b.
<br>
c.
<hr>
d.
<border>
 

 40. 

Which of the following configures a graphic to repeat vertically down the side of a web page?
a.
hspace="10"
b.
background-repeat:repeat;
c.
valign="left"
d.
background-repeat: repeat-y;
 

 41. 

Chapter 5 Multiple Choice Questions
Select the three most common methods of organizing websites.
a.
horizontal, vertical, and diagonal
b.
hierarchical, linear, and random
c.
accessible, readable, maintainable
d.
none of the above
 

 42. 

Select the recommended design practice that applies to a website using images for main site navigation.
a.
provide alternative text for the images
b.
place text links at the bottom of the page
c.
both a and b
d.
no special considerations are needed
 

 43. 

Consider _______ when designing for display on a mobile device. 
a.
small screen size
b.
font size
c.
contrast
d.
all of the above
 

 44. 

Which of the following is not a web design recommended practice?
a.
design your site to be easy to navigate
b.
use frames whenever possible
c.
design your pages to load quickly
d.
limit the use of animated items 
 

 45. 

Select the item below that does not belong in a consistent website design.
a.
the same fonts on each content page
b.
the same logo in the same location on each content page
c.
a similar navigation area on each content page
d.
a different background color on each page
 

 46. 

Select the items below that can help to appeal to the intended or target audience of a site.
a.
the amount of color used on the site
b.
the font size and styles used on the site
c.
the overall look and feel for the site
d.
all of the above
 

 47. 

Chapter 5 text Multiple Choice Questions
Which of the following are the three most common methods for organizing websites?
a.
horizontal, vertical, and diagonal
b.
hierarchical, linear, and random
c.
accessible, readable, and maintainable
d.
none of the above
 

 48. 

Which of the following are the four principles of the Web Content Accessibility Guidelines?
a.
repetition, contrast, proximity, and alignment
b.
perceivable, operable, understandable, and robust
c.
accessible, readable, maintainable, and reliable
d.
hierarchical, linear, random, and sequential
 

 49. 

Which of the following would a consistent website design NOT have?
a.
a similar navigation area on each content page
b.
the same fonts on each content page
c.
a different background color on each page
d.
the same logo
 

 50. 

Which of the following are influenced by the intended or target audience of a site?
a.
the amount of color used on the site
b.
the font size and styles used on the site
c.
the overall look and feel of the site
d.
all of the above
 

 51. 

Which of the following is known as white space?
a.
the empty screen area around blocks of text and images
b.
the background color of white used for a page
c.
configuring the color of the text to be white
d.
none of the above
 

 52. 

Which of the following should you do when creating text hyperlinks?
a.
Create the entire sentence as a hyperlink.
b.
Include the words “Click here” in your text.
c.
Use a key phrase as a hyperlink.
d.
none of the above
 

 53. 

Which of the following is a color scheme that consists of two colors that are opposite each other on the color wheel?
a.
analogous
b.
complementary
c.
split complementary
d.
contrasting
 

 54. 

Chapter 6 Multiple Choice Questions
To apply a style to one or more elements on a web page, configure a CSS _____________.
a.
group
b.
id
c.
class
d.
none of the above
 

 55. 

The _______ is the area between the content and the border.
a.
border
b.
spacing
c.
padding
d.
none of the above
 

 56. 

The box model consists of a content area surrounded by:
a.
a border
b.
padding, border, and margin
c.
border and margin
d.
spacing, border, and margin
 

 57. 

_________ flow displays the elements on the page in the order they appear in the web page source code.
a.
default
b.
source code
c.
browser
d.
normal
 

 58. 

Use ___________ positioning to slightly change the location of an element in relation to where it would otherwise appear when rendered by a browser.
a.
absolute
b.
float
c.
relative
d.
display
 

 59. 

The CSS to create the class called myfloat that floats to the right of the other page content, has a 10px margin, and a solid border is:
a.
.myfloat { float:right; margin:10px; border: 1px solid #000000; }
b.
#myfloat { right:float: margin 10px; border: 1px solid #000000; }
c.
.myfloat { float:right; 10px:margin; border: 1px solid #000000; }
d.
.myfloat { float:right; margin:10px; border: on; }
 

 60. 

The default value for the border property for an element is:
a.
1 pixel
b.
0 pixels
c.
3 pixels
d.
10 pixels
 

 61. 

When using the box model, the _____ is always transparent.
a.
border
b.
content
c.
spacing
d.
margin
 

 62. 

If an element is configured with ___________ the other content on the page will appear to its left.
a.
position:left;
b.
position:relative;
c.
float:left;
d.
float:right;
 

 63. 

Use an id to configure a style when:
a.
the style could apply to more than one element on a page.
b.
the style will apply to only one element on a page.
c.
the style is used for all elements on a page.
d.
none of the above
 

 64. 

Which of the following configures a margin for an element with the following values: top margin 30 pixels, left margin 150 pixels, right margin 0 pixels, and bottom margin 0 pixels?
a.
margin: 150px 20px 0 300px;
b.
margin:top-30, left-150, right-0, bottom-0;
c.
margin:30px 0 0 150px;
d.
none of the above
 

 65. 

Use the ________ property along with the left, right and/or top property to precisely configure the position of an element.
a.
position:absolute;
b.
position:relative;
c.
position:float;
d.
absolute:position;
 

 66. 

Use the ________ or _______ property to clear a float.
a.
float or clear
b.
clear or overflow
c.
position or clear
d.
overflow or float
 

 67. 

Choose the example below that configures a comment in CSS.
a.
<! comment !>
b.
// comment //
c.
/* comment */
d.
<< comment >>
 

 68. 

Select the example below that could be used to clear a right float.
a.
clear: right;
b.
clear: left;
c.
right: clear;
d.
overflow: right;
 

 69. 

Select the example below that configures a container to clear all floated elements that are within the container.
a.
clear: both;
b.
overflow: all;
c.
overflow: auto;
d.
clear: all;
 

 70. 

When configuring the background color of an element, the background color is applied to both the content and ______ areas.
a.
border
b.
padding
c.
margin
d.
extra
 

 71. 

Use the _______________ property to configure an image to use as a bullet point in an unordered list.
a.
bullet-image
b.
image-style
c.
list-style-image
d.
bullet-style-image
 

 72. 

From the choices below select the correct order to code CSS pseudo-classes.
a.
link, hover, visited, active
b.
hover, link, active, visited
c.
link, visited, hover, active
d.
link, hover, active, visited
 

 73. 

Set list-style-type to the value ___________ to hide the display of the list markers on an ordered list.
a.
none
b.
hide
c.
invisible
d.
nodisplay
 

 74. 

The _______ pseudo-class configures the styles that will apply when the mouse is on a hyperlink.
a.
hover
b.
click
c.
active
d.
over
 

 75. 

Choose the HTML5 element below that is used to configure an area on a web page that can stand on its own and could potentially be syndicated.
a.
div
b.
section
c.
article
d.
aside
 

 76. 

The ________ HTML5 element is used to contain tangential or supplemental content.
a.
header
b.
main
c.
aside
d.
section
 

 77. 

Choose the item below that is not an HTML5 element.
a.
footer
b.
figure
c.
wrapper
d.
article
 

 78. 

Use ___________ positioning to configure the location of an element to remain the same and to not move even when the web page is scrolled within the browser viewport.
a.
absolute
b.
static
c.
relative
d.
fixed
 

 79. 

The CSS universal selector is indicated by which of the following symbols?
a.
%
b.
#
c.
?
d.
*
 

 80. 

Chapter 6 Multiple Choice text Questions
Which of the following, from outermost to innermost, are components of the box model?
a.
margin, border, padding, content
b.
content, padding, border, margin
c.
content, margin, padding, border
d.
margin, padding, border, content
 

 81. 

Which of the following can be used to change the location of an element slightly in relation to where it would otherwise appear on the page?
a.
relative positioning
b.
the float property
c.
absolute positioning
d.
this cannot be done with CSS
 

 82. 

Which of the following properties can be used to clear a float?
a.
float or clear
b.
clear or overflow
c.
position or clear
d.
overflow or float
 

 83. 

Which of the following configures a class called side to float to the left?
a.
.side { left: float; }
b.
.side { float: left; }
c.
.side { float-left: 200px; }
d.
.side { position: left; }
 

 84. 

Which of the following is the rendering flow used by a browser by default?
a.
regular flow
b.
normal display
c.
browser flow
d.
normal flow
 

 85. 

Which of the following is an example of using a descendant selector to configure the anchor tags within the nav element?
a.
nav. a
b.
a nav
c.
nav
d.
a#nav
 

 86. 

Which property and value are used to configure an unordered list item with a square list marker?
a.
list-bullet: none;
b.
list-style-type: square;
c.
list-style-image: square;
d.
list-marker:
 

 87. 

Which of the following causes an element to display as a block of content with white space above and below?
a.
display: none;
b.
block: display;
c.
display: block;
d.
display: inline;
 

 88. 

Which of the following pseudo-classes is the default state for a hyperlink that has been clicked?
a.
:hover
b.
:link
c.
:onclick
d.
:visited
 

 89. 

Which HTML5 element has the purpose of providing tangential content?
a.
article
b.
aside
c.
sidebar
d.
section
 

Matching
 
 
Match each phrase to the acronym or term of the corresponding technology.
a.
A background image will automatically be repeated, or _______________, by a web browser.
b.
If your web page uses graphic links, include _______________ at the bottom of the page to increase accessibility.
c.
The _______________ CSS3 property configures a drop-shadow effect on an HTML element.
d.
The most common structure used for commercial websites is ____________ organization.
e.
All browsers and browser versions ____________ display web pages in exactly the same way.
f.
The ____________ is a group whose mission is to create guidelines and standards for web accessibility.
g.
Configure a style with a(n) ____________ if the
style will only apply to one element on a page.
h.
The __________________ is always transparent.
i.
The ___________ pseudo-class can be used to modify the display of a hyperlink when a mouse pointer passes over it.
j.
15. Use the HTML5 _________ element to configure an article or blog post that can stand on its own.
k.
12. If an element is configured with float: right;, the other content on the page will appear to its __________________.
 

 90. 

tiled
 

 91. 

text links
 

 92. 

box-shadow
 

 93. 

hierarchical
 

 94. 

do not
 

 95. 

Web Accessibility Initiative (WAI)
 

 96. 

id
 

 97. 

margin
 

 98. 

:hover
 

 99. 

article
 

 100. 

left
 



 
Check Your Work     Start Over