Web Development 1
Printable Version (pdf)

 

Course Introduction

 

Core Standards of the Course

Strand 1
Digital Citizenship: Students will understand the basic principles of copyright, AUP, and ethical behavior. (Suggested time proportion 5%)

Standard 1
Demonstrate knowledge of standard copyright rules.

1. Understand copyright for original creations.
   
2. Understand the creative commons license.
   
3. Understand when to obtain permission for non-original work.
   

Standard 2
Identify the use and purpose of acceptable use policy (AUP).

1. Comply to the AUP for your school.
   

Standard 3
Understand ethical behavior as it relates to an AUP, Intellectual Property, Netiquette, Respecting Privacy, Anti-Spamming Laws, etc.

Strand 2
Fundamentals of HTML5: Students will demonstrate creation of "well formed" webpages. (Suggested time proportion 40%)

Standard 1
Demonstrate knowledge required to develop an HTML document.

1. Code the foundation for a webpage. Include the element tags DOCTYPE, html, head, title, and body.
   
2. Structure the page using semantic and structural elements such as: header, nav, main, section, article, aside, footer, div, etc.
   

Standard 2
Explain appropriate file structure and naming conventions.

1. Use logical file structure to build websites.
   
2. Incorporate appropriate naming conventions for website files.
   

Standard 3
Use the DOCTYPE Declaration.

1. Develop pages using the DOCTYPE declaration.
   

Standard 4
Develop "well formed" webpages with appropriate HTML structure and according to W3C standards that can be validated.

1. Demonstrate best practice by consistently using lowercase text for all element names.
   
2. Properly nest elements.
   
3. Use quotes on attribute values.
   

Standard 5
Demonstrate the use of input elements and attributes.

1. Create pages with tags and attributes at the block level. (html, head, body, style, header, nav, main, section, footer, div)
   
2. Create pages with tags and attributes at the inline level. (DOCTYPE, title, h1, h2, h6, p, br, meta, etc.)
   
3. Create webpages with text formatting, links, images, lists, tables (tabular data), etc.
   
4. Relative Links are relative to the directory of the website. (images/photo.jpg)
   
5. Absolute links are the exact location on the internet and contain a protocol. (http, https, ftp)
   
6. Code special characters such as:   © " < > & —.
   
7. Demonstrate the use of form, fieldsets, legend, buttons, text fields, checkboxes, radio buttons, and dropdown lists.
   

Standard 6
Use meta tags for page documentation and search engine optimization (SEO).

1. Specify page description, keywords, viewport, and author using meta tags.
   
2. Declare encoding using meta tags.
   
3. Understand principles of search engine optimization.
   

Strand 3
Cascading Style Sheets (CSS): Students will format webpages using CSS. (Suggested time proportion 35%)

Standard 1
Apply CSS to your website.

1. Apply CSS to an element using an inline style. (An inline style may be used to apply a unique style for a single element.)
   
2. Apply CSS to a webpage using an internal style. (Internal style rules may be used to uniquely style a single page.)
   
3. Apply CSS to a website using an external stylesheet. (Best Coding Practice - One file changes the entire website.)
   

Standard 2
Apply essential syntax & CSS box model.

1. Add style rule, declaration, selector, property value pair. Use correct css syntax : ;
   Example of a style rule.
   
   

Standard 3
Students will format webpages using CSS

1. Modify background properties such as: color and image.
   
2. Modify font properties such as: font-family, size, and color.
   
3. Modify border properties such as: width, style, and color.
   
4. Implement tags, id, & classes to modify an HTML element.
   
5. Implement an id selector to modify a single element on the page.
   
6. Implement selectors a: link, a:visited, a:active a:hover
   

Standard 4
Format page layout using CSS.

1. Use width, height, or auto to adjust the size.
   
2. Use absolute and static to position elements.
   

Strand 4
Site Planning: Students will plan, design, implement, and maintain website(s). (Suggested time proportion 10%)

Standard 1
Analyze Project requirements.

1. Identify the purpose and audience for a website.
   
2. Identify basic principles of website usability, readability, and accessibility.
   
   • Usability: Cross browser compatibility.
   • Readability: contrast, size, font, and color.
   • Accessibility standards that address the needs of people with visual and motor impairments, such as using alt tags, strong instead of bold, etc.
3. Identify and follow steps in the website planning and development process.
   

Standard 2
Users are the focus of all design.

1. Design elements are easy to access, understand, and use.
   
2. Keep the interface simple, create consistency, use common UI elements, placement in page layout, strategically use color and texture, use typography to help increase scannability, legibility and readability, and inform your users of location, actions, or errors.
   
   • Input Controls: buttons, text fields, checkboxes, radio buttons, dropdown lists
   • Navigational Components: breadcrumb, slider, search field, icons
   • Informational Components: tooltips, icons, progress bar, notifications, message boxes
3. Plan a website by using sketches, wireframe, or site maps.
   

Strand 5
The student will create and prepare images to integrate with website designs, using image editing software. (Suggested time proportion 5%)

Standard 1
Open, edit, and save an image for effective use on your website.

1. Crop and resize various images.
   
2. Optimize an image (resize and change resolution for optimal load time).
   
3. Enhance an image to improve photo quality (red eye, autocolor, etc.).
   

Standard 2
Incorporate a logo, header into webpage.

Standard 3
Incorporate images into a webpage.

Strand 6
Exploration & Preparation for Careers in Web Development: Students will explore careers in Web Development and prepare a portfolio of projects created. (Suggested time proportion 5%)

Standard 1
Explore IT Web Development careers.

1. Identify job roles in the Information Technology (IT) industry as they apply to web development.
   
2. Understand the responsibilities, tasks, and skills each job requires. web designer, web developer, UI/UX designer, front-end web developer, back-end web developer, and full stack developer.
   

Standard 2
Create a Student portfolio

1. Prepare an electronic portfolio of projects developed in the class.
   

Performance Skills
Create a four-page website with the following minimum elements:

1. Crop and resize various images.
   
2. Consistent look and feel throughout the website.
   
3. The same page heading, navigation bar, and footer on each page
   
4. Layout with HTML5 tags (header, footer, section, article, nav, aside.
   
5. Email link(s)
   
6. Table(s) with table data (not used for layout)
   
7. Background image(s) or Background color
   
8. Hyper-link(s)
   
9. Import graphics (jpeg/gif/png/svg)
   
10. Form elements
    
11. Page titles
    
12. Font changes (color, size, style)
    
13. Original CSS3 animation (optional)
    
14. Add tag list
    
15. Students should be familiar with the vocabulary list.
    

Workplace Skills
The following workplace skills should be discussed, taught, and re-enforced in the course:

1. Communication
   
2. Teamwork
   
3. Critical and Creative Thinking
   
4. Problem Solving
   
5. Dependability
   
6. Legal requirements / expectations
   

---

http://www.uen.org - in partnership with Utah State Board of Education (USBE) and Utah System of Higher Education (USHE).  Send questions or comments to USBE Specialist - Kristina  Yamada and see the CTE/Computer Science & Information Technology website. For general questions about Utah's Core Standards contact the Director - THALEA  LONGHURST.

These materials have been produced by and for the teachers of the State of Utah. Copies of these materials may be freely reproduced for teacher and classroom use. When distributing these materials, credit should be given to Utah State Board of Education. These materials may not be published, in whole or part, or in any other format, without the written permission of the Utah State Board of Education, 250 East 500 South, PO Box 144200, Salt Lake City, Utah 84114-4200.