Standards in this Framework
| Standard | Description |
|---|---|
| WD2.1.1 | Use advanced HTML5 elements to create website. |
| WD2.1.1a | Add SVG images (i.e.: image map, icons, logos, etc.) (You can use original images or use a library of SVG images) |
| WD2.1.1b | Code HTML forms on websites (i.e.: radio, checkbox, text field, text area, field set, dropdown lists, legend, etc.) |
| WD2.1.1c | Code a submit button: GET - good for non-secure data & has a limited number of characters |
| WD2.1.1d | Code a submit button: POST - secure and no size limitations |
| WD2.1.1e | Understand the action that will run on the server on the form submit button. (PHP file) |
| WD2.1.1f | Code frames or add the canvas element on a website |
| WD2.1.1g | Incorporate in-line JavaScript on a webpage |
| WD2.1.1h | Incorporate internal JavaScript on a webpage |
| WD2.1.1i | Incorporate external JavaScript on a webpage |
| WD2.2.1 | Understand the use of various CSS selectors. |
| WD2.2.1a | Understand the cascade order for browser default, inline, internal, and external style sheet |
| WD2.2.1b | Code element selections to modify HTML elements (tag, ID, & classes) |
| WD2.2.1c | Code contextual selectors to modify nested elements (i.e.: footer nav (}, header ul (}, etc.) |
| WD2.2.1d | Code pseudo class selectors (i.e.: a: link, a:visited, a:active a:hover) |
| WD2.2.1e | Code pseudo element selectors (e.g. ::after{clear:both}, p:: first-line{color: #OOFF00;}) |
| WD2.2.2a | Format page layout with advanced CSS. |
| WD2.2.2b | Use grids, flexbox, or a combination for page layouts |
| WD2.2.2c | Use width, height, or auto to adjust the size of the elements |
| WD2.2.2d | Code navigation bars |
| WD2.2.2e | Use text align, margin, and padding |
| WD2.2.2f | Use float to position elements |
| WD2.2.3a | Build responsive websites. |
| WD2.2.3b | Media queries |
| WD2.2.3c | SVG & picture elements |
| WD2.2.3d | Responsive text size - using rem, vh, and vw in css |
| WD2.2.3e | Responsive navigation bar |
| WD2.2.3f | Introduce the concept of frameworks like: BootStrap, Query, Vue.js, Nodejs, etc. |
| WD2.2.4 | Code animation and graphics with advanced CSS. |
| WD2.2.4a | Code buttons. (i.e.: rounded, colored, etc.) |
| WD2.2.4b | Code image overlay hover. (i.e.: Fade-in, slide-out, etc.) |
| WD2.2.4c | Code image slider or carousel |
| WD2.3.1 | Create a website plan and pitch for a client. |
| WD2.3.1a | Identify basic principles of website usability, readability, and accessibility |
| WD2.3.1b | Plan a website by using sketches, website hierarchy, wireframe, or a site map |
| WD2.3.1c | Communicate with others (such as peers and clients) about design and content plans |
| WD2.3.1d | Produce website designs that work on various devices and browser versions/configurations |
| WD2.3.1e | Plan, communicate, or present a client's website before, during or after website development |
| WD2.3.2 | Create content for website. |
| WD2.3.2a | Create and prepare 2D images. gif, .png, jpg, svg |
| WD2.3.2b | Prepare rich media, such as, video, sound, or animation |
| WD2.3.2c | Identify when to use various image and digital media file formats |
| WD2.3.2d | Optimize images for web content, such as resize, resolution, compress, thumbnails |
| WD2.3.2e | Understand the use of favicons |
| WD2.3.2f | Identify how to avoid violating copyright rules |
| WD2.3.2g | Demonstrate the use of semantic elements such as: audio, video, and figure |
| WD2.3.3 | Uploading and maintaining a site. |
| WD2.3.3a | Understand and be able to describe the capabilities of web servers |
| WD2.3.3b | Differentiate between types of IP addresses |
| WD2.3.3c | Describe a static IP address |
| WD2.3.3d | Describe a Dvnamic IP address |
| WD2.3.3e | Differentiate between ipv4 and ipv6 |
| WD2.3.3f | Conduct basic technical tests such as validating the website (W3C compliant), accessibility, SEO, etc. |
| WD2.3.3g | Present webpages to others for quality assurances (QA) such as team members and clients for feedback and evaluation on technical merits and usability |
| WD2.3.3i | Identify methods for collecting site feedback, such as using counters, feedback forums, Google Analytics, Google Webmaster Tools |
| WD2.3.3k | Provide site maintenance using bug reports, backups, and promotion |
| WD2.3.3l | Document all aspects of website maintenance |
| WD2.3.3m | Identify internet protocols: http, https, ftp |
| WD2.3.4 | Work as a team to create a website. |
| WD2.3.4a | Use good oral and written communication skills as a team member |
| WD2.4.1a | Introduce JavaScript and how it is used in web development |
| WD2.4.1b | Include some simple JavaScript in your website. |
| WD2.4.2a | Introduce functions |
| WD2.4.2b | Create custom functions - for example: function myFunction() {alert("Hello World!");} |
| WD2.4.3 | Introduce variables and uses - for example: var name = prompt("Enter you name: "); alert("Your name is" + name); |
| WD2.4.4a | Learn how to gather input from the user |
| WD2.4.4b | Store user input into a variable |
| WD2.5.1 | Build an interactive response website |
| WD2.5.2 | Participate in a CTSO, Utah Digital Media Arts Festival, or competition |
