Introduction to Web Design Using Microsoft Expression
Introduction to
Web Design Using
Microsoft® Expression® Studio
Copyright
Information in this document, including URL and other Internet website references, is subject to change without notice. Unless otherwise noted, the example companies, organizations, products, domain names, e-mail addresses, logos, people, places, and events depicted herein are fictitious, and no association with any real company, organization, product, domain name, e-mail address, logo, person, place, or event is intended or should be inferred. Complying with all applicable copyright laws is the responsibility of the user. Without limiting the rights under copyright, no part of this document may be reproduced, stored in or introduced into a retrieval system, or transmitted in any form or by any means (electronic, mechanical, photocopying, recording, or otherwise), or for any purpose, without the express written permission of Microsoft Corporation.
The names of manufacturers, products, or URLs are provided for informational purposes only and Microsoft makes no representations and warranties, either expressed, implied, or statutory, regarding these manufacturers or the use of the products with any Microsoft technologies. The inclusion of a manufacturer or product does not imply endorsement of Microsoft of the manufacturer or product. Links are provided to third party sites. Such sites are not under the control of Microsoft and Microsoft is not responsible for the contents of any linked site or any link contained in a linked site, or any changes or updates to such sites. Microsoft is not responsible for webcasting or any other form of transmission received from any linked site. Microsoft is providing these links to you only as a convenience, and the inclusion of any link does not imply endorsement of Microsoft of the site or the products contained therein.
Microsoft may have patents, patent applications, trademarks, copyrights, or other intellectual property rights covering subject matter in this document. Except as expressly provided in any written license agreement from Microsoft, the furnishing of this document does not give you any license to these patents, trademarks, copyrights, or other intellectual property.
2008 Microsoft Corporation. All rights reserved.©
The names of actual companies and products mentioned herein may be the trademarks of their respective owners.
Preface
Welcome to an Introduction to Web Design Using Microsoft Expression! We are proud to offer this complete, standards-based one semester course on Web Design. Our primary objective is to provide educators and students with an extensive collection of creative teaching and learning materials that span a thorough scope of Web design topics to provide meaningful, real-world learning experiences. This curriculum and collection of teaching and learning materials focuses on such topics as beginning HTML, Web standards and accessibility, communication skills and strategies, creation of Web media, and the planning, development, publishing, and evaluation of Web sites. The project-based activities including teamwork strategiesthat reflect real-world work-skills and the activities performed by professional Web designers. We hope you and your students enjoy using these teacher-created learning materials and find them valuable in meeting your learning objectives. By providing students with opportunities to be creators, rather than only consumers, of technology, we aim to motivate the next generation to explore and develop their talents. Please tell us about your experiences and offer suggestions. We are eager to hear from you!
Background
This curriculum project is an extension and enrichment of a short Expression Web curriculum unit that was developed for United States high schools. The need for additional and more extensive materials was identified in the 2 pilot projects conducted in the fall of 2007 and spring of 2008. The following were findings from the pilots:
- 75% of for United States high schools offer a Web Design/Development class (2007)
- 71% of the educators involved in the Expression Web tutorial pilot reported that it was valuable teaching tool and they would use it again. The remaining 29% strongly agreed with that statement, yielding a full 100% accord amongst pilot educators that the Expression Web tutorial was a valuable and useful teaching resource.
- 64% of students reported that, after participating in the Expression Web tutorial, they would like to build another Web site.
- The Expression Web Tutorial, posted February 6, 2008to the Microsoft Faculty Connection ARC, was thethird most often downloaded item from the time of its posting until June 30, 2008. .
Additional Information
- This course is appropriate for advanced middle school, high school, and non-technical higher-education students.
- It is designed to appeal to a broad range of students who are interested in learning how to create content for the Web and improve their technical skills using the same software that professional Web designers use.
- In institutions that have advanced technical education incorporated into their core curriculum, these materials may be used with younger students. The shorter Expression Web tutorial was also very popular with adults who wanted to learn on their own.
- ThisWeb design course presents technology in a fun and engaging way. A beta-testing cycle with educators in a wide variety of schools was conducted in the fall of 2008.
- Based on the feedback from the students who worked with our shorter curriculum unit, we know that having successful experiences using Microsoft technology encourages students totake additional technology courses – includingprogramming and other advanced computer science and information technology (IT) courses.
- The curriculumis written using English that is accessible to non-native speakers of English. The primary software used will be Expression Web, with some experience using Expression Design.
- These teaching and learning materials are modular in nature so that educators can modify the curriculum to meet their unique classroom needs.
Topic Organization
Module1:The History and the Future of the Web1 week
Module 1 explores the past and future of Web technologies and the structure of the Web. The rights and responsibilities surrounding intellectual property rights in an electronic world are emphasized.
Module 2: HTML Basics 2 weeks
Module 2 introduces basic HTML tags and cascading style sheets (CSS) through projects designed to experiment with page design and introduces the concepts of Web standards and accessibility.
Module 3:Designing for Communication2 weeks
Module 3 explores human communication and the unique challenges that electronic modes of communication present for effective transmission of ideas.HTML projects using the code view option in Expression Web focus on the use of design principles to communicate successfully to a Web audience.
Module 4:Working with Images3 weeks
Module 4 uses Microsoft Expression Design to create images (that can be used in Web projects in Module 5). Image concepts related to scanning, digital photography, and image manipulation techniques are included.
Module 5:Beyond the Basics with Expression Web2 weeks
Module 5 introduces students to the Expression Web WYSIWYG, drag and drop environment and provides tutorials to guide them in creating a Web site.
Module 6:The Design Process3 weeks
Module 6 explores Web technology careers and simulates the design planning process of Web design professionals. Team collaboration and customer interactions are emphasized as students plan a Web site project for an organization. (The project planned in this module is created in Module 7.)
Module 7 The Production Process3 weeks
Module 7 guides students in the production of the Web site that was planned and designed in Module 6. This module is lab intensive, with the educator serving primarily as a guide and supervisor. (The planning for this module occurs in Module 6.)
Module 8Web Publishing and Maintenance2 weeks
Module 8 establishes processes and techniques for selecting hosting services, evaluating the effectiveness and usability of Web sites, and providing maintenance over time. Personal reflection on the complete Web design process, and the skills and characteristics valuable for Web technology careers is encouraged.(The project produced in Module 7 is referenced within this module.)
Note: A complete scope and sequence,as well as the alignment of standards, can be found at the end of this document.
Audience
This curriculum is designed for middle and secondary students or beginning-level post-secondary students. The learning strategies are differentiated by scaffolding levels of goals and objectives and can easily be adjusted to fit a wide range of learning levels by pacing and by adding or eliminating sections and activities. Instructors will find elements and activities included that can be used to raise the level of learning by adding refinement and sophistication to projects.
The prerequisites for the learning in this curriculum include the skills most students have already achieved by surfing the Web, using Windows applications, and handling files for opening, saving, and moving.
Standards-based curriculum
The curriculum is based upon the ISTE's National Educational Technology Standards for Students (NETS-S)
21st Century Skills
ACM Model Curriculum for K-12 Computer Science
Module / ISTE NETS-S / 21st Century Skills1 / 1 Creativity and Innovation (a)
4 Critical Thinking, Problem Solving, Decision Making (c)
6 Technology Operations and Concepts (a-d) / Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
2 / 1 Creativity and Innovation (c-d)
3 Research and Information Fluency (a, b, d)
5 Digital citizenship (a-d)
6 Technology Operations and Concepts (a-d) / Information Literacy
3 / 1 Creativity and Innovation (a,c)
4 Critical Thinking, Problem Solving, Decision Making (a-d) / Creativity and Innovation Skills
Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
4 / 1 Creativity and Innovation (a-b)
2 Communication and Collaboration (a, b, d)
3 Research and Information Fluency (b, c)
4 Critical Thinking, Problem Solving, Decision Making (a-d)
6 Technology Operations and Concepts (a-d) / Creativity and Innovation Skills
Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
5 / 6 Technology Operations and Concepts (a-d) / Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
6 / 1 Creativity and Innovation (a-d)
2 Communication and Collaboration (a, b, d)
3 Research and Information Fluency (a-d)
4 Critical Thinking, Problem Solving, Decision Making (a-d)
5 Digital citizenship (a-b) / Creativity and Innovation Skills
Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
7 / 1 Creativity and Innovation (a-c)
2 Communication and Collaboration (a, b, d)
3 Research and Information Fluency (a-d)
4 Critical Thinking, Problem Solving, Decision Making (a-d)
5 Digital citizenship (a-d)
6 Technology Operations and Concepts (a-d) / Creativity and Innovation Skills
Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
8 / 1 Creativity and Innovation (c)
2 Communication and Collaboration (a, b, d)
3 Research and Information Fluency (a-d)
4 Critical Thinking, Problem Solving, Decision Making (a-d)
5 Digital citizenship (a-d)
6 Technology Operations and Concepts (a-d) / Critical Thinking and Problem Solving Skills
Communication and Collaboration Skills
Information Literacy
Media Literacy
ICT Literacy
Life and Career Skills
Note: A complete alignment of standards to activities can be found at the end of this document and within the lesson plans of each module.
General goals and objectives
- Identify capabilities and limitations of contemporary and emerging technology resources and assess the potential of these systems and services to address personal, lifelong learning, and workplace needs.
- Make informed choices among technology systems, resources, and services.
- Demonstrate/advocate for legal and ethical behaviors regarding technology and information.
- Use technology tools and resources for managing and communicating information.
- Apply design and communication principles to Web projects.
- Routinely and efficiently use online information resources to meet needs for collaboration, research, publication, communication, and productivity.
- Select and apply technology tools for research, information analysis, problem solving, and decision making.
- Collaborate with peers and experts to compile, synthesize, produce, and disseminate information through Web technology.
- Demonstrate team and leadership skills.
- Explore careers in Web technologies.
Software system requirements
Microsoft Expression Web and Expression Design are the tools used to produce the projects in this curriculum in Modules 4, 5, 7, and 8.
- Systems: Windows Vista; Windows XP Service Pack 2
- PC with Pentium 700 or faster processor
- 512 MB of RAM or more
- 1.5 GB of available hard disk space; a portion this disk space will be freed after installation (The original download package is removed from the hard drive.)
- CD-ROM or DVD-ROM drive
- 1024 × 768 or higher resolution monitor
- Internet functionality requires Internet access
- The projects in this curriculum are built with only HTML and CSS technologies (not ASPX)
- Expression Web sites built with ASPX pages require an IIS server compatible with ASPX Web files in order to be posted on the Internet
Curriculum Resources
The majority of resources included in this curriculum are Microsoft Word documents.Educators are welcome to customize the resources, such as worksheets, tests, and rubrics, to fit the unique needs of their students and classroom.
Presentations are Microsoft PowerPoint documents.
The tutorials in this curriculum require the use of image files. Specific directions for saving and accessing those included files are detailed within each tutorial document.
Curriculum Folders and Contents
The teacher and student materials are contained within a folder for each Module and divided within that folder by day of intended use. Teacher files begin with a ‘T.’ and student files begin with an ‘S.’ files are additionally identified by the Module number, the number of the day or days for intended use, and an identifier of type.
Teacher files: T.module#.day(s)#.type_additional descriptor
Student files: S.module#.day(s)#.type _additional descriptor
File Names and Descriptions
Teacher MaterialsT.1.Timeline / A day-by-day Timelineoverview of files needed for each lesson in Module 1.
T.3.Text / Introduction to Web Design using Microsoft Expression Studio– a Textbook of eight chapters, corresponding to the eight learning Modules.
T.1.3.LP / Lesson Plan for Module 1 day 3.
T.2.3.PP / A PowerPoint presentation for Module 2 day 3.
T.3.7_8_9.R_Principles / A Rubric for Module 3 to be used on days 7-9 on the topic of design principles.
T.4.15.TB / A Test Bank for Module 4 assessment (a version without answers is also included) to be used on day 15.
T.3.Ext 1.LP / Some Modules have a folder Extended enrichment activities. These materials can be used as appropriate for more advanced student learning.
MasterStyling.wmv / Some Modules have short video training movies. They are identified by the file extension .wmv.
Student Resources
S.3.2_4_6.Tutorial / A step-by-step Tutorial for learning Expression Studio to be used on days 2, 4, & 6.
S.4.3.WS_Banners / A student Work Sheet on the topic of banners for Module 4 to be used on day 3. A key is also included.
Pedagogical Features
While this curriculum was designed to be a sequential 18-week unit of study, its modular design offers educators flexibility in selecting modules to fit existing curricula and school schedules. Please refer to the Topic List above to note which modules can be “stand-alone” units of study and those that have prerequisites and connections to other modules.
Within each Module, you will find a Module Timeline document listing the lesson plans by day, the topic of each lesson plan, and the included documents required for that lesson. This should be the first document opened in each module.
Timelines
Within each Module, you will find a Module Timeline document listing the lesson plans by day, the topic of each lesson plan, and the included documents required for that lesson. This should be the first document opened in each module.
Lesson plans
Detailed daily lesson plans are provided to guide classroom activities. Each contains the standards being addressed by the lesson, a description of the lesson, software needs, guiding questions, student-centered learning objectives, teaching strategies, additional resources and Web links, documents needed for the lesson, assessment strategies, and suggested best practices. Student activities include essential vocabulary lists, lesson tasks, and enrichment. The lessons include an abundance of learning activities designed to meet the many learning styles of your students. Please select those activities that best meet your students’ needs, your classroom setting, and your time allocations.
Presentations
All presentations are PowerPoint files that are coordinated with some of the daily lesson plans. They can serve as resources to introduce concepts before activities and also as review tools.
Supporting Textbook
The supporting e-textbook contains eight chapters that correspond to the eight curriculum modules. The text is intended as a resource for both the educator and student to support the teaching and learning in the lesson plans. The book chapters contain vocabulary lists, review questions and activities.
Tutorials
Several modules include step-by-step tutorials. These tutorials will guide students in learning Expression Web and Expression Design and producing the projects introduced in the lesson plans.
Assessment Tools
A selection of rubrics, quizzes, and test banks are provided for each module. Two versions of the quizzes and tests – one with answers and one without - are included. Please use the test items to construct assessment tools that are customized for your teaching.
Web Resources
Web resources to support or enrich the learning activities are listed within the lesson plans of each module. While these resources were available at the time of publishing, we cannot guarantee that they will remain available indefinitely. Please verify their availability before use them with students.