HTML5 Zone is brought to you in partnership with:

Dustin Marx is a software developer who enjoys identifying and using the correct tool for the job. In addition to writing software and writing a blog on software development, Dustin occasionally presents at conferences and writes articles. Dustin is a DZone MVB and is not an employee of DZone and has posted 217 posts at DZone. You can read more from them at their website. View Full User Profile

Book Review: Mastering HTML5 Forms

01.30.2014
| 3652 views |
  • submit to reddit

When I accepted Packt Publishing's offer to review the recently released book Mastering HTML5 Forms, I was curious about what an entire book would cover related to HTML5 forms. Although they are relatively basic when compared to some of HTML5's other features, I've always felt that HTML5 forms have much to offer consumers of HTML5 applications.

The subtitle of Mastering HTML5 Forms is "Create dynamic and responsive web forms with this in-depth, hands-on guide." Mastering HTML5 Forms is written by Gaurav Gupta, has five chapters, and is a bit over 125 pages long.

As is the case with most of the Packt Publishing books I have read, Mastering HTML5 Forms's Preface introduce's the book's objectives, describes the book's overall approach ("step-by-step, example driven, and visual-based approach to learning"), summarizes the book's chapters, explains what readers should have when reading the book (text editor, Wamp, and phpMyAdmin), and describes the book's intended audience ("those who are interested in learning how HTML5, CSS3, and PHP can be used to build responsive, beautiful, and dynamic web forms").

Chapter 1: Forms and Their Significance

The first three chapters of Mastering HTML5 Forms's five chapters cover traditional HTML5 forms topics. The initial chapter introduces HTML5 forms, briefly discusses the history and appeal of forms in web pages, outlines benefits of web forms in general, contrasts HTML5 web forms with traditional HTML web forms, and an introduction to common <input> elements and the browsers that support them. Chapter 1 also introduces HTML5 form elements (<datalist>, <keygen>, and <output>) and HTML5 form attributes (including autocomplete, autofocus, placeholder, min and max, list, formnovalidate, required, and pattern).

After introducing HTML5 form elements and attributes, the initial chapter looks at complete web page code listings using some of these with CSS and shows some screen snapshots of the web pages generated by the HTML5/CSS code. Before closing with a Summary, the first chapter provides a list of bullets highlighting guidelines for obtaining "better results" when using HTML5 web forms.

Chapter 2: Validation of Forms

The second chapter of Mastering HTML5 Forms is focused on form validation. After contrasting client-side validation and server-side validation including discussion of the advantages and disadvantages of each, the second chapter moves to more detailed coverage of HTML5 form validation. This is done by first introducing client-side validation with a traditional pre-HTML5 JavaScript approach that helps to demonstrate the advantage of the HTML5 form-based approach that follows.

A good portion of Chapter 2 covers HTML5 constraint validation. This coverage includes descriptions and examples of constraint validation objects, properties, attributes, and methods such as checkValidity() and customError. These are appealing because they require minimal JavaScript.

Chapter 3: Styling the Forms

Chapter 3 of Mastering HTML5 Forms focuses on styling HTML5 forms with CSS. The chapter provides an overview of using CSS with HTML5, discusses vendor-specific prefixes for CSS3 properties, and begins introducing specifics of CSS3 such as selectors and pseudo-selectors and the substring matching attribute selectors (begins with, ends with, contains). The chapter also provides a table listing "new pseudo-classes."

Other CSS3 coverage in the third chapter of Mastering HTML5 Forms covers background, borders, text effects, fonts, and gradients. With the CSS3 introduction made, the chapter then covers applying CSS3 to HTML5 forms. The chapter concludes with bullets spelling out "CSS3 guidelines for effective styling of the forms."

Chapter 4: Connection with Database

The fourth chapter of Mastering HTML5 Forms leaves core HTML5 forms concepts behind and shifts focus to storing the information provided via web forms. Specifically, Chapter 4 covers "how to store the user's input data into a database using PHP and MySQL." The chapter briefly introduces both PHP and MySQL before demonstrating how to apply this language and database to storing data provides via forms.

