GLEN RIDGE PUBLIC SCHOOLS MATHEMATICS MISSION STATEMENT AND GOALS

Course Title: Advanced Web Design Subject: Mathematics / Computer Science Grade Level: 9-12 Duration: 0.5 year Number of Credits: 2.5 Prerequisite: Grade of A or higher in Web Design Elective or Required: Elective Course Description: This course will build upon the topics learned in Web Design and delve into more advanced concepts. Topics covered include: Web Servers and FTP (and getting a web site online), advanced web scripting languages, server-side scripting versus client-side scripting, Adobe Flash animation, and, time permitting, data manipulation using Extensible Markup Language (XML). GLEN RIDGE PUBLIC SCHOOLS MATHEMATICS MISSION STATEMENT AND GOALS Mathematics and Computer Science are an integral part of our lives. Students must be actively involved in their mathematics education with problem solving being an essential part of the curriculum. The mathematics and computer science curricula should emphasize thinking skills through a balance of computation, intuition, common sense, logic, analysis and technology. Students will be engaged and challenged in a student-centered learning environment that is developmentally appropriate. Students will communicate mathematical ideas effectively by applying hands-on manipulatives, basic computational skills, mathematical models, and technology in order to solve practical problems. Author: Kevin George Date Submitted: Summer 2011

New Jersey Core Curriculum Standards The units that comprise this curriculum meet the following NJ state core curriculum content standards: Technology Literacy Standards: 8.1 Educational Technology. All students will use digital tools to access, manage, evaluate, and synthesize information in order to solve problems individually and collaboratively and to create and communicate knowledge. 8.2 Technology Education, Engineering, and Design. All students will develop an understanding of the nature and impact of technology, engineering, technological design, and the designed world, as they relate to the individual, global society, and the environment. 21st-Century Life and Careers: 9.1 21st-Century Life & Career Skills. All students will demonstrate the creative, critical thinking, collaboration, and problem-solving skills needed to function successfully as both global citizens and workers in diverse ethnic and organizational cultures. 9.3 Career Awareness, Exploration, and Preparation. All students will apply knowledge about and engage in the process of career awareness, exploration, and preparation in order to navigate the globally competitive work environment of the information age. 9.4 Career and Technical Education (C. Arts, A/V Technology, & Communications Career Cluster; K. Information Technology Career Cluster). All students who complete a career and technical education program will acquire academic and technical skills for careers in emerging and established professions that lead to technical skill proficiency, credentials, certificates, licenses, and/or degrees. Math Standards: 4.5 Mathematical Processes. All students will use mathematical processes of problem solving, communication, connections, reasoning, representations, and technology to solve problems and communicate mathematical ideas.

Section 0: Introduction to Advanced Web Design Unit 0.1: Servers and FTP Approximate Duration: 2 days 1. What is a web server? 2. What is the difference between various web servers? 3. How do I put files on a web server? 1. Understand and explain the definition and functionality of a web server. 2. Explain the capabilities of various web servers (i.e., Windows vs. UNIX; does it support various server-side scripting languages?; etc). 3. Explain and use FTP (File Transfer Protocol) to get pages onto a web site. Students will use FTP to upload files to a web server Software: FTP Software

Approximate Duration: 3 days Section I: JavaScript Unit 1.1: Introduction to JavaScript 1. What is JavaScript? 2. How can I use JavaScript to enhance my web pages? 3. How do I write basic JavaScript? 4. How do I integrate JavaScript into my web pages? 1. Understand and explain the basic history of the development of JavaScript. 2. Explain the difference between Java and JavaScript. 3. Explain the difference between Interpretive Languages and Compiled Languages. 4. Write a very basic JavaScript, including printing to the screen. 5. Include JavaScript in an HTML file. 6. Explain the concept of reserved words and basic syntax in JavaScript. 7. Explain the concept of functions. Students will complete basic JavaScript applications, along the lines of a Hello World application Mozilla Developer Site: https://developer.mozilla.org/en/javascript/ Ajaxian Developer Site: http://ajaxian.com/ W3Schools Javascript Tutorial: http://www.w3schools.com/js/

Unit 1.2: Data Types, Variables, and Arithmetic Operations Approximate Duration: 3 days 1. What are data types? 2. What are variables? 3. How do I save information for later use? 4. How do I perform mathematical operations? 1. Explain and use the different data types in JavaScript. 2. Explain and use variables in JavaScript. 3. Explain and use mathematical operators. 4. Explain and use arrays. 5. Time Permitting: Perform type conversions on variables in JavaScript. Students will complete various JavaScript applications, some examples include: Adder, Temperature Converter, Area of a Circle, Test Averages, Piggy Bank Mozilla Developer Site: https://developer.mozilla.org/en/javascript/ Ajaxian Developer Site: http://ajaxian.com/ W3Schools Javascript Tutorial: http://www.w3schools.com/js/

