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.

Performance Skills

• Understand copyright as it applies to you.
• Understand a basic AUP agreement.

Strand 2
Fundamentals of HTML5: Students will create a multi-page website using good coding practice (Such as those found in W3Schools.) (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.
   
3. Use meta tags for page documentation.
   
4. Use appropriate comments.
   

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
Code a website 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 the following elements and attributes.

1. Create pages with the following block elements: html, head, body, style, header, nav, main, section, footer, div.
   
2. Create pages with the following tags and attributes. (DOCTYPE, title, h1, h2, h6, p, br, meta, etc.)
   
3. Code a website 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 HTML forms, buttons, text fields, checkboxes, and radio buttons. (Form does not need to submit to an actual database or email.)
   

Performance Skills
Students will code a website with:

1. HTML5 semantic tags (header, footer, section, article, nav, aside)
   
2. Meta tags
   
3. Use special characters
   
4. Hyperlink(s) and Email link(s)
   
5. Table(s) with tabular data (not used for layout)
   
6. Image link
   
7. Lists
   
8. Form elements
   

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 websites using CSS

1. Modify background properties such as: color and image.
   
2. Modify font properties such as: font-family, size, and color.
   
3. Link to and use an online font. (i.e.: Google Fonts, Adobe Fonts, etc.)
   
4. Modify margin and padding size around elements.
   
5. Code id & class tags within HTML
   
6. Within CSS use id & class tags to modify a HTML elements.
   
7. Implement an id selector to modify a single element on the page.
   
   • Unique id tags are only used one time per page
   • “classes” can be used one or more times per page
8. Implement selectors pseudo class elements (i.e.: a:link, a:visited, a:active a:hover)
   
9. Use appropriate comments throughout your CSS
   

Standard 4
Format page layout using CSS.

1. Use width, height, or auto to adjust the size.
   
2. Use CSS Grid to layout the websites.
   

Performance Skills
Students will be able to make the following changes to a website:

1. Background image(s) or Background color
   
2. Import graphics (jpeg/gif/png/svg)
   
3. Font changes (color, size, style)
   
4. Original CSS3 animation (optional)
   

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. Plan a website by using sketches, wireframes, or site maps.
   
2. Design elements are easy to access, understand, and use.
   
3. 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.
   
4. Plan a website by using sketches, wireframe, or site maps.
   

Standard 3
Code and design a minimum three-page website. (This is integrated into every Strand.)

Performance Skills
Students will be able to:

1. Build a mock-up, sketch, or wireframe of a website
   
2. Check for cross browser compatibility, readability, and accessibility
   

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.
   

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.