Much of the fourth chapter is highly specific to PHP, MySQL, and the use of PHP with MySQL and most of Chapter 4 is not generally applicable to HTML5 forms. However, there are some general principles of HTML5 forms that can be glenaed from the PHP/MySQLs-specific descriptions and examples. Specifically, the concepts of handling potentially spoofed forms submissions and linking forms to the server side are illustrated with these PHP/MySQL examples.

Chapter 5: Responsive Web Forms

Mastering HTML5 Forms's fifth and final chapter focuses on one of the trends that I recently highlighted in my post Significant Software Development Developments of 2013 (#6): responsive design. Gupta begins the chapter by referencing Ethan Marcotte's Responsive Web Design and defining responsive web design as, "An approach by which a website or a particular page dynamically adjusts itself according to particular screen resolution to give the best user experience." I also like the author's overall description of the approach, "Using fluid, proportion-based grids, flexible images, and CSS3 media queries, a site designed with responsive web design automatically adapts the layout to the particular device resolution."

Mastering HTML5 Forms's chapter on responsive design delineates advantages of responsive design before moving onto discussion on "how responsive design works" using HTML, CSS, and JavaScript. The chapter introduces use of the <meta> tag, media queries, media features, fluid grids, and fluid grid frameworks (960 Grid System and Bootstrap), and adaptive images. As with most of the other chapters, Chapter 5 includes a "Guidelines" section that includes "guidelines for responsive design so as to make our forms more effective."

General Observations
  • The first three chapters are exactly what one would expect from a book on HTML5 forms with deep focus specifically on HTML5 forms. These are the most important chapters for those wanting a comprehensive introduction to HTML5 forms.
  • Chapter 4 and Chapter 5 are less about HTML5 forms directly and more about database connectivity and responsive web design and how those two concepts affect form design.
    • Chapter 4 will be mostly of interest to PHP developers.
    • Chapter 5 is generally interesting in terms of what responsive design is; responsive designs can make forms more effective but responsive design is interesting from a broader perspective than forms. Although Chapter 5 was likely not necessary in a book on HTML5 forms, I like its inclusion in the book for completeness.
  • Most of the chapters of Mastering HTML5 Forms include "guidelines" and "best practices" related to the material covered in the chapter. Most of these guidelines/best practices were only tangentially covered or not covered at all in the chapter, but provided a starting point for someone wanting to take the next step in that area. There were a few instances in which I would have liked a particular guideline or best practice to come with additional explanation regarding why it is recommended.
  • Mastering HTML5 Forms is generally well-written. There were one or two sentences that I had difficulty deciphering, but the majority of the book is clearly written. There were some minor editing issues where lines of ext ended after only a couple of words and then the same sentence continued on the next line, but there edit issues are minor and don't take much away from the substance of the book.
  • The electronic (PDF) version of Mastering HTML5 Forms includes color screen snapshots. I wish that more screen snapshots were included. There were some screen snapshots shown of some of the HTML5 forms features, but it would have been nice to have small screen snapshots of each feature rather than of a subset of the features.
  • My only reservation in recommending purchase of Mastering HTML5 Forms has nothing to do with book itself. Rather, the one caveat I would offer to those considering this book is that its content is largely covered online in resources such as The Current State of HTML5 Forms, Dive Into HTML5 Forms, Making Forms Fabulous with HTML5, Rethinking Forms in HTML5, Bring Your Forms Up to Date With CSS3 and HTML5 Validation, and A List Apart. However, there are advantages to having all of these items covered in a single book with consistent coverage.
Conclusion

Mastering HTML5 Forms provides a comprehensive introduction and overview of HTML5 forms in its first three chapters. It adds coverage of using HTML5 forms with PHP and MySQL in Chapter 4 for those who are interested in those technologies. Its final chapter introduces responsive design and demonstrates how responsive design techniques can make forms more useful and efficient for users. Although most of the topics covered in Mastering HTML5 Forms are readily available online, the book does a nice job of providing all of this information in a single place and demonstrating how the various concepts it covers can be used together.

Published at DZone with permission of Dustin Marx, author and DZone MVB. (source)

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)