Recovered from the Wayback Machine.

Today’s design is based on the Open Road SVG image that was just uploaded. This SVG image is ideal for a background, because it lends itself to morphing. It’s also a horizontal image, which works better for a background image.

The image is adding into the page in such a way that it expands to fill the page, regardless of how small or large the browser window is. It is resolution independent. I use two SVG attributes to manage how the images show in my sites, both set on the SVG element, itself.

The first SVG attribute I set is viewBox. The viewBox attribute is a way of capturing a specific section of the SVG image, and using this captured section to fill a given viewport. For instance, if the image naturally sizes to 400 pixels wide, 200 pixels tall, setting a viewBox to 0 0 400 200 is equivalent to how the image would fill the viewport by default without a viewBox. If you use different settings, say 50 20 350 150, then you’re modifying the viewport for the image, setting the beginning x at 50, beginning y at 20, the width at 350 and the height at 150. Since, by default, x increases from left to right, y increases from top to bottom, setting the beginning x and y clips the upper and leftmost edges of the image. If the width and height is less than what the image’s true width and height is, this clips the bottom and rightmost section of the image. You can use any combination, including negative for min-x and min-y, but you can’t use negative values for the width and height. If you use a negative value for the min-x and min-y, it’s about the same as using a margin–it pushes the image over and down.

The viewBox I put on the Open Highway SVG is 50 50 600 400. I decided I didn’t like the sun showing, so I set a smaller width, clipping the image on the right. I didn’t like as much blue sky, and I liked having the road focused a little off-centered, to the right, so I set the min-y and min-x accordingly.

Now, if I used the SVG, as is, with my expanded background, what would happen is the browser engine would attempt to fill my space, but still maintain the image’s original aspect ratio. The image would expand to fill the width at a 100%, but to preserve the aspect ratio, the height wouldn’t be enough to fill the space. The image expands in both dimensions until one fills the space, and then stops expanding along the other dimension.

This can work sometimes, and sometimes it doesn’t work. In this case, it doesn’t work.

I use the second SVG attribute, preserveAspectRatio, set to a value of “none” to tell the browser engine not to preserve the aspect ratio. Then the image expands 100% along the width and height–stretching the image, true, but filling in the space. If you choose the right background, such as Open Road, which works rather well, it doesn’t matter the perspective, it works. There are also other settings for peserveAspectRatio, but I’ll play around with those another day, with another design.

My two other images are not the same as the background, as I’m not demonstrating the resolution independent nature of SVG today. I used a coffee cup for the top image, and a little car for the bottom, both of which I think complement the “open road” scheme. Both have the viewBox set, otherwise the SVG images would not resize to fit the container. Instead, I’d be stuck with scrollbars (more on scrollbars later). The coffee cup viewBox creates a viewport big enough for the entire image. The car’s height is clipped, so that the wheels line up directly on the bottom of the page.

I used the object element rather than inputting the SVG inline for today’s theme, as I wanted to record another couple of bugs with WebKit and Opera.

Webkit stretches the image, but it doesn’t draw the content over the SVG until I scroll down and back again. In addition, WebKit also adds a white background for the SVG, which is something we can’t seem to control. This can really ruin a nice effect, such as the top coffee mug, and the bottom car.


Opera doesn’t stretch it at all, and also persists in putting scrollbars on the objects. No matter what I do to try and control the object overflow, the scrollbars get added.

I’ve turned in bug reports for WebKit about the drawing problem and the white background. I’ve also noted problems with pages for Opera, but I’m going to make sure formal bugs are entered for the gradient problem with yesterday’s design, and the object scrollbars and inaccurate resizing with yesterday’s and today’s design.

The work on the themes does demonstrate another important issue. Something like ACID2 and ACID3 are handy ways of seeing if key web technologies are supported, but they’re not comprehensive. Firefox 3b3 scores less than Opera 9.5b and the WebKit nightly on ACID3, but it has better overall support for SVG; especially as integrated into a web page. If the browser makers focus too much on the Acid tests, they may miss the overall picture, which is ensuring that SVG works well in a web page. I have confidence, though, that my reported bugs will generate activity.

I won’t keep this design for long–or at least, I won’t use the object elements–because IE does not deal well with SVG loaded into an object elements that are supposed to be in the background, no matter what version of IE I use. The content is pushed down with IE7, and gone altogether with IE8. I’m getting this behavior even when using the Adobe SVG plug-in.

In the meantime, since Microsoft isn’t welcoming bug reports from the general public related to IE8, my only recourse is to remove the Adobe plug-in. Once the Adobe SVG plug-in was de-installed, then the page opened just fine in IE. Well, it’s in black and white, but legible.


Bud didn’t like the clouds.


Clouds gone.


Up Down browsers

A new beta version of Firefox is out. Chances are if you’re running beta 3, you already received a notice of beta 4. The new release has done interesting things with the toolbar. Unfortunately, it may have some roughness with SVG embedded using the object element. We’ll see.

On the down side, Microsoft’s new IE8 beta does not work with the Netflix Watch Now feature, regardless of whether you’re emulating IE7 or not. It’s that whole modifying the underlying operating system thing. Netflix keeps wanting to upgrade the movie object, and the upgrade keeps failing. You have to de-install IE8 to get the Netflix Watch Now feature to work.

More time to test, I guess.



Recovered from the Wayback Machine.

