Unit 5: Scripting

Overview

Few web pages today are designed in isolation. Each page is typically part of a much larger site, with a common user interface providing visitors with a cohesive sense of place. Consistency across pages on a site benefits users, since they don't have to find the bearings with each new page, and can instead focus on the site content. It also benefits the owner of the site as they provide a comfortable environment that users will enjoy returning to. In this lesson, students learn about organizing website content and providing a navigational system that is consistent across the site. Students also learn about server-side technologies that allow common code to be shared by multiple files across the site, including external style sheets and server-side includes.

This unit can be very challenging for some students, but it can also be very rewarding, especially for students who are comfortable working through abstract code. For those who aren't, it's important for them not to get discouraged. Help them to do their best, but remind them that most real world web design and development is done in teams, with all team members bringing unique skills to the table. Some are good at writing code, others are good and creating graphics or laying out visual designs, others are good at working with clients and helping to translate their needs into a deliverable product. Depending on how many students are struggling with this content, portions of it (for example, the hands-on JavaScript exercises in Module 2, Lessons 2 through 5) could be setup as extra-credit activities for advanced students.

Estimated time required: 8 to 10 hours

Learner Outcomes

Students will:

• be able to name and describe some of the advanced technologies that are used to deliver web content.
• be able to explain the difference between client-side and server-side scripting.
• be able to define progressive enhancement.
• be able to identify what technologies are being used to implement particular websites or web features.
• be able to tell when Javascript has triggered an error in their web browser
• have gained practice understanding Javascript error messages and applying them toward correcting errors in Javascript code.
• be able to use a built-in JavaScript object to retrieve data.
• be able to use the HTML Document Object Model (DOM) to get an HTML object from a web page.
• be able to assemble multiple parts into a character string using Javascript.
• be able to change the content of a web page using JavaScript.
• have learned to use if/then/else loops in Javascript.
• have learned to apply basic math and logic to creating a functional JavaScript program.
• have used the setInterval() method to repeatedly execute a JavaScript function at regular intervals.
• have applied CSS to stylize content that was created with JavaScript.
• be able to use CSS to hide and display content.
• be able to use JavaScript to change and HTML element's CSS properties.

Modules

• Module 1: Overview of Scripting on the Web
• Module 2: Javascript
• Module 3: Reflections

Assessment

See the Unit 5 Question Bank for sample questions, organized by module. These questions could be used as needed for quizzes and exams. See also our Recommended Assessment for the overall course.