Helping You Study for Exam 70-480: HTML5, CSS3 and JavaScript

This blog has moved, please check it out here

Having recently passed the MS70-480 exam on HTML5, CSS3 and JavaScript, I wanted to put together a post to help other people who are studying for this exam. This is mostly a resource document but hopefully gives you a direction in which to get started studying. I should also link the resource I used when studying. I purposefully did not look at his documents while writing this because I wanted to complement, not copy, his work. So without further ado:

Implement and manipulate document structures and objects

Create the document structure

Make sure you are familiar with HTML5 semantic markup. These types of questions could ask you to translate a snippet of traditional HTML markup into markup using HTML semantic tags. Another approach would be a question which asks which semantic tag would be best suited for a given element.

Write code that interacts with UI controls

The idea of manipulating UI components with JavaScript is foundational to many of the subjects covered on the test. Be sure to brush up on the ways to select and manipulate DOM objects with JQuery, but be aware that it is equally important to be able to do these things with plain ol’ JS. So if you have spent a significant amount of time using JQuery or another library to abstract away the nuts and bolts of interacting with the DOM you may need to spend some time going back to the basics of JS and practice doing some things without the help of a library.

A couple more specific items:

For these types of questions it would be good to know how to use both canvas and SVG. Not only should you be prepared to answer questions on the syntax and structure of javascript which uses these elements but you must also be aware of the differences between the two and the reasons to choose one over the other.

Also be prepared to answer questions related to the new HTML5 media elements (audio, video) and how to implement and manipulate them.

Same with Drag and Drop

Apply styling to HTML elements programmatically

Again, be prepared to do this without JQuery. It really is a simple process to do with JavaScript, but so many of us have either not done it in a while, or never done it.

Implement HTML5 APIs

The big ones here are storage, caching, and geolocation. As with all the subjects on the exam, make sure you have the syntax down.

Establish the scope of objects and variables

Another topic that spreads itself throughout the exam. Be familiar with the ‘this’ keyword in JavaScript. It is not unpredictable, it follows a specific set of rules. Know them.

Create and implement objects and methods

Again, foundational. know how to instantiate objects. Know how to declare functions. Know how to call functions, add data to and read data from objects.

Implement program flow

Raise and handle an event

Know how to attach event handlers to objects with and without JQuery. Be aware that there are multiple ways to do both.

Know how to fire a custom event.

Know which events are available for which DOM elements and be able to correctly identify correct and incorrect event names and bindings.

Implement exception handling

Know how to implement try-catch-finally. Know the ordering of parameters in the catch and throw methods.

Implement a callback

Make sure you understand the idea of a callback and passing functions around like objects. Good practice is to write your own methods which take callbacks and trigger them at the end of their execution. Know how to write anonymous functions in JavaScript.

Create a web worker process

Read this post on webworkers in HMTL5. Implement a web worker yourself and make sure you understand how to pass messages between parent and worker as well as how to terminate the worker. Know the syntax and parameters.

Access and secure data

Validate user input by using HTML5 elements

Be familiar with the new types of input tags in HTML5. Be familiar with the pattern property and how to use it.

I’m putting this on it’s own line for a reason. Have an understanding of Regular Expressions! This applies to the next area as well. It could come up a lot.

Validate user input by using JavaScript

Regular Expressions, know them. Also know how to retrieve the text from DOM nodes with Javascript (with and without JQuery of course).

Consume data

Be able to retrieve data from web services using JQuery methods and the XmlHttpRequest Object. As always, make sure you know the syntax and meaning of parameters.

Serialize, deserialize, and transmit data

Serialize and submit a form. Ensure you know the difference between encodeUri and encodeUriComponent. Be aware of any encoding that the JQuery serialize method does.

Check out Web Sockets!

Use CSS3 in applications

Style HTML text properties

Study up on text drop shadows. Be aware of the CSS properties that can be applied to text and their effects.

Style HTML box properties

Straight from Microsoft’s test description, know appearance attributes, graphic effects and position properties. This covers pretty much all of the CSS properties. Make sure you understand relative, absolute, static and fixed positioning.

Create a flexible content layout

Make sure you know how the CSS3 flexbox works. be aware that Microsoft has it’s own browser specific implementation for IE and Win8 so make sure you recognize that.

Create an animated and adaptive UI

Transitions and transforms(2D and 3D) are fair game here. As are media queries, make sure that you understand how to format a media query and what it does.

Find elements by using CSS selectors and jQuery

This is very important. Another one of those things that bleeds over in to otherl areas of the test. There are a lot of selectors, so just knowing how to get an element by id or class doesn’t cut it. This brings me to a point about the test as a whole. Just because you a way to do something does not mean you know every way to do it. Multiple choice questions don’t allow for improvisation.

Structure a CSS file by using CSS selectors

Do you know the order (2) in which css applies styles to elements. What if you have a node which matches more than one selector? Which style gets applied?

6 thoughts on “Helping You Study for Exam 70-480: HTML5, CSS3 and JavaScript

  1. Pingback: Approaching 70-480 – Learning Resources | manda krishna srikanth

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s