At least one heckler thought the backlash was because of Lacy’s gender instead of her questions. MyBlogLog founder Eric Marcoullier, who twittered a few swipes against Lacy during the talk, told after the keynote that Lacy’s gender might have been behind the reaction of the geeky masses.

“I think there’s some degree of sexism,” he said. “Because she’s a chick, her ingratiating nature is taken as ass-kissing. If it were some guy at Forbes asking the same questions in the same manner, we just would have thought he was drawing Mark out.”

I found it interesting that few people commented on the fact that Zuckerberg is an uninteresting, colorless individual, who has been variously accused of stealing code and spying on his clients, and in this case, tossed the interviewer to the wolves rather than suck up to his own responsibility. Seriously, would the audience have been more comfortable if Lackey had balls, and scratched them during the talk?

Ohmigod, she twirled her hair during the talk! She’s flirting with Zuckerberg! Here’s a clue for you guys: women with curly hair often twirl it when they talk. It’s not a mating move.

I watched the video and did not think Lacey was “bad”. I didn’t think anything about it was “good”, either. This was obvious a canned interview situation, probably vetted by the Facebook PR people to make sure Zuckerberg doesn’t say anything outside of the box.

If there’s a failure anywhere, it was this type of situation being staged as a “keynote”. Fake interviews to make the “interviewee” seem more personable, one of us, lack honesty, whether they’re deemed successful or not. Did people really expect this to be a true interview? I guess there is one born every minute.

All in all, everything I’ve heard about SxSW this year tells us this party is over. Oh, and if women are going to interview demi-gods like Zuckerberg, they better be butch while they’re on stage.


Stormhoek: Shiny, happy people do Grapes 2.0

Recovered from the Wayback Machine.

Talk about webloggers being had…

Frank Paynter had a couple of odd posts about Stormhoek, the South African wine made famous by weblogging.

It would seem that Stormhoek was really nothing more than a concept in search of a vineyard in 2003, and now that some level of success has been reached, is scratching the vineyard. Or is that the true story?

According to another story, something calling itself “Stormhoek” in South Africa is trying to raise capital, by again depending on social media. This time, instead of hosting a dinner with free booze, the folks are asking people to buy a vine:

First, buy a vine. Then ride on the coat tails of Stormhoek’s powerful marketing campaign: blog about your purchase, send out a press release, tell your existing customer base about it. You will be aligning yourself with a feel-good story, that has a proven viral marketing value, and at the same time you will be doing some very, very good for the local wine industry.

But who is the real Stormhoek? And how powerful is that “viral marketing value” if the prime instigator behind the campaign is in Texas, snacking on Bar-B-Que, lecturing on marketing on a trip sponsored by the people who seemingly own the Stormhoek name, but not a drop of the grape?

From Grape Wine News:

The Stormhoek website is handling the situation with what one must assume is panache, and a continuation of its mastery of internet communication, by almost ignoring the financial collapse of the brand’s owners. It’s blog format has brief, downplaying coverage, wedged between rather longer entries on a marketing guru and a cartoonist. ‘While the issues are being sorted in the UK’, it says with rather splendid airiness, ‘back at the vineyard, we are busy thinking about harvest and the more mundane things we need to do to get wines made and in the hands of customers around the world.’

mundane things we need to do to get wines made… Like, having grapes?


According to a UK trade publication, Off LicenseHugh Macleod and the two who owned the original company that went bankrupt, Orbital, will be continuing the marketing campaign. There is no mention of the fact that the Stormhoek “name” is no longer associated with any actual vineyard. Or at least the new owner of Orbital’s assets, Origin’s Stormhoek is not associated with any vineyard.

One must be excused for displaying a sour face when hearing about the “success” of the Stormhoek marketing effort, after trying to wade through the mess that is Stormhoek. However, I won’t make a comment on the lack of transparency associated with this issue, because I’ve been reliably informed that the players associated with Stormhoek never promised transparency. It was another Web 2.0 pundit who promised transparency. The Stormhoek Web 2.0 pundit promised something that isn’t as interesting.

I frequently get my Web 2.0 pundits mixed up. It’s a failing of mine.

In the meantime, may I suggest a local wine? It’s not as chi-chi clever, but at least you know you’re paying for the grape, not the meme.

Second Update

An older article on the origins of Stormhoek confuses the issue of what is “Stormhoek” even more. Money quote:

Deal with it quickly and diffuse the situation politely. After a while the trolls will get bored and go home.


Run for the web

Recovered from the Wayback Machine.

A gentleman from the W3C was kind enough to point me to a newly tracked issue for the HTML5 working group related to namespaces in HTML5, entered by James Graham. I’m not a player in this game, because I can continue to use XHTML 1.1 until they pry it out of my cold, dead browser. However, it is good to see some concerted effort in adding SVG and MathML to HTML5, as well as XHTML5. The two are nothing more than serialization formats, and it shouldn’t matter which we use. However, as it stands now, the data model changes based on the serialization, and that’s not a particularly good thing.

In the meantime, XHTML is getting more kicks because of the draconian error handling. Seriously, I’d love to know who coined this term, so we can take them out behind the barn. Whether the comment was facetious or not, Ian Hickson’s statement that the great thing about XML’s well-formedness requirements is that this kind of thing can’t happen, because the author would catch this kind of error straight away, is true. Errors don’t creep in, they trumpet for attention. But, to each their own. I’m not a player in this game.