Bits And Pix

In short, my finding is that Canvas is good to draw a single [animated or not] image and SVG is better for interactive 2D components or applications (e.g. Interactive Charting, Google Docs Presentations, and Zoho Show). I might be wrong, feel free to comment.

Canvas:

• Wikipedia Canvas page
• Mozilla Canvas Tutorial
• FlashCanvas

Svg:

• Croczilla SVG Examples

Canvas vs SVG

• SVG & Canvas: Graphics for the Web: Great presentation from Vladimir
• Test Canvas vs SVG Performance from intertwingly

I having been hitting a weird and annoying CSS bug (I think)
HTML

  <div id="header">
    <div id="title">My Lawyer.com</div>
  </div>

CSS

#title{
  margin-top: 10px;
}

Then, somehow, the margin-top of 10px get assigned to the #header div?

Now, the weird thing, is that if I add any text (i.e  ) just before the #title div class, then, the margin-top get appropriately assign to the #title div???

Now, even weirder, same behavior on Firefox 3.0.1, Google Chrome, and Safari????

Here is another example

The Blue box should be just below
  <div style="margin-top:0px;background-color:blue;width:50px;height:50px">
    <div style="margin-top:20px;background-color:red;width:10px;height:10px">
    </div>
  </div>

The Blue box should be just below this text (but it is 20 px down) and the red box should be 20px down the blue box, but it is 0px.

Any help greatly appreciated. Easy to work around, but kind of annoying.

Here are few Web-Based HTML editors I found (HTML-Area seems to not be maintained anymore)

• WYMeditor: Concentrate on its structure and meaning (XHTML)
• jwysiwyg: JQuery plugin (small)
• FCKEditor: Classic and widely used

When can I use…

SGWeb Google project implementing SVG in a Flash player (currently 25k).

W3C XForms Implementation link

Some interesting ones:

• Orbeon: Seems to be a solid, skinnable, HTML/AJAX implementation of Xforms.
• AJAXForms: AJAXForms is a tool that transforms XHTML/XForms documents (at compile/design time) to HTML with Javascript documents.
• Chiba Web 3.0: Chiba Web 3 is  release of the Chiba server-side XForms implementation, coming with a brand new JavaScript layer, improved XForms 1.1 support, localisation, XPath 2.0 and more. Chiba is now using Dojo Toolkit Version 1.2.3 (latest) which vastly improves the quality of the UI.