River Dell Regional School District Web Design Curriculum

Transcription

1 2015 Mr. Patrick Fletcher Superintendent River Dell Regional Schools Ms. Lorraine Brooks Principal River Dell High School Mr. Richard Freedman Principal River Dell Middle Schools Mr. William Feldman Assistant Superintendent of Curriculum and Instruction Web Design Committee Saratheresa Bartelloni George Tucci

2 TABLE OF CONTENTS Rationale Page 3 Unit One: Tools, Techniques & Applications Page 4 Unit Two: Everyday Design Page 8 2

3 RATIONALE Upon creation of the internet, global societies began to seek strategies to share information and communicate globally through a series of detailed codes. Initially, a great digital divide separated the nations with access and without. As the world adjusted to meet the demands of a digital society, the World Wide Web formed. Led by the likes of Tim Burners-Lee, new language was formed to allow information to be easily exchanged. Through the creation of Hypertext Transfer Protocol (HTTP) and Hyper Text Markup Language (HTML), The World Wide Web was first formed with a built-in web editor. Webpages, as we know them today, were preceded by simple pages containing merely information with little attention paid to images, or stylistic enhancements. With advancements in processing power and internet speeds, and an increase in web presences, the World Wide Web continued to evolve. To meet the demands of this fastpaced evolution, the W3 consortium or W3.org was created to oversee the rules of internet and World Wide Web regulations and specs. This organization continues to write the standards for all web developers, hosts and managers negotiating formats which serve as standards to increase the visual aspect of web pages. Through the efforts of W3, form marries function and the art, rather than just the technical, becomes a large part of web design. In this course, students will consider both the technical needs and aspects of properly functioning web pages as well as the visual element in the overall design. Students will work to create sites that are user-friendly, reach a targeted audience, serve a specific purpose and include coded aspects to increase the accessibility and functionality on various devices, from desktop to mobile. 3

4 WEB DESIGN CURRICULUM UNIT ONE: TOOLS, TECHNIQUES & APPLICATIONS STANDARDS D A D D A B B A A E.2 Distinguish innovative applications of the elements of art and principles of design in visual artworks from diverse cultural perspectives and identify specific cross-cultural themes. Justify the impact of innovations in the arts (e.g., the availability of music online) on societal norms and habits of mind in various historical eras. Synthesize the elements of art and principles of design in an original portfolio of two- and three-dimensional artworks that reflects personal style and a high degree of technical proficiency and expressivity. Analyze the syntax and compositional and stylistic principles of twoand three-dimensional artworks in multiple art media (including computer-assisted artwork), and interpret themes and symbols suggested by the artworks. Develop informed personal responses to an assortment of artworks across the four arts disciplines (dance, music, theatre, and visual art), using historical significance, craftsmanship, cultural context, and originality as criteria for assigning value to the works. Evaluate how an artist s technical proficiency may affect the creation or presentation of a work of art, as well as how the context in which a work is performed or shown may impact perceptions of its significance/meaning. Determine the role of art and art-making in a global society by analyzing the influence of technology on the visual, performing, and multimedia arts for consumers, creators, and performers around the world. Produce and edit a multi-page document for a commercial or professional audience using desktop publishing and/or graphics software. Participate in online courses, learning communities, social networks, or virtual worlds and recognize them as resources for lifelong learning. Predict the impact on society of unethical use of digital tools, based on research and working with peers and experts in the field. 4

5 F.2 Analyze the capabilities and limitations of current and emerging technology resources and assess their potential to address educational, career, personal, and social needs A.1 Apply critical thinking and problem solving strategies during structured learning experiences C.4 Demonstrate leadership and collaborative skills when participating in online communities and structured learning experiences D.1 Interpret spoken and written communication within the appropriate cultural context E.1 Create messages for different purposes and audiences with sensitivity to cultural, gender, and age diversity, using various digital media outlets F.2 Demonstrate a positive work ethic in various settings, including the classroom and during structured learning experiences 8.1 Use digital tools to access, manage, evaluate, and synthesize information in order to solve problems and communicate knowledge BIG IDEAS/COMMON THREADS The strength and value of web design relies on an underlying structure of principles and guidelines. The organization W3 creates the rules to which web developers and browsers subscribe. Web designers weigh the use of white space, visual enhancers, graphic use and text location to guide visitors through a website structure. Unseen are the coded elements that define the structure of each site. Web designers apply an understanding of the elements and principles of art, in conjunction with site planning strategies and the use of site developing/mapping tools, to create original designs and meet the needs of the company or client. ENDURING UNDERSTANDINGS Web design tools allow designers/developers to create websites for a variety of purposes from e-commerce to blog. Web design tools allow designers to transfer files to the internet and easily update files creating sites that are current and valuable to users. ESSENTIAL QUESTIONS How has the internet and web development evolved? What is W3 and what is its role in defining web standards? How do web designers plan, organize, and build websites? What tools are available for managing and maintaining websites? 5

