Exploring software development

Menu

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

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.

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.

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?