Site Development Associate
Activity Answers-1
Activity 1-1: Defining Web page authoring terms
In this activity, you will match the Web page authoring term in the left column with the appropriate definition in the right column. 1. Extensible Markup Language (XML) 2. Standard Generalized Markup Language (SGML) 3. WCAG 4. Tags 5. Extensible Hypertext Markup Language (XHTML) 6. Hypertext Markup Language (HTML) 7. Markup language 8. Hyperlink A. An ISO-standard language used to describe data and context as opposed to its appearance B. Embedded information that defines the font, color and phrase elements used on an HTML page C. Language that describes context and/or formatting for online documents D. Newer language used to define context as opposed to appearance E. Embedded instructions within a text file that link it to another point in the file or to a separate file F. Web language standard that separates responsibilities for organizing and formatting data G. Language used primarily for defining format and appearance of Web documents H. A set of guidelines for ensuring Web site accessibility to all users, including those with disabilities
1-D, 2-A, 3-H, 4-B, 5-F, 6-G, 7-C, 8-E
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-2
Activity 2-1: Identifying HTML elements and attributes
In this activity, you will match the HTML element or attribute in the left column with the appropriate description in the right column. 1. 2. 3. 4. 5. 6. 7. 8. 9. lang style A. A container tag that encloses the text that will appear at the top of the browser window, and as the page name in Bookmarks and Favorites B. An attribute capable of aligning text C. A container tag that creates a bulleted list D. An empty tag that describes the contents of a Web page, such as subject matter or author E. An empty tag that declares document or code type within an HTML, XHTML, XML or SGML document; identifies the version and markup language used F. A container tag that encloses the main portion of the document; text in this section will appear in the browser G. A global attribute that identifies the base language of the HTML document or individual element H. A document structure component that nests all of the HTML document's code except for the declaration I. 10. J. A container tag that creates a numbered list A container tag that denotes text as a heading element
1-E, 2-H, 3-G, 4-F, 5-I, 6-A, 7-J, 8-B, 9-D, 10-C
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-3
Activity 3-1: Identifying HTML and CSS terms
In this activity, you will match the element, attribute or term in the left column with the appropriate description in the right column. 1. 2. 3. 4. 5. 6. 7. 8. 9. align img C. alt GIF JPEG F. selector width src background-color G. H. I. J. K. L. D. E. A. B. Element that creates a horizontal ruling line Property that positions an element to the left, right or center Image format that is typically used for simpler line drawings, and can support animation and transparency Element that displays a graphical image on a Web page Property that defines a color for a Web page background Attribute that determines how far an element extends across the page, specified as a percentage of the window or in pixels Property that identifies the image used as the background for a Web page Attribute that designates alternative text to appear while an image is loading or in place of an image Property that identifies the type of font face used, such as Times New Roman or Arial. Image format that supports compression, and is typically used for photographs and complex images Attribute that specifies the name and, if necessary, location of an image file An element in a style sheet that you want to affect.
10. hr 11. background-image 12. font-family
1-B, 2-D, 3-H, 4-C, 5-J, 6-L, 7-F, 8-K, 9-E, 10-A, 11-G, 12-I
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-4
Activity 4-1: Writing HTML hyperlink code
In this activity, you will write the HTML code to create various types of hyperlinks. You can use real or fictional URL and file names to write your tags, or you can use descriptive text (e.g., filename.htm). Be sure to close tags as appropriate. 1. Write the tag(s) to create a basic HTML hyperlink. linked text or image (or both) 2. Write the tag(s) to create a hyperlink that references an external page. Use a fully qualified URL. Summer Youth Build The target URL in the hypertext reference should use a full URL that includes the protocol (HTTP or other). 3. Write the tag(s) to create a hyperlink that references a Web page in the same directory as the HTML page. Use a partial URL. Summer Youth Build The absence of any initial characters before the URL instructs the browser to look for a file (syb.htm) in the same directory as the current page. 4. Write the tag(s) to create a hyperlink that references a Web page in a different directory as the current page or root directory. Use a partial URL. Web page 1 The initial forward slash ( / ) in the URL instructs the browser to look for a directory named Webpagefiles that is off the current, or root, directory. 5. Write the tag(s) to create a hyperlink to a file that resides in a directory one level higher than the HTML page. Use a partial URL. Web page 1 The initial two periods and forward slash ( ../ ) instruct the browser to look for a directory named Webpagefiles that begins one level higher than the page you are currently viewing. 6. Write the tag(s) to create a hyperlink that references an image file in the same directory as the HTML page. Use a partial URL. See the monkey! The target file in the hypertext reference should be an image file format, such as JPG, GIF or PNG. 7. Write the tag(s) to create a hyperlink that references a secure Web page. Use a fully qualified URL. Visit our secure CIW site. The target URL in the hypertext reference should use the secure protocol HTTPS.
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-5
8.
Write the tag(s) to create a hyperlink that references a document on an FTP server. Use a fully qualified URL. Download the file from our FTP server. The target URL in the hypertext reference should use the protocol FTP.
9.
Write the tag(s) to create a hyperlink that references an e-mail address. Use a fully qualified URL. You can send CIW an e-mail. . The target URL in the hypertext reference should use the e-mail protocol (mailto:).
10. Write the tag(s) to create a hyperlink that uses an image as the link. Point the link to a related page. Use a fully qualified URL. Be sure to include the alt attribute. The tag to display the image that will act as the link must reside between the container tags. The alt attribute in the tag should provide some text as an alternative for users who cannot see images when the page renders. 11. Write the tag(s) to create an internal hyperlink within a single page. target text or image (or both) text/image pointing to targetArea1 The tag name attribute must be used to create an ID for the target of the link. This tag specifies what the link will point to. The href attribute in a separate tag must use the hash symbol to specify the target ID so that the browser knows to look within the same file for the target. These two tags can occur in either order. 12. Write the tag(s) to create a hyperlink that enables the user to access an internal link within an external file. Learn about the CIW Web Foundations Associate certification The href attribute must point to a fully qualified URL to access an external page, and must include an internal anchor on that page, designated by the hash symbol (#). In this activity, you practiced writing the HTML code that creates a variety of hyperlink types.
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-6
Activity 5-1: Identifying HTML table elements and attributes
In this activity, match the HTML table element or attribute in the left column with the appropriate description in the right column. 1. 2. 3. 4. 5. 6. 7. 8. 9. th table rowspan caption tr td padding colspan border-spacing A. Optional element often used to add a title above or below a table.
B. Optional element that designates the top row or left column. By default, text will appear bold and centered. C. Property used to manipulate the amount of space between cell content and the cell's inner border. D. Required element that encloses table cell contents; not required when a similar redundant element is present. E. Attribute that identifies the number of table columns a single cell can occupy. F. Required element to create a table, and contains all other table elements.
G. Attribute that identifies the number of table rows a single cell can occupy. H. Required element that contains all data for a table row. I. Property used to manipulate the amount of space between borders of adjacent table cells.
1-B, 2-F, 3-G, 4-A, 5-H, 6-D, 7-C, 8-E, 9-I
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-7
Activity 6-1: Identifying HTML form elements and attributes
In this activity, you will match the element or attribute in the left column with the appropriate description in the right column. 1. method 2. name 3. select 4. form 5. textarea 6. input 7. value 8. cols 9. action A. Attribute that specifies the name and location of the script used to process the form B. Required element to create a Web form, and contains all other form elements C. Element used to create text boxes, check boxes, radio buttons, and the Submit and Reset buttons D. Attribute that allows default text to appear inside a text box E. Element used to create drop-down option lists from which the user can choose single or multiple options F. Attribute that identifies user input and associates it with a value to help organize user-submitted data G. Attribute that specifies the width of a scrolling text box H. Element used to create scrolling box into which text can be entered I. Attribute that specifies how a browser will send form data to a Web server
1-I, 2-F, 3-E, 4-B, 5-H, 6-C, 7-D, 8-G, 9-A
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-8
Activity 7-1: Reviewing video, audio and image map elements and attributes
In this activity, you will write the necessary HTML code to embed a video file, an audio file and an image map. 1. Write the minimum HTML code required to embed a video named build.mp4 into a Web page. Include video controls. The video will be in the same directory as the HTML file. Your browser does not support the HTML5 video element. 2. Write the element code required to identify an image (image.png) that will display in the video window until the play button is selected or the video loads. 3. Write the minimum HTML code required to embed an audio file named song.mp3 into a Web page. Include audio controls. The audio file will be in the same directory as the HTML file. Your browser does not support the HTML5 audio element. 4. Write the HTML tag required to insert an image named gorilla.png into a Web page. Identify this image as the image that will be used for an image map named GorillaMap. The map will be located in the same HTML file as the image. 5. Write the HTML tag required to define the GorillaMap image map. 6. Write the HTML tag that will define a rectangular hot spot with the coordinates 156, 0, 234 and 75 in the gorilla.png image. This hot spot should direct visitors to the London Zoo site at www.zsl.org/zsl-london-zoo.
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-9
7.
You have defined a set of image map hot spots for an image that is 130 pixels tall and 100 pixels wide. Suppose you changed the size of the image file to 150 pixels tall and 110 pixels wide. How would this change affect your image map? Because the image's coordinates have changed, the hot spot would not be placed in the same location you determined for the image's previous dimensions. You must determine new coordinates for the hot spot and define them in the tag.
In this activity, you reviewed the HTML code syntax used to create an image map.
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-10
Activity 8-1: Reviewing Web technology terms
In this activity, you will match the term in the left column with the appropriate description in the right column. 1. 2. Function Dynamic HTML (DHTML) Geolocation Canvas Drag-and-drop Document Object Model (DOM) Object-oriented Offline Web application Browser detection A. An HTML extension used to provide location-based services.
B. A style of programming that links data to the processes that manipulate it. C. The ability to use the DOM and discover particular aspects of a user agent. D. A general term used to describe the combination of HTML, script, styles and the Document Object Model (DOM) that provides Web page interactivity. E. A program that converts text files into executable applications. F. A W3C standard that specifies the way objects are manipulated through script.
3. 4. 5. 6.
7. 8.
G. An HTML extension that allows Web page elements to be moved inside and outside the Web page. H. An HTML extension used to provide on-the-fly graphics or animation to a Web page. I. J. A stand-alone, reusable segment of program code that is not part of an object. An HTML extension that allows Web programs to function when an Internet connection is not available.
9.
10. Compiler
1-I, 2-D, 3-A, 4-H, 5-G, 6-F, 7-B, 8-J, 9-C, 10-E
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0
Site Development Associate
Activity Answers-11
Activity 10-1: Defining site development terms
In this activity, you will match the site development term in the left column with the appropriate definition in the right column. 1. Pay per click A. A collection of information that can be sorted, altered and placed into other similar structures for retrieval. B. Factors that affect the operations of a Web site, such as file download times, file names and file locations. C. A communications method in which clients automatically receive new information about your product. D. An Internet marketing technique that enables you to list your site high in search engine rankings by advertising on keywords related to your product. E. A secure transmission standard based on Secure Sockets Layer (SSL) that uses digital certificates to authenticate systems and to help enable subsequent encryption. F. A protocol that provides authentication and encryption; used by most servers for secure exchanges over the Internet. G. Factors that affect the accessibility and presentation of a Web page to an audience. 8. Branding H. The group of symbols used to render text on a page to support various languages (e.g., Chinese, Arabic and Russian). I. The process of establishing name recognition for a company or product. J. An XML-based protocol used by credit card companies to add security to online credit and debit card transactions.
2. Secure Sockets Layer (SSL)
3. Front-end issues
4. Relational database
5.
Character set
6. 3-D Secure
7. Back-end issues
9.
Transport Layer Security (TLS)
10.Push technology
1-D, 2-F, 3-G, 4-A, 5-H, 6-J, 7-B, 8-I, 9-E, 10-C
© 2012 Certification Partners, LLC. — All Rights Reserved.
Version 2.0