Name:
Class:
Date:
True / False
1. Testing a website’s layout and functionality using your own computer and a browser gives you a reasonable sense of
how quickly a published site responds to user interaction over the Internet.
a.
True
b.
False
False
1
432
2. You can optimize several aspects of your code to ensure that your content is available as quickly as possible to users
who want to access it.
a.
True
b.
False
True
1
432
3. The best way to test the usability of your website is by using the website yourself.
a.
True
b.
False
False
1
434
4. If you are developing on a Mac, it’s important to ensure that you have access to a Windows system for testing.
a.
True
b.
False
True
1
436
5. Optimizing page load time is important for mobile users but does not impact desktop users.
a.
True
b.
False
False
1
438
6. To implement a spritesheet, you use image editing software to break up a single image into multiple smaller images.
a.
True
b.
False
False
1
7. You can reduce the size of some image files that are part of your website without affecting their content.
a.
True
b.
False
True
1
442
8. Removing orphaned styles reduces the amount of code users have to download.
a.
True
b.
False
True
1
444
9. Minified CSS files are no more difficult for a human to read than unminified files.
a.
True
b.
False
False
1
446
10. Creating a custom build of Modernizr can increase the speed at which your site downloads.
a.
True
b.
False
True
1
446
Modified True / False
11. Browsers generally limit the number of files that can be requested from a single server
simultaneously. _________________________
True
1
432
12. A spritesheet enables multiple images to be retrieved with a single HTML request. _________________________
False – HTTP, Hypertext Transfer Protocol
1
432
13. To ensure that your questions don’t vary between usability testers, it’s considered a good practice to create a script and
to use it consistently throughout the testing process. _________________________
440
Name:
Class:
Date:
14. No matter what the audience for your website, the majority of users are likely to be using the Linux operating system.
_________________________
15. Chrome Device Mode includes a utility that lets you view a simulation of a web page loading at different connection
speeds._________________________
16. To use a spritesheet on a web page, you specify it as the background color for multiple
elements. _________________________
17. Event when an image is at the correct size for your web page, it’s often possible to reduce the file size by reducing the
depth of the image in a way that humans can’t perceive. _________________________
18. Adopted styles are style rules based on selectors that no longer apply to any elements on your web
pages. _________________________
19. Validating CSS removes all unnecessary characters, which reduces file size. _________________________
20. A version of a library that includes only the features your site uses is known as a custom build.
_________________________
Name:
Class:
Date:
Multiple Choice
21. By simulating loading your web page at different connection speeds, you can test its __________.
a.
validity
b.
search rank
c.
orphaned styles
d.
performance
d
1
432
22. Which of the following is out of your control as a developer?
a.
the size of embedded files
b.
the size of linked files
c.
the number of HTTP requests
d.
a user’s Internet connection speed
d
1
432
23. Using a web application to remove spaces and comments from JavaScript code is an example of __________.
a.
removing orphaned styles
b.
minifying
c.
creating a custom build
d.
optimizing
b
432
24. Orphaned styles are styles that
a.
apply to more than one web page.
b.
no longer apply to any elements on your web pages.
c.
duplicate other styles.
d.
are part of both external and embedded style sheets.
b
1
432
25. __________ image files compresses them without losing significant visual information.
a.
Validating
b.
Cropping
c.
Optimizing
d.
Minifying
1
432
26. You can reduce the download size of your website by creating a custom build of any __________ your site uses.
a.
image
b.
style sheet
c.
JavaScript library
d.
HTML document
Name:
Class:
Date:
1
432
27. When a browser requests files from a web server, it uses __________.
a.
File Transfer Protocol (FTP)
b.
Hypertext Transfer Protocol (HTTP)
c.
RealTime Transport Protocol (RTP)
d.
Dynamic Host Configuration Protocol (DHCP)
b
1
432
28. Browsers generally limit the number of __________ that can be requested from a single server simultaneously.
a.
bytes
b.
lines of code
c.
files
d.
favicons
1
432
29. Developers reduce the amount of time required to wait for file requests by __________.
a.
using fewer styles.
b.
reducing the number of images on each page.
c.
eliminating the use of JavaScript libraries.
d.
combining files of the same type into a single file.
d
1
432
30. A spritesheet contains multiple __________.
a.
JavaScript libraries
b.
style sheets
c.
HTML documents
d.
images
d
1
432
31. When you conduct a usability test, the person conducting the test is generally __________
a.
in the room with the user.
b.
behind mirrored glass watching the user.
c.
using a computer while the user watches.
d.
not involved in the test itself.
435
32. In a usability test, the user __________.
Name:
Class:
Date:
a.
observes from behind mirrored glass.
b.
reads a script.
c.
observes what the tester does.
d.
sits at a computer and attempts to complete tasks.
1
435
33. Any improvements that cause your pages to load more quickly can help __________.
a.
reduce the sizes of files that are part of your website.
b.
avoid users becoming impatient with your site as it loads.
c.
reduce the number of files that browsers must download.
d.
make your site’s images less complex.
1
438
34. It can be useful to test your website at different connection speeds to see __________.
a.
how many files it contains.
b.
how quickly it might load for different users.
c.
its total download size.
d.
how many JavaScript libraries it uses.
b
1
35. Chrome Device Mode includes a utility that __________.
a.
lets you view a simulation of a web page loading at different connection speeds.
b.
shows the total file size of your website.
c.
suggests files you can combine to speed downloads.
d.
ensures that all users can download your site at the highest available connection speed.
438
36. In Chrome Device Mode, the maximum amount of data that a connection can carry per second is measured in
__________.
a.
milliseconds
b.
number of files
c.
megahertz (MHz)
d.
megabits per second (Mbps)
d
1
37. In Chrome Device Mode, the maximum time from a request being sent to data being returned from the server is
measured in __________.
a.
milliseconds
b.
number of files
Name:
Class:
Date:
c.
megahertz (MHz)
d.
megabits per second (Mbps)
38. Because a spritesheet is a single image file, __________.
a.
you can use it in only one location on a web page.
b.
you can download it with a single HTTP request.
c.
you must redesign your web pages to use fewer images.
d.
it has no effect on your website’s performance.
39. To create a spritesheet, you use __________.
a.
image editing software.
b.
Chrome Device Mode
c.
any web browser
d.
an image optimization tool
40. You can perform basic CSS minification manually by deleting all line breaks from the code and __________.
a.
removing all semicolons.
b.
eliminating all colons.
c.
taking out every instance of the apostrophe and quote characters.
d.
deleting all spaces between curly braces.
41. It is common to download and include the entire Modernizr library during the process of building a site because
__________.
a.
the features you incorporate into your website can change as you develop it.
b.
you must have the entire library to use Modernizr on a local machine.
c.
you have to test the entire library on a variety of connection speeds.
d.
the entire library is necessary unless your site includes spritesheets.
42. You create a custom build of Modernizr by __________.
a.
minifying the modernizr.js file.
b.
using a configuration tool on the modernizr.com website.
Name:
Class:
Date:
c.
removing orphaned styles from the modernizr.js file.
d.
using Chrome Device Mode.
43. Properties for the images in a spritesheet are usually generated __________.
a.
by trial and error.
b.
during the process of image optimization.
c.
with a pixel ruler.
d.
using third-party software.
44. You should use spritesheets only for decorative images because __________.
a.
the dimensions of the spritesheet would be too large if it included all images.
b.
the filesize of the spritesheet would be too large if it included all images.
c.
you can’t specify alt text for a spritesheet.
d.
only decorative images can be optimized.
Name:
Class:
Date:
45. Referring to the figure above, combining the styles1.css and styles2.css files into styles.css is an example of
__________.
a.
removing orphaned styles.
b.
reducing the number of HTTP requests.
c.
minifying CSS files.
d.
implementing spritesheets.
b
1
433
46. Referring to the figure above, the files listed on the left side of the figure represent __________ HTTP requests.
a.
7
b.
1
c.
3
d.
4
1
433
47. Referring to the figure above, the files listed on the right side of the figure represent __________ HTTP requests.
a.
3
b.
1
c.
7
d.
0
1
Name:
Class:
Date:
48. Referring to the figure above, combining image1.png through image4.png into images.png is an example of
__________.
a.
optimizing images
b.
implementing a spritesheet.
c.
minifying CSS files.
d.
removing orphaned styles.
49. Referring to the figure above, the figure illustrates using __________.
a.
image optimization
b.
a minifier
c.
a custom build
d.
a spritesheet
50. Referring to the figure above, the image is referenced in the code for the web page using the __________.
a.
<img> tag
b.
background–position property
c.
background–image property
d.
background property
Name:
Class:
Date:
51. Referring to the figure above, the code on the right side has been ____.
a.
minified
b.
optimized
c.
validated
d.
customized
1
445
52. Referring to the figure above, one type of character that is included on the left side but not on the right is the
__________.
a.
hyphen ( – )
b.
comma ( , )
c.
space
d.
semicolon ( ; )
445
53. Referring to the figure above, one type of code that is included on the left side but not on the right is a(n) __________.
a.
style rule
b.
comment
c.
declaration
d.
selector
b
1
445
Case-Based Critical Thinking Question
Name:
Class:
Date:
Cedric is a web developer who works with a graphic design team to create websites for small and medium sized
businesses. Before finalizing his current project, he tests the loading speed for each page.
54. Cedric can’t easily test at multiple connection speeds, so he uses a tool such as __________.
a.
W3C Validation Service
b.
an online image optimizer
c.
Chrome Device Mode
d.
an online minifier
1
438
Critical Thinking
55. To test at low speeds, Cedric simulates downloading the site using the lowest connection speed supported by many
wireless carriers, which is known as __________.
a.
DSL
b.
Regular 3G/Good 3G
c.
Regular 4G
d.
Regular 2G/Good 2G
d
1
438
Critical Thinking
56. To test at a fast mobile speed, Cedric simulates downloading the site using modern wireless technology such as LTE,
which is also known as __________.
a.
DSL
b.
Regular 4G
c.
Regular 3G/Good 3G
d.
WiFi
b
1
438
Critical Thinking
57. Cedric simulates the experience of a user at home or at work on a local wireless connection, which is also known as
__________.
a.
WiFi
b.
Regular 2G/Good 2G
c.
GPRS
d.
Regular 4G
1
438
Critical Thinking
Case-Based Critical Thinking Question
Risa has created a website for her interior decorating business. Before the publishes the site, she is making changes to
improve its performance.
58. Risa is combining 3 decorative images into a spritesheet. After she incorporates the spritesheet into her website, how
many HTTP requests will be necessary to download all the images in the spritesheet?
a.
0
b.
1
Name:
Class:
Date:
c.
2
d.
3
1
Critical Thinking
59. Risa uses image editing software to generate CSS code for each image in the spritesheet. The code specifies the
dimensions of each element using the __________ .
a.
background–position property
b.
background–image property
c.
background property
d.
width and height properties
d
441
60. The CSS code for placing an image from Risa’s spritesheet uses the __________ to set a starting point for the image
within the spritesheet.
a.
background–position property
b.
background–image property
c.
background property
d.
width and height properties
Critical Thinking
Completion
61. The measure of how quickly a published site loads and responds to user interaction over the Internet is known as the
site’s __________.
performance
62. In a usability test, the user sits at a(n) __________ and attempts to complete the tasks requested by the person
conducting the test.
computers
63. Both __________ and iOS phones are used by significant numbers of people, so testing on the most widely used
versions of these mobile operating systems is important.
1
64. By reducing the number of __________ downloaded and their size, you can improve your site’s performance for all
users.
ANSWER:
files
POINTS:
1
438
65. To use a spritesheet on a web page, you specify it as the __________ image for multiple elements.
background
POINTS:
1
66. Even when a(n) __________ is at the correct size for your web page, it’s often possible to reduce the file size by
reducing its quality in a way that humans can’t perceive, a process known as optimization.
ANSWER:
image
1
REFERENCES:
442
67. Creating a custom __________ of the Modernizr library reduces the size of the file that users have to download.
ANSWER:
build
POINTS:
1
446
Matching
Match each statement with the appropriate term.
a.
minified
b.
optimized
c.
orphaned style
d.
custom build
e.
spritesheet
REFERENCES:
432
68. a version of a library that includes only the features that your site uses
d
POINTS:
1
69. describes an image file that is as compressed as possible without losing significant visual information
b
POINTS:
1
70. a single image file that includes multiple smaller images arranged side-by-side or in a grid
ANSWER:
POINTS:
1
436
Name:
Class:
Date:
71. describes a file with any characters removed that are not needed by a browser to parse the file
72. a style rule based on selectors that no longer apply to any elements on your web pages
73. Name four best practices for decreasing page load time, and explain the effect of each.
74. Name all of the operating systems on which you should perform browser tests. For each one, explain why you should
test on that particular operating system.
75. Name and describe two methods for reducing the size of CSS files.