This week, we examine CSS syntax, specificity, and semantic class names. We discuss loading CSS, the CSS box model and related properties, and the differences between inline, block, and inline-block elements in the flow layout. The week also covers debugging CSS using the browser DevTools and applying the box model to create various common layouts. The main assignment for this week involves creating CSS for an existing HTML page to match a requested appearance.

This week, we cover some common web design concepts, such as placeholder text and images, the issues that drive and complicate font selection, and important accessibility issues such as respecting text size and alt text. We examine some common misunderstandings regarding copyright law and how this impacts work as a web developer. We explore more layout options with CSS, learning about Flexbox, Grid Areas, and multi-column grids. We discuss the meanings and implementation of responsive and adaptive design in web pages. The main assignment for this week provides an approximate layout with changes between desktop sizes and mobile sizes and asks you to write the HTML and CSS to create a solution.

This week, we focus on the structure and layout of HTML forms, covering the syntax of various form-related elements and the related basic accessibility needs and mistakes, along with the limited HTML-based validation available for forms. I present common layouts for form labels and fields, including exceptions, and discuss how these layouts are or are not beneficial for your user experience. We also cover the different options for the position property and how these options are used to resolve common web design desires, including building a "dropdown" navigation menu. The main assignment for this week requires you to match a requested layout on a form that will submit data to a provided server.

This week, we introduce BEM (Block, Element, Modifier) class naming conventions and explore their use, reasoning, and potential benefits. We cover common UI/UX concepts such as hero images, calls-to-action (CTAs), the concept of "the fold," panels, cards, and breadcrumb navigation.We also dive into the syntax and practical application of CSS transforms, transitions, and animations. Finally, we will learn to restrict any animation to respect user settings about reduced motion and add motion to our dropdown navigation example.

This week provides an introduction to JavaScript, focusing on key concepts and practical applications. You will explore how to load JavaScript and understand its basic syntax through this week's readings and quizzes. Topics such as variables, functions, arrays, objects, conditionals, loops, and lexical scope will be discussed, alongside some video animations to illustrate more complex concepts. We will also delve into the Document Object Model (DOM), a method of manipulating web pages dynamically using JavaScript. Finally, we will explore debugging techniques used to help identify and fix errors. To reinforce your learning, you will complete an assignment in which you will build a "Rock-Paper-Scissors" game that integrates buttons and console interactions, thus demonstrating the above core skills.

This week, we deepen your understanding of JavaScript by introducing advanced syntax concepts, including spread and rest operators, destructuring, JSON, and regular expressions. You will explore how to interact with the DOM by manipulating node contents and handling JavaScript events, reinforced with quizzes to check your understanding. This week also covers JavaScript-based form validation, highlighting best practices, common pitfalls, and the importance of balancing front-end convenience with backend security. The week culminates with an assignment where you create a form submission feature with integrated JavaScript validation, applying key concepts from the lessons to ensure functionality in web applications.