Home > Articles > Web Development > HTML/CSS

  • Print
  • + Share This
Like this article? We recommend Apps, Not Documents

Apps, Not Documents

As you might imagine from the name, the WHATWG is more interested in providing a display language for client-server applications than providing a format for documents. That doesn't mean that documents are completely ignored, but it demonstrates a shift in focus. HTML 5 is intended for things that are mainly going to be displayed online, while XHTML 2 described more static documents and was closer to something like DocBook than a modern web authoring system.

There are a few things that make this distinction clear. The most obvious is the <canvas> tag. This was originally developed by Apple for use in Dashboard widgets, but is now supported by Opera and Mozilla natively, and Internet Explorer via a plugin. The <canvas> tag provides a 2D surface onto which scripts can draw. You can use this to embed static 2D images that are drawn by scripts, but more commonly you'll use it for generating dynamic displays.

As you might expect from Apple, the canvas tag borrows heavily from the PostScript/PDF drawing model. In fact, if you've done any drawing with Cocoa's AppKit, then you'll immediately get a sense of deja vu when you look at the context object that is exported to JavaScript by the <canvas> tag. This implements methods very similar to those on the standard Cocoa drawing-related objects. NSBezierPath's moveTo:, lineTo:, and curveTo:controlPoint1:controlPoint2: methods, for example, become moveTo(), lineTo(), and bezierCurveTo(), respectively. This makes it very easy to implement support for the <canvas> tag anywhere where you have a library implementing a PostScript-like drawing model—for example, CoreGraphics or Cairo.

Canvas is very closely tied to JavaScript: It is effectively useless without a scripting environment. When you create a <canvas> tag, you just get a rectangle reserved in the web page with a specific size. You can then only draw into this rectangle if you use scripting.

Some have described HTML 5 as a competitor to Adobe Flash, and the <canvas> tag is a good example of where they have overlapping functionality. Flash provides a similar drawing model that is scriptable by a JavaScript dialect. This won't replace some of the more complex uses of Flash, but it will make a lot of the simpler things that Flash is used for easy to implement in pure HTML.

  • + Share This
  • 🔖 Save To Your Account