Learning expectations and objectives by unit for StudioWeb’s Web Foundations.
August 14, 2016
Hi!
This blog post is for educators. The following outlines the units found in my StudioWeb web design and development curriculum. If you have any questions, feel free to contact me.
Stefan
Unit 1 – HTML5:
Preamble: HTML5 is arguably the most important coding language given how widely used it is. HTML5 is the foundation language of all websites, webapps and is also used in mobile app development.
HTML5 is also a great first coding language since it is easy to understand, visual and provides a direct pathway to real-world skills which when discovered, is highly motivating to students.
With StudioWeb’s HTML5 course, students will learn the basic concepts of the Internet, web pages, markup coding and healthy coding habits that are applicable to all coding languages. Students will come away with the ability to create simple web pages and websites that contain basic user interface components such as forms, tables, list and paragraphs.
Broad objectives:
- Understanding of the basic structure of the Internet
- Understanding the basic structure of a web page
- Understanding the basic structure of a website
- Understanding coder’s tools – code editor and browser dev tools
- Ability to build a website.
Specific skills acquired:
- Students will learn the basic concepts of HTML
- Students will learn to read, write and identify HTML tags in a page
- Students will understand the basic structure of a web page
- Students will understand directory structures and how they impact html code
- Students will understand how client and server computers interact
- Students will learn about web protocols and the two most commonly used on the Web
- Students will learn about image types and their use cases
Unit 2 – CSS3:
Preamble: Building on Unit 1 HTML, students will continue to delve deeper into coding techniques and concepts, this time concentrating on CSS. CSS is the styling markup language of websites, web apps and hybrid mobile apps.
Broad objectives:
- Students will learn CSS’ role in creating user interfaces (for mobile) and websites.
- Students will learn the basic CSS concepts: selectors, CSS properties, CSS code structure, CSS declarations, CSS unit types etc.
- Students will gain a deeper understand of the DOM (document object model) and how CSS interacts with it.
- Students will learn the basic page layout types, including mobile user interface (UI) coding techniques.
- Students will explore browser development tools.
- Students will learn to build mobile layouts using advanced CSS3 techniques.
Specific skills acquired:
- Students will learn CSS Tag selectors – how CSS code is used to target HTML tags, text and other elements in an HTML page.
- Students will learn parent/child HTML tag relationships.
- Students will learn the CSS box model.
- Students will learn aspects of the CSS Cascade.
- Students will learn common layout types: fixed width, fluid and responsive
- Students will learn how CSS is included in an HTML page.
- Students will learn several selector types: tag, id, class, descendent selectors, pseudo class selectors
- Students will learn CSS positioning.
- Students will learn CSS control of fonts.
- Students will learn CSS and color.
- Students will learn CSS and images.
- Students will learn CSS menu/navbar creation techniques.
- Students will learn CSS3 media queries.
Unit 3 – JavaScript:
Preamble: Building on Unit 1 HTML and Unit 2 CSS, students will continue to delve deeper into coding techniques and concepts, this time concentrating on JavaScript. Unlike HTML and CSS, JavaScript is the programming language and it works along with HTML and CSS, to bring decision making capability to websites, web apps and hybrid mobile apps.
Broad objectives:
- Students will learn JavaScript’s role in websites and web apps.
- Students will be introduced to basic CS concepts
- Students will learn basic programming structures such as: variables, functions arrays etc.
- Students will learn how JavaScript works with HTML and CSS.
- Students will learn how to debug basic JavaScript errors.
- Students will learn how to use JavaScript to manipulate page elements on the fly in conjunction with HTML and CSS.
Specific skills acquired:
- Students will learn basic JavaScript syntax.
- Students will learn how to insert JavaScript code into pages.
- Students will learn JavaScript event handlers.
- Students will learn JavaScript error logging.
- Students will learn how to use the browser console with JavaScript.
- Students will learn basic JavaScript constructs: variables, arrays, functions, loops, conditional statements, objects.
- Students will learn DOM manipulation techniques.
- Students will learn the built in JavaScript objects.
- Students will learn how to process HTML forms.
- Students will learn how to draw on screen with JavaScript.
- Students will learn how to create animations with JavaScript.
Stefan Mischook
StudioWeb.com
