Standards in this Framework
Standards Mapped
Mapped to Course
Standard | Lessons |
---|---|
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 |
|