Unit 1.3: Functions Approximate Duration: 1 week 1. How do I write reusable code? 2. How do I write code that will utilize information passed to it (parameters or arguments)? 1. Explain and use JavaScript built-in methods. 2. Explain and use functions. 3. Explain and use parameters. Students will complete various JavaScript applications, some examples include: Reworking previous assignments to use functions; Set Picture; SetTimeout; Clock. Mozilla Developer Site: https://developer.mozilla.org/en/javascript/ Ajaxian Developer Site: http://ajaxian.com/ W3Schools Javascript Tutorial: http://www.w3schools.com/js/

Unit 1.4: Flow of Control and Form-Handling Approximate Duration: 2 weeks 1. How do I conditionally control the flow of an application? 2. How do I repeat a section of code a number of times, without having to retype the code repeatedly? 1. Create forms in HTML. 2. Explain and determine the flow of control in an application. 3. Explain and use Boolean expressions. 4. Explain and use relational and logical operators. 5. Explain and use if and if-else statements. 6. Validate forms using conditionals. 7. Time Permitting: Explain and use while loop statements. 8. Time Permitting: Use counters to control loops. 9. Time Permitting: Use increment and decrement operators. Students will complete various JavaScript applications, some examples include: o If Statements: Guessing Game; Grade Converter; Even-Odd; Weather; Survey; Slideshow o Loops: Counter; Repeater; Unique Numbers Cumulative Test Mozilla Developer Site: https://developer.mozilla.org/en/javascript/ Ajaxian Developer Site: http://ajaxian.com/ W3Schools Javascript Tutorial: http://www.w3schools.com/js/

Unit 1.5: Event Handling Approximate Duration: 1 week 1. How do I have JavaScript code execute in response to an event (i.e., click, mouseover, etc)? 1. Explain and use the onclick event procedure. 2. Explain and use the onmouseover event procedure. 3. Explain and use the onmouseout event procedure. Students will complete various JavaScript applications, some examples include: Reworking previous assignments to use Events; MouseOver Effects; Move Picture; Swap Divs; Photo Gallery. Cumulative Test Mozilla Developer Site: https://developer.mozilla.org/en/javascript/ Ajaxian Developer Site: http://ajaxian.com/ W3Schools Javascript Tutorial: http://www.w3schools.com/js/

Section II: Server-Side Scripting PHP (Hypertext Preprocessor) Unit 2.1: Introduction to Server-Side Scripting Approximate Duration: 3 days 1. What is the difference between Server-Side Scripting (PHP, ASP, etc) and Client-Side Scripting (JavaScript, etc)? 2. When would I use Server-Side Scripting? 3. What is the difference between PHP and ASP (Active Server Pages)? 4. How do I integrate PHP into my web pages? 1. Understand and explain the differences between Server-Side Scripting and Client-Side Scripting. 2. Understand and explain the differences between PHP and ASP. 3. Write very a basic PHP script, including how to print to the screen. 4. Include PHP in an HTML file. Students will complete basic PHP applications, along the lines of a Hello World application Yahoo! Developer Network (PHP): http://developer.yahoo.com/php/ Zend PHP 101: http://devzone.zend.com/node/view/id/625 WebMonkey PHP Tutorial for Beginners: http://www.webmonkey.com/2010/02/php_tutorial_for_beginners/

Unit 2.2: Data Types, Variables, Arithmetic Operations, and Flow of Control Approximate Duration: 2 weeks 1. How do I use data types, variables, and mathematical operations in PHP? 2. How do I use decision statements and loops in PHP? 3. How do I pass variables? 4. How do I display different content based on browser? 1. Explain and use data types, variables, and mathematical operators in PHP. 2. Explain and use if and if-else statements in PHP. 3. Explain and use while loops in PHP. 4. Pass variables from one page to another. 5. Display dynamic content based on browser. Students will complete various PHP applications, some examples include: Many of the same assignments from JavaScript, reworked for PHP; Passing Variables; Browser Detect Yahoo! Developer Network (PHP): http://developer.yahoo.com/php/ Zend PHP 101: http://devzone.zend.com/node/view/id/625 WebMonkey PHP Tutorial for Beginners: http://www.webmonkey.com/2010/02/php_tutorial_for_beginners/

Unit 2.3: Sending E-Mail Approximate Duration: 1 week 1. How do I send email from a web page using E-Mail? 2. How do I send form data over E-Mail? 1. Explain and use the SMTP server and related PHP commands. 2. Create a simple feedback form, to be sent over email. 3. Give error messages if a form does not send successfully. Students will complete various PHP applications, some examples include: Survey; Contact Us. Cumulative Test / Project Yahoo! Developer Network (PHP): http://developer.yahoo.com/php/ Zend PHP 101: http://devzone.zend.com/node/view/id/625 WebMonkey PHP Tutorial for Beginners: http://www.webmonkey.com/2010/02/php_tutorial_for_beginners/