6 How and when are different web developing tools used? How do the application of social media and other search engine optimizers enhance search-ability? OBJECTIVES Students will be able to: Understand how search engine optimization techniques are used to drive traffic to sites. Understand how the internet s evolution has molded its usage and scope as a tool for communication Value the importance of standards as a means of efficiently and effectively connecting internet sites around the world Draw upon the logical and creative choices that must be made to maximize a website s content and suitability to a target audience Evaluate the myriad of options that determine interface design and user input strategies Make appropriate tool selections based on a specified task Utilize a combination of digital tools based upon user needs and overall site functionality Appreciate the importance of simple, intuitive and flexible design in a constantly changing digital environment develop expertise through research about a problem and make a claim to support a solution Work as a contributing member of a team to achieve specific outcomes Show respect for divergent points of view by acknowledging them Recognize how digital media impacts a person s perspective Show the self-discipline to do your best, reach a goal or perform an assigned task with good work quality Apply technology to enhance meaning, communication and productivity ASSESSMENTS Performance-based assessments Participation in class discussions, studio maintenance, and appropriate use of technology as per the district AUP Organization of files Use of site maps for planning 6

7 LEARNING ACTIVITIES Research on key changes in the history of web development and the internet (ie. W3 organization, browsers, changes in coding, etc.) Production assignment working with site mapping procedures, file management, and template creation/manipulation. Discussion and Identification of code including common HTML and CSS codes Use of existing templates and original pages through practice assignments designed to introduce various design program tools, web codes and their functions. Identification of elements present in sites and tools used to create similar elements on original pages. RESOURCES Web-resources Adobe Creative Suite applications Research Databases and image collections Hex color code charts Common web code lists Graphic Art artifacts including animated images, movie files, buttons, etc. Site maps Teacher produced handouts 7

8 WEB DESIGN CURRICULUM UNIT TWO: EVERYDAY DESIGN STANDARDS D D D D D A A B B B.3 Translate literary, musical, theatrical, and dance compositions by using them as stimulus/inspiration for corresponding visual artworks. Synthesize the elements of art and principles of design in an original portfolio of two- and three-dimensional artworks that reflects personal style and a high degree of technical proficiency and expressivity. Produce an original body of artwork in one or more art mediums that demonstrates mastery of visual literacy, methods, techniques, and cultural understanding. Analyze the syntax and compositional and stylistic principles of twoand three-dimensional artworks in multiple art media (including computer-assisted artwork), and interpret themes and symbols suggested by the artworks. Identify the styles and artistic processes used in the creation of culturally and historically diverse two- and three-dimensional artworks, and emulate those styles by creating an original body of work. Speculate on the artist s intent, using discipline-specific arts terminology and citing embedded clues to substantiate the hypothesis. Develop informed personal responses to an assortment of artworks across the four arts disciplines (dance, music, theatre, and visual art), using historical significance, craftsmanship, cultural context, and originality as criteria for assigning value to the works. Formulate criteria for arts evaluation using the principles of positive critique and observation of the elements of art and principles of design, and use the criteria to evaluate works of dance, music, theatre, visual, and multimedia artwork from diverse cultural contexts and historical eras. Evaluate how an artist s technical proficiency may affect the creation or presentation of a work of art, as well as how the context in which a work is performed or shown may impact perceptions of its significance/meaning. Determine the role of art and art-making in a global society by analyzing the influence of technology on the visual, performing, and 8

