Pike's SVG Webpage Example

By mbystedt on Feb 28, 2014, 8:31:43 PM

Designing Webpages in SVG

There's a fair amount of hype surrounding SVG. One of the much hyped points about SVG is that it's going to replace HTML. After all, SVG can have links just like HTML. SVG has better typography. Text on a path is just one of the tricks it can do. It is resolution independent which works well with today's denser screens. These are all things that HTML can't do.

So, above is an example of a SVG webpage. It works and having text on nice sweeping curves is very nice. It is limited in what it can do because of the lack of UI widgets and forms in SVG. True, buttons are easy to create in SVG. A form field is quite a bit harder.

My Thoughts on SVG for Webpages

SVG for now will remain a graphics format for use within HTML webpages. SVG may have the visual edge over HTML. It is clear that without a standard set of widgets for data entry that SVG is not going to replace HTML. To summarize, here are some reasons why SVG won't conquer HTML:

  1. There's no word wrap in SVG. It's not reasonable to expect someone to hand code their own word wrap on a 10,000 word essay.
  2. No UI widget set.
  3. No forms.
  4. Poor support. It's been many years and not even the most advanced SVG viewer is complete.

Could you create a website using SVG? Yes. Don't hold your breath waiting for SVG to replace HTML unless there is the will make it something that can.

Speculation on SVG's Future

SVG is a vector graphics format with a bright future. Despite a rocky start, the latest browser versions of have decent support. There are plenty of reasons to use a vector graphic embedded within a webpage.

Source code may be freely downloaded and examined. Please do not plagiarize.

Related Topics