Game Development Reference
In-Depth Information
If no data is entered or is in the wrong format, the browser will tell you about it and
keep the form from being submitted.
Data attributes
As part of the effort, for more semantic document structure, HTML5 allows us to cre-
ate our own, custom element attributes. Before HTML5, most browsers simply ig-
nored element attributes that it did not understand (for example, a custom attribute
made specially for one's application) but the downsides to this practice included the
fact that the document could not be validated, the behavior was somewhat unpredict-
able, and there was a chance that a new release of the language introduced attrib-
utes of the same name, thus making your old custom attributes invalid. Now, we can
safely create custom attributes for elements and none of the downsides just men-
tioned would apply.
In our game, we used data attributes to do two things, namely to specify the min-
imum speed that a player can move across the track and to specify that a generic
button should trigger a new game (so that any button with that data attribute did not
need any extra logic within JavaScript in order to act like a special button).
CSS
Since this game was intended to show off the more visual aspects of HTML5, we fo-
cused most of our efforts in making the interface of the game a real eye-candy. Since
CSS is all about that visual presentation, most of the featured employed fall under
this category.
Web fonts
Prior to HTML5's ability to handle custom fonts, web designers and developers were
limited to a handful of type faces that could be used in a website or web applica-
tion. Over time, there were a few solutions developed to solve this problem, but none
were particularly impressive and most (if not all) broke some of the browser's func-
tionality. For example, one common technique to display custom text involved the
use of JavaScript to dynamically replace each character in a string with an actual
image of that character using the custom font. The problems with this approach in-
cluded the fact that one needed to create and manage all of those images. The user