9 multimedia arts for consumers, creators, and performers around the world A.2 Produce and edit a multi-page document for a commercial or professional audience using desktop publishing and/or graphics software D.2 Demonstrate appropriate use of copyrights as well as fair use and Creative Commons guidelines E.2 Predict the impact on society of unethical use of digital tools, based on research and working with peers and experts in the field F.1 Select and use specialized databases for advanced research to solve real-world problems F.2 Analyze the capabilities and limitations of current and emerging technology resources and assess their potential to address educational, career, personal, and social needs A.1 Apply critical thinking and problem-solving strategies during structured learning experiences B.1 Present resources and data in a format that effectively communicates the meaning of the data and its implications for solving problems, using multiple perspectives D.1 Interpret spoken and written communication within the appropriate cultural context D.3 Explain why the ability to communicate in another language in an appropriate cultural context is a valuable 21st-century skill E.1 Create messages for different purposes and audiences with sensitivity to cultural, gender, and age diversity, using various digital media outlets E.2 Generate digital media campaigns in support of or opposing a current political, social, or economic issue E.5 Compare laws governing the unethical use of media in different countries A.1 Apply critical thinking and problem solving strategies during structured learning experiences C.4 Demonstrate leadership and collaborative skills when participating in online communities and structured learning experiences D.1 Interpret spoken and written communication within the appropriate cultural context E.1 Create messages for different purposes and audiences with sensitivity to cultural, gender, and age diversity, using various digital media outlets F.2 Demonstrate a positive work ethic in various settings, including the classroom and during structured learning experiences 8.1 Use digital tools to access, manage, evaluate, and synthesize information in order to solve problems and communicate knowledge 9

10 BIG IDEAS/COMMON THREADS Web developers and designers work to employ web designing tools to create sites that are meaningful, user friendly, current, and relevant. Designers work with both the target audience and desired purpose of the site in mind when creating layouts to match the site structure and desired viewing output. (ie., Tablet, mobile, etc.) ENDURING UNDERSTANDINGS Target audience and intended purpose drive design decisions when developing web pages. Consideration of emerging trends can increase traffic increasing the pages effectiveness in achieving its intended purpose. ESSENTIAL QUESTIONS What message do I intend to communicate? Who is my target audience? What is the purpose of my website? What web design solutions can be applied to the task at hand? Which tools should I use for the task? How can I ensure flexible design that easily adjusts to dynamic content and emerging trends? OBJECTIVES Students will be able to: Determine a target audience and write/design with the target audience in mind. Differentiate between purpose/site intent for example is this a portfolio or e- commerce site. Design with purpose in mind. Identify web-based options, for example blogs, social media apps, search engine optimization, static sites, Secure Sockets Layer certificates, etc. Make appropriate tool and/or application selection based on a specified task. Utilize a combination of digital tools to create original art that meets the creative task. Design with user in mind. Design with different formats in mind for example, mobile, tablet, or PC format. Develop expertise through research about a problem and make a claim to support a solution Work as a contributing member of a team to achieve specific outcomes Show respect for divergent points of view by acknowledging them Recognize how digital media impacts a person s perspective 10

11 Show the self-discipline to do your best, reach a goal or perform an assigned task with good work quality Apply technology to enhance meaning, communication and productivity ASSESSMENTS Performance-based assessments Demonstrated participation in class discussions, studio maintenance, and appropriate use of technology as per the district AUP Written quizzes Written reaction briefs on specific topics Handout-defined projects Oral Presentations Group or two-person projects LEARNING ACTIVITIES Defining web coding of all formats and evaluating the internet s importance in a current society Discussion and exploration of how the internet and web pages are used in current society. Group and individual analysis of web pages (good and bad) with emphasis on deciphering targeted audiences, page intent and hidden or obvious messages. Exercises and assignments comparing the way concepts are presented to different viewing audiences Discussion of editorial, commercial, portfolio based and documentational web site creation/use Redesigning and/or re-purposing templates/layouts to maximize their effectiveness in different venues and formats Assignments that explore workflow strategies and tool-choice options to maximize productivity Assignments that utilize text as a design element as well as a literal, communicative tool Creation and use of site structure maps for site planning purposes 11

12 RESOURCES Web-resources Adobe Creative Suite applications Research Databases and image collections Internet code charts including hex codes, html codes, css codes, etc. Teacher handouts & samples Social Media icons and applications Hands-on activities, exercises, articles and surveys 12