Web Design 1 Class
Quiz yourself by thinking what should be in
each of the black spaces below before clicking
on it to display the answer.
Help!
|
|
||||
|---|---|---|---|---|---|
| What is the tag that creates a horizontal rule? | hr /
🗑
|
||||
| What is the tag that creates a title in a browser bar? | title /title
🗑
|
||||
| What are the 4 required tag pairs? | html head title body
🗑
|
||||
| The M in HTML stands for ___________ | markup
🗑
|
||||
| The H in HTML stands for ___________ | hyper
🗑
|
||||
| The L in HTML stands for ___________ | language
🗑
|
||||
| The T is HTML stands for ___________ | text
🗑
|
||||
| The <p> tag is known as what kind of element? | block level element
🗑
|
||||
| The <h1> tag is known as what kind of element? | block level element
🗑
|
||||
| The <em> tag is known as what kind of element? | inline element
🗑
|
||||
| The <sup> tag is known as what kind of element? | inline element
🗑
|
||||
| Which heading tag is the largest? | h1
🗑
|
||||
| Which heading tag is the smallest? | h6
🗑
|
||||
| Headings can be different sizes but they are ALWAYS _________. | bold
🗑
|
||||
| Using HTML, make the word football bold and the color red. | strong style="color: red;" football /strong
🗑
|
||||
| Using HTML, make the word SNOW a level 2 heading that is centered. | h2 style="text-align: center;" SNOW /h2
🗑
|
||||
| Multiple styles as an attribute are separated inside the quotation marks by what? | A semi-colon (;)
🗑
|
||||
| Here is the hex code for light blue: 00ccff and for dark blue: 0000ff. Write the code that will make the page background light blue and the text dark blue using the hexadecimal codes. | body style="background-color: #00ccff; color: #0000ff;"
🗑
|
||||
| Name the 3 types of lists. | definition, ordered, and unordered
🗑
|
||||
| Ordered lists use.... | letters or numbers by default
🗑
|
||||
| Unordered lists use.... | disc bullets by default
🗑
|
||||
| If you forget to turn off a list before continuing a webpage, the rest of the page will be _______. | indented
🗑
|
||||
| Hyperlinks are created using which HTML element? | a, the anchor tag
🗑
|
||||
| To link to another webpage, use this attribute. | href, hyperlink reference
🗑
|
||||
| What is the code that will create a link to the Google website using an absolute reference that opens in a new window. | a href="http://www.google.com" target="_blank" Google /a
🗑
|
||||
| Use this attribute to target elements within a page that can be linked to. | id
🗑
|
||||
| Linking to targets requires putting this symbol in front of the target name in the hyperlink reference. | # (number sign, pound sign)
🗑
|
||||
| Special codes that are used to show symbols or escape/reserved characters are called _____. | entities
🗑
|
||||
| Entity references begin with a _______. | & (ampersand)
🗑
|
||||
| Entity references end with a _______. | ; (semi-colon)
🗑
|
||||
| Entity references do not go inside _______. | tags
🗑
|
||||
| This HTML element is used to add images to a web page. | img
🗑
|
||||
| When creating an image, you must always specify this attribute to indicate the name of the image you want to show on your webpage. | src (source)
🗑
|
||||
| When creating an image, you must always add this attribute to describe the content of an image (for accessibility). | alt (alternative text)
🗑
|
||||
| List 3 main types of image formats. | .jpg, .gif, .png
🗑
|
||||
| Animations should be saved as this image format. | .gif
🗑
|
||||
| Photos should be saved as this image format. | .jpg
🗑
|
||||
| Transparent images should use this image format. | .png
🗑
|
||||
| What is the code that will create a webpage with a background image called skyblue.jpg? | body style="background-image: url(skyblue.jpg);"
🗑
|
||||
| You can add this attribute to an image or a link and it will create pop-up text when the user points to the graphic or link on the webpage. | title
🗑
|
||||
| <img>, <hr> and <br> tags are all examples of what kind of HTML elements? | empty tags
🗑
|
||||
| If a tag is considered an empty tag, this means that the tag does not have what? | a closing tag
🗑
|
||||
| Empty tags must end with this symbol | /
🗑
|
||||
| To center images, you must style it in this tag. | p
🗑
|
||||
| What attribute and value would you use to style an image or text to be centered? | text-align: center
🗑
|
||||
| What attribute and value would you use to style and image so the image is aligned to the right side of a paragraph? | float: right
🗑
|
||||
| What does HTML stand for? | Hypertext Markup Language
🗑
|
||||
| Which file extension is used with standard web pages? | html
🗑
|
||||
| What should be the first and last elements on any web page? | <html></html>
🗑
|
||||
| Which is not part of an HTML element? | anchor
🗑
|
||||
| How would you create a link to another web page named "page2.html" that is saved in the same folder? | <a href="page2.html">Link to Page 2</a>
🗑
|
||||
| What does the element <p> stand for? | paragraph
🗑
|
||||
| What is the syntax for an HTML comment? | <!-- This is a comment -->
🗑
|
||||
| What is the start tag for an individual item in a list? | <li>
🗑
|
||||
| Which of the following will create a bulleted list? | <ul>
🗑
|
||||
| What is wrong with the following example of an absolute link that links to the YouTube website? <a href="www.youtube.com">Visit YouTube</a> | It does not use protocol
🗑
|
||||
| What is wrong with the following code displaying an image? <img source="sunset.jpg" alt="Beautiful Sunset" /> | source should be written as src
🗑
|
||||
| What will happen if we specify an image's height and width outside of its true original proportion? | The web browser will display a distorted version of the image.
🗑
|
||||
| What is generally considered the best format to use for color photographs on the web? | .jpg
🗑
|
||||
| Which of the following is not an available attribute for the <img> element? | filename
🗑
|
||||
| Which image format can support animation? | .gif
🗑
|
||||
| What does target="_blank" do when specified in an <a>element? | Tells the browser to open a link in a new window.
🗑
|
||||
| A bookmark link starts with which symbol in the href attribute? | #
🗑
|
||||
| What would a blind person hear in a screen reader in the place of a web image? | Whatever text is specified in the alt attribute
🗑
|
||||
| Which of the following statements is incorrect? | A lower header element, such as <h4>, should not be used unless all the higher ones, <h1> through<h3>, have been used first.
🗑
|
||||
| Which of the following is not an HTML element related to displaying lists? | <list>
🗑
|
||||
| RGB stands for: | Red, Green, Blue
🗑
|
||||
| What is the primary reason we are limited in the fonts we can use on our web pages? | We are restricted to those fonts installed on our viewers' computers.
🗑
|
||||
| Which of the following is a common sans-serif font? | Verdana
🗑
|
||||
| Which of the following is not true about declaring fonts for our web pages? | Fonts should be listed in reverse order of preference.
🗑
|
||||
| Which is an effective way to guarantee that an unusual font will display on our page? | Place the text into an image and display the image on the page
🗑
|
||||
| Why is it important to validate our HTML pages? | It improves the likelihood that our web pages will display consistently to visitors.
🗑
|
||||
| How does the HTML validator know which rules to apply to our web document? | It is based on what we specify in the DOCTYPE statement
🗑
|
||||
| If you have a subfolder called "images" directly below the folder where your HTML document resides, which would be the correct way to reference an image file from your HTML document? | <img src="images/photo.jpg" />
🗑
|
||||
| What is one advantage of using relative paths and subfolders? | It can help us keep our site files well organized and uncluttered
🗑
|
||||
| Why are gradient files often made to be just 1px wide or 1px high? | In order to reduce the file size of the image and therefore speed up page loading time.
🗑
|
Review the information in the table. When you are ready to quiz yourself you can hide individual columns or the entire table. Then you can click on the empty cells to reveal the answer. Try to recall what will be displayed before clicking the empty cell.
To hide a column, click on the column name.
To hide the entire table, click on the "Hide All" button.
You may also shuffle the rows of the table by clicking on the "Shuffle" button.
Or sort by any of the columns using the down arrow next to any column heading.
If you know all the data on any row, you can temporarily remove it by tapping the trash can to the right of the row.
To hide a column, click on the column name.
To hide the entire table, click on the "Hide All" button.
You may also shuffle the rows of the table by clicking on the "Shuffle" button.
Or sort by any of the columns using the down arrow next to any column heading.
If you know all the data on any row, you can temporarily remove it by tapping the trash can to the right of the row.
Embed Code - If you would like this activity on your web page, copy the script below and paste it into your web page.
Normal Size Small Size show me how
Normal Size Small Size show me how
Created by:
kristenwoodard
Popular Computers sets