All Sets

Which tag pair configures a structural area on a web page? a. <area> </area> b. <div> </div> c. <cite> </cite> d. <strong> </strong>

B. <div> </div>

______ is an emerging page layout technique optimize for two-dimensional page layout

CSS Grid Layout

What are the best practices for using graphics on web pages?

Careful choice of colors, use of necessary images only, use of images optimized for display on web pages, a usable site even if images are not displayed, and use of the alt attribute to configure text descriptions for images.

Line Break Element

Causes the browser to advance to the next line before displaying the next element or text on a web page. The line break tag is not coded as a pair of opening and closing tags. It is stand-alone, or void element, and is coded as <br>

Mark Up Languages

Consists of sets of directions that tell the browser software (and other user agents such as mobile phones) how to display and manage a web document.

What 3 kinds of lists does HTML offer.

Description lists, ordered lists, and unordered lists.

element or tag

Each individual mark up code is referred to as an element or tag. Each tag has a purpose. Tags are enclosed in angle brackets < and > symbols. Most tags come in pairs: an opening tag and a closing tag. Most tags can be modified with attributes that further describe their purpose.

true or false: You should save your images using the smallest file size as possible.

False. There is a trade-off between the quality of the image and the file size. The goal should be to save images that use the smallest file size which provides acceptable display quality.

Describe the origin, purpose, and features of HTML

HTML (Hypertext Markup Language) was developed by Tim Berners-Lee at CERN, using SGML. HTML is the set of markup symbols or codes places in a file intended for display on a web browser. HTML configures a platform-independent display of information. Each markup code is referred to as an element or (tag)

description list

HTML5 introduces a new element name, description list, to replace the definition list element (used in XHTML and earlier versions of HTML). A description list is useful for organization terms and their descriptions. Description lists begin with the <dl> tag and end with the </dl> tag. Each tern or name in the list begins with the <dt> tag and ends with the </dt> tag. Each description begins with the <dd> tag and ends with the </dd> tag.

Special Characters (Entity Characters)

In order to use special symbols such as quotation marks, the greater than sign (>), the less-than sign (<), and the copyright symbol in your web page document, you need to use special characters, sometimes called entity characters. Use the special character code &copy; to display the copyright symbol. &nbsp is used to indicate multiple blank spaces page 46

Phrase elements

Indicate the context and meaning of the text between the container tags. It is up to each browser to interpret that style. Phrase elements are displayed right in line with the text (referred to as inline display) and can apply to a section of text or even just a single character of text.

Describe an issue to consider when designing for the mobile web.

Issues to be aware of in designing for the mobile web include small screen size, low bandwidth, awkward controls, limited processor and memory, and reduced support of font typefaces and color

Is it reasonable to try and code a web page that looks exactly the same on every browser and every platform? Explain your answer.

It is reasonable to code pages that look similar on various browsers; it is not reasonable to try to code pages that look exactly the same on various browsers and operating systems. Modern web developers code pages to look satisfactory in commonly used browsers and may add enhancements that are applied by the most recent browser versions. This approach is called "progressive enhancement"

_______ determine the capability of the mobile device, such as browser viewport dimensions and resolution

Media Queries

Provide _______________ navigation near the top of the page when optimizing for mobile display

Minimal

Describe the software needed to create and test web pages

No expensive software is required to create and code web pages. You can use a Windows or Mac text editor application that is part of the operating system. Free text editors and web browsers are also available for download.

The concept of _________ relates to providing a single resource that is configured for optimal display on multiple types of devices

One Web

Describe the difference between ordered lists and unordered lists

Ordered lists and unordered lists can be used to organize information on a web page. Un ordered lists display a small symbol or bullet in front of each item. Use the <ul> tag to configure an unordered list. By default, ordered lists display a sequence of numbers in from of each item. Use the <ol> tag to configure an ordered list. Configure individual items in both ordered and unordered lists using the <li> tag.

Describe one of the four principles of WCAG 2.0

Perceivable, Operable, Understandable, and Robust. Content much be perceivable Interface components in the content must be operable. Content and controls must be understandable Content should be robust enough to work with current and future user agents, including assitive technologies.

