HTML5 Application Development Fundamentals MTA Exam 98-375 HTML5 Application Development Fundamentals

Manage the Application Life Cycle 98-375: OBJECTIVE 1 Manage the Application Life Cycle

LESSON 1.1 Understand the platform fundamentals

overview Lesson 1.1 In this lesson, you will review the following: Packaging and the run-time environment, including: App package App container Credentials/permission sets Host process Leveraging existing HTML5 skills and content for slate/tablet applications

GUIDING questions Lesson 1.1 How does a web designer accommodate the various devices that might be used to view a website? What must be considered when selecting a host for your website or application? How can HTML5 enhance the user experience on a slate or tablet hardware platform? Guiding Questions Functions as tool to recall the prior knowledge on the technology. Students write the answers in their notes and these answers are discussed during the Lesson Review topic. How does a web designer accommodate the various devices that might be used to view a website? Since the introduction of smaller devices used to access the Internet (such as slates, tablets, smartphones, and more) web developers have had to consider how various platforms handle the new HTML5 features. What must be considered when selecting a host for your website or application? The process of hosting a website or web application involves identifying a company that offers the necessary services to place your application on their server (typically for a charge) and make it available to the public. When choosing a host, you should consider security, reliability, scalability, and technical support. For example, IIS provides web services and the necessary platform required to run most websites and applications. How can HTML5 enhance the user experience on a slate or tablet hardware platform? A major feature of HTML5 is the elimination of the dependency on browser plug-ins, which allows the user to view content without relying on other software such as Flash or Microsoft Silverlight®.

Lecture Lesson 1.1 Application Package and Application Container An application local package is an application container that can be used to install your application on your local machine or another computer for testing and then final implementation. To package a website: Microsoft® Expression® Web: Select Site, Export to Web Package. Install and run the package Copy the test layout folder and its contents to the test computer (this is created from the prior step). Import the Web Package on the test computer for testing. Lecture slide: This slide is intended to discuss the process of packaging the final product for testing and eventual deployment as a web site or an application in an application store. See the demonstration on next slide.  

DEMONSTRATIOn Lesson 1.1 Packaging your website or application In this demonstration, you will see how to: Create a local package for testing on another machine. The target machine must have Expression Web installed to import and test the new site. Demonstration slide: Prior to the demonstration make sure you have a website created using Expression Web. Follow the steps in the slide, then navigate to the folder where you saved the package to show the students, now it is ready to be transferred to another platform for additional testing. Open an existing website in Expression Web 4. From the Site dropdown menu, choose Export to Web Package… In the next dialog box, add the files from your site to be included. Using the properties button, add a title and description to your package. Click OK and save the package in a folder on your computer.

Lecture Lesson 1.1 Credentials and Permission Sets When preparing to deploy your application or website, it is important to consider the security measures needed for the site and data. The client must present the proper credentials. Users must be registered and sign in with correct user name and password. Lecture slide: Ask the students to describe potential threats? How can they authenticate the client? What is the difference between using IIS Security and ASP.NET security? For example, do users have to login before gaining access? Do the permission sets vary by type of user? Explain

Lecture Lesson 1.1 Host Process With the variety of products that users can use to view a website or application, it is even more critical to choose the right host. To become active, a service must be hosted within a run-time environment that creates it and controls its context and lifetime. A hosting environment must meet the needs of the application deployment, such as: IIS - Internet Information Services Managed application Windows® Services Lecture slide:  preview this site for more information on the hosting process and various platforms (copy and paste into a browser): http://msdn.microsoft.com/en-us/library/ms730158.aspx

Lecture Lesson 1.1 Leveraging HTML5 Skills and Content Web applications are web pages that provide a focused solution to a task and conform to certain display guidelines. Slate or tablet application guidelines Optimize web pages correctly. Scale content for the graphics device. Use HTML5 content to check for browser compatibility and accommodate the display for a slate or tablet device.

DISCUSSION Lesson 1.1 What is meant by development platforms? For example, a program might be created to run on a Windows desktop platform. Can you think of addition platforms that should be considered? What is the current version of each platform? Look at the Internet Explorer® 9 Guide for Developers: http://msdn.microsoft.com/en-us/ie/hh410106.aspx What HTML5 features are included in Internet Explorer 8? What new features are in Internet Explorer 9? This can be a whole group discussion or you can put them in groups and then compare answers as a whole group. Development platforms include answers such as Windows, Internet Explorer, Windows Phone, Tablets, etc. The current version answers might vary, but the students might say: IE9 or Windows 7 Additional features can include items such as support for HTML5. http://msdn.microsoft.com/en-us/ie/hh410106.aspx

In-Class Activity Lesson 1.1 Directions: Read the scenario described in the In-class Activity document. Answer the questions that follow. The In-class Activity document is 98-375-ENU-1.1-IC. The Answer Key document is 98-373-ENU-1.1-IC_Key. Cassie Hicks is just starting a teaching position at a local high school and has been assigned to teach a web design course in addition to computer science courses. To prepare for the course, Cassie needs to make sure she knows the latest trends and tools used in the industry. She quickly learns that the biggest change is the move from HTML4 to HTML5. Cassie decides to create a table with a list of some of the major changes and the current support by browser version. She can then use this table to help her students understand how these types of changes are implemented incrementally by browser manufacturers and why they must always test in various browsers for compatibility.   Content: Where should Cassie start looking for information on HTML5? Why is it important to understand the support of HTML5 on various platforms? See the Key for the completed tables.

REVIEW Lesson 1.1 Can you answer these? How does a web designer accommodate the various devices that might be used to view a website? What must be considered when selecting a host for your website or application? How can HTML5 enhance the user experience on a slate or tablet hardware platform? Answers: How does a web designer accommodate the various devices that might be used to view a website? Since the introduction of smaller devices used to access the Internet (such as slates, tablets, smartphones, and more) web developers have had to consider how various platforms handle the new HTML5 features. What must be considered when selecting a host for your website or application? The process of hosting a website or web application involves identifying a company that offers the necessary services to place your application on their server (typically for a charge) and make it available to the public. When choosing a host, you should consider security, reliability, scalability, and technical support. For example, IIS provides web services and the necessary platform required to run most websites and applications. How can HTML5 enhance the user experience on a slate or tablet hardware platform? A major feature of HTML5 is the elimination of the dependency on browser plug-ins, which allows the user to view content without relying on other software such as Flash or Microsoft Silverlight®.

ADDITIONAL RESOURCES Lesson 1.1 MSDN Resources Building Apps with HTML5: What You Need to Know http://msdn.microsoft.com/en-us/magazine/hh335062.aspx MSDN® Developer Samples: Learn Through Code http://code.msdn.microsoft.com/site/search?f%5B0%5D.Type=Technology&f%5B0%5D.Value=HTML5 Learn HTML5 in 5 Minutes! http://msdn.microsoft.com/en-us/hh549253  New! HTML 5 and CSS: Six Complete Lessons http://blogs.msdn.com/b/mis_laboratory/archive/2011/10/18/new-html-5-and-css-six-complete-lessons.aspx Other Resources W3 Schools http://www.w3schools.com/html5/default.asp A vocabulary and associated APIs for HTML and XHTML http://dev.w3.org/html5/spec/Overview.html