How Cool Web Design Leads to Shareability Failure

Parkour Foundations*

More than 10 years ago I wanted to become a so called Flash developer. I enrolled at a state funded six month long course to learn use Flash to build websites with animated effects. I failed. During this half a year I’ve learned that Flash was already way to complex to make sense as a website building tool. You know, back then

all the “cool websites” were using Flash with its amazing effects.

 

Web standards killed the flashy celebrity

A decade ago CSS only sites were still a new trend and it was far less endearing. They couldn’t even display custom fonts yet (font replacement for headlines wasn’t even born yet). Still I couldn’t believe that Flash was the way to go. It didn’t make sense.

It took a whole lot more effort to create a simple site in Flash and the content wouldn’t even get indexed by Google.

So I created one cool site for a photographer and then¬† gave up. This couldn’t be the future. I switched back to HTML and CSS I have been building websites with since 1999.¬† History has proven me right. Web standards, HTML and CSS are the obvious choice these days.

 

Cool web design after Flash

Luckily Flash only sites are a thing of the past. To this day web designers crave the coolness of Flash though. They try to use animation and similar effects known from Flash in their HTML sites. Sometimes they use scripts, sometimes CSS to achieve this. They still want to “flash” you with page elements moving around.

One good example of how this kind of cool web design is hurting actual websites is the Designed to Move (designedtomove.org) site.

I have found the site repeatedly on web design showcases and in web design blogs as a good example of cool web design. Each time I follow the link to my dismay end up with the same broken user experience. Despite UX being almost synonymous with web design now many web designers still fail at their own craft.

 

Shareability failure

All I wanted to do is to share some information from this very intriguing site. It deals with the health risks accompanying the modern sedentary lifestyle we all face but especially children are subject to. As you might remember I’m very fond of moving.

Indeed I practice parkour for a few years now despite reaching already the mid-life crisis age: so I’d really love to support Designed to Move by sharing some material from it. It has a lot of “great content” on it but there is virtually no way to share it properly.

There are only two built in sharing options, Twitter and Facebook, both of them allowing you to share the homepage. At the same time there is no way to share particular pieces of content without considerable fuss.

There are no images to share and even the infographic they offer is only available as a PDF so you can’t republish it without hassle let alone share it.

The images are not real images but animations the appear once you scroll. I failed to find any deep links or images to share on

  1. Pinterest
  2. Tumblr
  3. Google+

I’ve tried but user experience roadblocks prevented me from doing it. Or I got downright errors. See the abysmal sharing experience below.

 

Pinterest

pinterest-empty-maps

When I click my Pinterest bookmarklet to share some images or videos from Designed to Move all I see are mostly some grey maps on otherwise empty white images. As these are animated you can’t see all of them at once. Thus pinning doesn’t work either.

The first two images are unattractive and not worth sharing at all. Several people tried and didn’t get retweets.

There are four images at the bottom that look OK, they look like process visualizations, but when I click and try to pin them all I get is a bizarre error. I have never seen such an error on Pinterest at all in more than a year of daily activity. The image seems not to be “a valid image”:

pinterest-not-a-valid-image

Somehow the cool web designers have managed to mangle even the visible images so that they can’t be shared.

They should sell this advanced image hiding technique to all those who like blocking the right mouse button to prevent image theft. I can’t pin the infographic either (Pinterest doesn’t accept the PDF format) even in case I do it manually on site.

As a last resort I tried to share the video. Even that didn’t work. The Flash video is so big it effectively overlays the whole Pinterest sharing interface. See screen shot below (the video is blacked out here because my screen capturing tool can’t see it:

pinterest-issue

 

Tumblr

tumblr-error

I thought I could just submit the image to Tumblr and then pin them but I have underestimated the cool web design image blocking team. They have somehow managed to outsmart my Tumblr posting tool. All I get is the error you see above. I haven’t seen such an error in three years of Tumblr usage either.

 

Google+

google-plus-no-bookmarklet-button

As a last resort I decided to share Designed to Move on Google+. Well, that didn’t work either! Somehow the internal site scripts seem to block the Google+ bookmarklet. There is not even a button! It’s invisible.

I have seen sites were the button was hidden below some frame (here it happens too depending on the scrolling position) or the button script causing and error but sites that truly blocked the Google+ button from appearing are a true rarity. I have seen just a few in over two years of regular Google+ usage.

 

Testing websites

Luckily I’m not paranoid otherwise I would suspect that the site has been sabotaged in order not to get shares on social media. I have to admit I rather assume that the cool web designers who built the site did it using their newest Apple Mac computers with huge Retina displays etc.

They haven’t even tested the site on Windows properly! How do I know?

The webfonts do not display correctly on Windows without ClearType or ClearType switched off (roughly 20% of all computers out there). The cool web designers are way too hip to use Pinterest, Tumblr or Google+. They maybe used them when they were cool, around 2008 (at least Tumblr existed then).

This site has also numerous other issues when it comes to UX, SEO and CRO

but I don’t have the time to revel in the misery of others. Please fix Designed to Move so I can share the images and other material. I’d like to move but instead I have to stare into the screen and annoy myself with this shareability failure. Time for some stretching now.

Stop creating fancy websites start building usable, findable and shareable ones.

 

* Creative Commons image by THOR.