Describe the purpose of special characters

Special characters are used to display items such as quotation marks, greater than, less than, and the copyright symbol on a web page. These special characters, sometimes entity characters, are interested by the browser when the page is rendered

Describe the CSS that configures a file named bg.gif to repeat vertically down the background of a web page. Code the CSS.

The CSS background-image property configures the file that is displayed. The CSS background-repeat property configures the way the image is displayed on the page. Suggested solution: body {background-image: url(bg.gif); background-repeat: repeat-y; }

Describe the CSS to configure a graphic named circle.jpg to display once in the background of all <h1> elements. Code the CSS.

The CSS background-image property configures the file that is displayed. The CSS background-repeat property configures the way the image is displayed on the page. Suggested solution: h1 {background-image: url (circle.jpg); background-repeat: no-repeat; }

Document Type Definition (DTD)

The DTD identifies the version of HTML contained in your document. Browsers and HTML code validators can use the information in the DTD when processing the web page. The DTD statement, commonly called doctype statement, is the first line of a web page document.

What do the Head and Body Section contain?

The Head Section contains information that describes the web page document. The Body Section contains the actual tags, text, images, and other objects that are displayed by the browser as web page.

Hypertext Markup Language (HTML)

The World Wide Web is composed of files containing HTML and other markup languages that describe webpages. Tim Berners-Lee developed HTML using Standard Generalized Markup Language (SGML). SGML prescribes a standard format for embedding descriptive markup within a document and for describing the structure of a document. HTML is the set of markup symbols or codes placed in a file that is intended for display on a web page. These markup symbols and codes identify structural elements such as paragraphs, headings, and lists. HTML can also be used to place media on a web page and describe fill-in forms.

Explain how the browser will render the web page if you use CSS to configure both a background image and background color.

The browser will display the background color immediately. Then, the browser will render the background image and repeat the image as specified in the CSS. The background color will appear in areas not covered by the background image