Time Permitting: Unit 2.4: Uploading Files through a Form Approximate Duration: 1 week 1. How do I create a page through which people may upload files? 1. Create an Upload Files form. 2. Collect and save files uploaded, using PHP. Students will complete various PHP applications, some examples include: Survey; Contact Us. Yahoo! Developer Network (PHP): http://developer.yahoo.com/php/ Zend PHP 101: http://devzone.zend.com/node/view/id/625 WebMonkey PHP Tutorial for Beginners: http://www.webmonkey.com/2010/02/php_tutorial_for_beginners/

Section III: Adobe Flash Unit 3.1: Introduction to Adobe Flash Approximate Duration: 2 weeks 1. What is Adobe Flash? 2. What types of things can I do with Flash? 3. How do I create and publish a basic Flash movie? 4. How do I integrate Flash into my web pages? 1. Understand and explain the basic features and limitations of Flash. 2. Explain and use the Adobe Flash interface/workspace, including: Library Panel, Timeline, Properties Inspector, Tools Panel. 3. Create, publish, and save a basic Flash movie. Students will a complete basic Flash application, such as a Slideshow Postcard Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Unit 3.2: Working with Symbols and Graphics Approximate Duration: 1 week 1. How do I import and work with graphics in Flash? 1. Create a symbol. 2. Import and work with graphics, including Photoshop files. 3. Edit symbols in Flash. 4. Change the size and position of instances of symbols. 5. Work with Color Effects, Blend Effects, and Filters. Students will complete various Flash movies, some examples include: Image projects Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Unit 3.3: Animation Approximate Duration: 2 weeks 1. How do I animate objects in Flash? 1. Animate position. 2. Animate transparency. 3. Animate filters. 4. Animate transformations. 5. Preview animations. Students will complete various Flash movies, some examples include: Simple Animated Movies. Cumulative Test / Project Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Unit 3.4: Interactive Navigation Approximate Duration: 2 weeks 1. How do I create Flash Animations that may be nonlinearly navigated by the user? 1. Create and use button symbols. 2. Name button instances. 3. Explain and use basic ActionScript. 4. Write ActionScript to create nonlinear navigation. Students will complete various Flash movies, some examples include: Tour Movie; Menu Movie. Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Unit 3.5: Working with Text Approximate Duration: 1 week 1. How do I create and use text in Flash? 2. How do I use text as a hyperlink? 1. Add and edit text on the Stage. 2. Apply style and formatting options to text. 3. Add hyperlinks to text. 4. Use editable text for user input. 5. Dynamically change text content. Students will complete various Flash movies, some examples include: Newspaper Movie; Real Estate Movie. Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Unit 3.6: Publishing Flash Documents Approximate Duration: 1 week 1. How do I put my Flash movie on a web page? 1. Test a Flash document. 2. Explain and use bandwith and the Bandwith Profiler. 3. Change publishing settings for a document and add metadata. 4. Publish an SWF file and its HTML file. 5. Detect the version of Flash Player a viewer has installed. Students will publish their previous Flash movies. Cumulative Test / Project Software: Adobe Flash CS5; Notepad; Adobe Dreamweaver CS5 Adobe Flash Dev Center: http://www.adobe.com/devnet/flash.html FlashPerfection: http://www.flashperfection.com/ Entheos Flash Resources: http://www.entheosweb.com/flash Google Images: http://www.google.com/imghp?hl=en&tab=wi

Time Permitting: Section IV: XML (extensible Markup Language) Unit 4.1: XML (extensible Markup Language) Approximate Duration: 1 week 1. What is XML? 2. How do I write basic XML? 1. Explain and use the rules for writing XML. 2. Create root elements and child elements. 3. Nest elements. 4. Add attributes to elements. 5. Write comments. 6. Explain and use CDATA. Students will complete various XML data files, some examples include: Seven Wonders of the World; My Favorite Sports Team. W3Schools XML Tutorial: http://www.w3schools.com/xml/ O Reilly XML Site: http://www.xml.com/ W3C XML Specification: http://www.w3.org/tr/rec-xml/

Unit 4.2: XML (extensible Style Language for Transformations) Approximate Duration: 2 weeks 1. How do I format XML for viewing on the web? 1. Explain the concept of XSLT. 2. Create a basic XSLT style sheet. 3. Use XSLT to create a root template, output HTML, and output values. 4. Use XSLT to loop through nodes. 5. Use XSLT to process nodes conditionally. 6. Use XSLT to sort nodes. Students will apply XSLT to the XML files they have created for various outputting assignments. W3Schools XML Tutorial: http://www.w3schools.com/xml/ O Reilly XML Site: http://www.xml.com/ W3C XML Specification: http://www.w3.org/tr/rec-xml/