Describe what is incorrect with the following CSS code, which causes a web page containing it not to display a border when rendered in a browser: h2 { background-color: #FF000 border-top: thin solid #00000 }

The first style tule is missing an ending semicolon.

List the four basic principles of design.

The four basic principles of design are reptition, contrast, proximity, and alignment

Describe the purpose of the head and body sections of a web page

The head section is located between the <head> and </head> tags on a web page. This area is used to contain information that describes the web page, such as the title of the page that will display in the menu bar of the browser window. The body section is located between the <body> and </body> tags. This area is used to code text and tags that show directly in the browser's display of the web page. The purpose of the body section is to describe the contents of the web page.

Describe the features of a heading element and how it configures the text

The heading element is used to display headings and subheadings of documents. The size of the heading is configured with the particular heading level used -- ranging from 1 to 6. <h1> is the largest heading. <h6> is the smallest heading. Text contained between heading tags will be displayed in a bold font and will have a line break above and below

When configuring an image map, describe the relationship between the image, map, and area tags.

The image, map, and are elements work together to create a functioning image map. The <img> tag configures the image that will bemused for the map and contains a use map attribute who value corresponds to the id value on the <map> tag associated with the image. The <map> tag is a container tag and surrounds one or more <area> tags. There is one self-contained <area> tag for each clickable hotspot on the image map.

Describe the purpose of the blockquote element

The purpose of the blockquote element is to format a long quotation by indenting a section of text on a web page. Empty space is placed above and below the text contained in the blockquote element. The text is indented from both the left and right margins.

main element

The purpose of the main element is to contain the main content of a web page document. There should only be one main element per web page. The block display main element begins with the <main> tag and ends with the </main> tag.

True or False: CSS can be used to configure visual elements such as rectangular shapes and lines on web pages.

True. CSS can be utilized to configure color, text, and even visual elements such as rectangular shapes (with the background-color property) and lines (with the border property)

Describe when to use a relative link. Is the http protocol used in the href value?

Use a relative link to display a web page document form your website. The http protocol is not used in the href value.

Describe when to use an absolute link. Is the http protocol used in the href value?

Use an absolute link to display a web page document from a website other than your own. The http protocol is used in the href value. Example: <a href="http://www.google.com">Google</a>

Anchor Element

Use the Anchor element to specific a hyperlink, often referred to as a link, to another web page or file that you want to display. Each anchor element begins with an <a> tag and need with a </a> tag. The opening and closing anchor tags surround the text to clink to perform the hyperlink. Use the href attribute to configure the hyperlink reference, which identifies the name and location of the file to access.

The ________ is a group whose mission is to create guidelines and standards for web accessibility.

Web Accessibility Initiative (WAI)

left alignment

Web pages are aligned to the left as a default.

Relative Hyperlinks

When you need to link to webpages within your site

How would you link to the named fragment #jobs on the page employ.html from the home page of the site? a. <a href="employ.html#jobs">Jobs</a> b. <a name="employ.html#jobs">Jobs</a> c. <a link ="employ.html#jobs">Jobs</a> d. <a href="#jobs">Jobs</a>

a. <a href="employ.html#jobs">Jobs</a>

Which tag pair is used to create the largest heading? a. <h1> </h1> b. <h9> </h9> c. <h type="largest"> </h> d. <h6> </h6>

a. <h1></h1>

Which of the following graphic types can be made transparent? a. GIF b. JPG c. BMP d. PHOTO

a. GIF

Which attributes 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

a. alt

Which of the following attributes define a fragment identifier on a page? a. id b. href c. fragment d. bookmark

a. id

Which of the following is known as white space? a. the empty screen area around blacks 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

a. the empty screen area around blacks of text and images

Which meta tag is used to configure display for mobile devices? a. viewport b. handheld c. mobile d. screen

a. viewport

heading elements

are organized into six levels: h1 through h6. The text contained within a heading element is rendered as a "block" of text by the browser (referred to as block display) and displays with empty space (sometimes called "white space") above and below.

Paragraph elements

are used to group sentences and sections of text together. Text that is contained by <p> and </p> tags display as a "block" (referred to as block display) and will appear with empty space above and below it.

Which pseudo-element can be used to generate content that precedes an element? a. :after b. :before c. :content d. :first-line

b. :before

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>

b. <a href="index.html"> <img src="home.gif alt="Home"></a>

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

b. Colorful pages appeal to everyone

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. contrast, repetition, and proximity

b. Hierarchical, linear, and random

Which of the following graphic types is the best suited to photographs? a. GIF b. JPG c. BMP d. PHOTO

b. JPG

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 receives the appropriate space for the image c. They help the browser display the image in its own window d. none of the above

b. They help the browser render the page faster because it receives the appropriate space for the image

Which CSS property configures the background color? a. bgcolor b. background color c. color d. none of the above

b. background color

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

b. complementary

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

b. padding property.

Which of the following are the four principle of the Web Content Accesibility Guidelines? a. repetition, contrast, proximity, and alignment b. perveivable, operable, understandable, and robust c. accesible, readable, maintainable, and reliable d. hierarchical, linear, random, and sequential

b. perveivable, operable, understandable, and robust

Which of the following is an image file that contains multiple small graphics? a. viewport b. sprite c. background-image d. media

b. sprite

Which attribute below can be applied to an anchor tag to open a link in a new browser window? a. window b. target c. rel d. media

b. target

The CSS3 property ___________ configures a drop-shadow effect on an HTML element.

box-shadow

Which tag is used to link web pages to each other? a. <link> </link> b. <hyperlink> </hyperlink> c. <a> </a> d. <body> </body>

c. <a></a>

Which tag configures the next element or portion of text to display on a new line? a. <line> b. <nl> c. <br> d. <new>

c. <br>

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

c. <hr>

Which of the following is a mobile web design best practice? a. Configure a multiple-column page layout b. avoid using list to organize information c. Configure a single-column page layout d. embed text in images wherever possible

c. Configure a single-column page layout

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

c. Use a key phrase as a hyperlink

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

c. a different background color on each page

Which part of the following font units is recommended for mobile display? a. pt unit b. px unit c. em unit d. cm unit

c. em unit

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

c. favicon

Which of the following is the attribute used to indicate whether the style sheet is for printing or screen display? a. rel b. type c. media d. content

c. media

Which of the following is a container element used to configure responsive images? a. display b. flex c. picture d. link

c. picture

Which of the following are influenced by the intended or larger 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

c. the overall look and feel of the site

type attribute

configures the symbol used for ordering the list. For example, to create an ordered list organized by uppercase letters, use <ol type="A">

Title Element

configures the text that will appear in the title bar of the browser window. The text between <title> and </title> tags is called the title of the web page and is accessed when web pages are book marked and printed.

Which of the following recommended design practices apply to a website that uses images for its main site navigation? a. provide alternate 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.

d. No special considerations are needed.

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;

d. background-repeat: repeat-y;

Which of the following is a sketch or blueprint of a web page that shows the structure (but not the detailed design) of basic page elements? a. drawing b. HTML code c. site map d. wireframe

d. wireframe

meta element

describes a characteristic of a web page, such as the character encoding. Character encoding is the internal representation of letters, numbers, and symbols in a file such as a web page or other file that is stored on a computer and may be transmitted over the Internet.

ordered list

display a numbering or lettering system to itemize the information contained in the list. Ordered lists can be organized by the use or numerals (the default), uppercase letters, lowercase letters, uppercase Roman numerals, and lowercase Roman numerals. Ordered lists begin with an <ol> tag and end with an </ol> tag. Each list item begins with an <li> tag and ends with an </li? tag.

unordered list

displays a bullet, or list marker, before each entry in the list. This bullet can be one of several types: disc (the default), square, and circle. Unordered lists begin with a <ul> tag and end with a </ul> tag. Each list item begins with an <li> tag and ends with an </li> tag.

All browsers and browser versions _________ display web pages in exactly the same way

do not

XHTML

eXtensible HypterText Markup Language (XHTML) uses the tags and attributes of HTML4 along with the syntax of XML.

div element

has been used for many years to configure a generic structural area or "division" on a web page as a block display with empty space above and below. A div element begins with a <div> tag and ends with a </div> tag. Use a div element when you need to format an area of a web page that may contain other block display elements such as headings, paragraphs, unordered lists, and even other div elements.

The most common structure used for commercial websites is __________ organization

hierarchical

Absolute hyperlinks

indicates the absolute location of a resource on the web. Use absolute hyperlinks when you need to link to resources on other websites.

HTML5

is the successor to HTML4 and replaces XHTML. HTML5 incorporates features of both HTML and XHTML, adds new elements of its own, provides new features such as form edits and native video, and is intended to be backwards compatible.

attribute

is to modify the properties of an HTML element. The Align Attribute modifies the element's horizontal alignment (left, center, or right) on a web page.

blockquote element

is used to display a block of quoted text in a spacial way - indented from both the left and right margins. A block of indented text begins with a <blockquote> tag and ends with a </blockquote> tag.

Start Attribute

is useful when you need a list to begin with an integer value other than 1 (for example, start="10"). Use the new HTML5 reversed attribute (set reversed="reversed") to configure the list markers to display in descending order.

The _____________element displays a visual gauge of a numeric value within a known range.

meter

When using CSS media queries, code the _______________ keyword to hide the query from older nonsupporting browsers.

only

site map

represents the structure, or organization, or pages in a website in a visual manner.

If your web page uses graphic links, include ____________ at the bottom of the page to increase accessibility.

text links

footer element

the purpose of the footer element is to contain the footer content of a web page or section of a web page. The block display footer element begins with the <footer> tag and ends with the </footer> tag

nav element

the purpose of the nav element is to contain a section of navigation links. The block display nav element begins with the <nav> tag and ends with the </nav> tag.

A(n)_______________ image is a smaller version of a larger image that usually links to the larger image.

thumbnail

A background image will automatically be repeated, or _________, by a web browser.

tiled

XML (eXtensible Markup Language)

was developed by the W3C to create common information formats and share the format and the information on the web. It is a text-based syntax designed to describe, deliver, and exchange structured information, such as RSS feeds. XML is not intended to replace HTML, but to extend the power of HTML by separating data from presentation. Using XML, developers can create any tags they need to describe their information.