How Cool Web Design Leads to Shareability Failure
*
Do you remember the nineties? I started “designing” and coding websites back then.
In the early days of the Web most sites sucked.
- They were looking bland.
- They had cluttered interfaces.
- They were barely usable.
Later than changed luckily. Yet even on the modern Web some sites are rather flashy than useful.
Instead of working properly on all systems and for all users cool websites limit your reach.
I’m talking about websites that were “designed to move” to catch attention and flash users.
I’m not only talking about Google SEO. Content gets hidden so that it’s not shareable.
This way social media audiences won’t see it either.
The Lesson from Flash Websites: Keep it Simple or Die Trying
As a “Web designer” or “HTML programmer” I tried to come up with new ideas.
It was a lot of experimentation. I even started using JavaScript to create interactive poetry.
Long story short Web design was meant to be cool and flashy.
Thus Macromedia came up with Flash.
It was a standalone software meant to create animated websites as movies.
Websites were literally “designed to move” by using animated and moving elements.
Web browsers needed a plugin to even be able to display those sites.
So around 2000 I wanted to become a so called Flash developer.
After the “new economy” crash following 9/11 I lost my work.
Later I enrolled at a state funded 12 month long course to learn how to use Flash.
I wanted to build websites with animated effects. I mostly failed.
During that year I’ve rather learned that Flash was already way too complex.
I realized that it did not really make sense as a website building tool.
That wasn’t self-evident in those days.
You know, back then all the “cool websites” were using Flash with its amazing effects.
Later on Adobe acquired competing Macromedia.
Adobe Flash would last for several years yet its fan base and developer numbers dwindled over time.
Finally Adobe retired the Flash project altogether and quit support for it.
Most websites that relied on Flash until then had to come up with basic HTML versions supported by all browsers in the meantime.
I even built some that looked almost exactly like the Flash originals yet without the flashy and redundant animations.
The lesson from the days of Flash websites is clear: keep it simple or die trying.
It applies both to websites and those providing website building technology.
Web Standards Killed the Flashy Star
Around 2003 HTML/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 was way to complex. Creating a website was more like making a full fledged movie.
It took a whole lot more effort to create a simple site in Flash and the content wouldn’t even get indexed by Google.
Thus 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.
They killed the flashy star of the cool websites era.
Cool Web Design After Flash
Luckily Flash only sites are a thing of the past. To this day some 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 cool Web design showcases and blogs as a great example.
Each time I followed the link to my dismay I would end up with the same broken user experience.
Despite UX being almost synonymous with Web design by then many designers still fail at their own craft.
Shareability Failure
So here I want to explore the bad example of Designed to Move and how it inhibited online sharing.
Indeed the user experience was so damaging to the overall performance of the site that it went offline before long.
All I wanted to do is to share some information from this very intriguing site.
It dealt with the health risks accompanying the modern sedentary lifestyle.
We all face the health hazards of sitting for hours but especially children are even more vulnerable.
As you might remember I’m very fond of moving. I train regularly.
Indeed I practiced parkour for a few years already despite reaching the mid-life crisis age!
I really wanted 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 were only two built in sharing options, Twitter and Facebook, both of them only 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
- Tumblr
- 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
So I clicked my Pinterest bookmarklet to share some images or videos from Designed to Move.
Yet all I saw were 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 were four images at the bottom that look OK, they look like process visualizations
When I clicked and tried to pin them all I got was a bizarre error.
I have never seen such an error on Pinterest at all in more than a year of daily activity.
The image seemed not to be “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! Why?
Those who like blocking the right mouse button to prevent image theft would love it.
I couldn’t pin the infographic either (Pinterest doesn’t accept the PDF format) even in case I would do it manually on site.
As a last resort I tried to share the video. Even that didn’t work.
The Flash video was 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:
Tumblr
I thought I could just submit the image to Tumblr and then pin them.
Yet I have underestimated the cool Web design image blocking team.
They have somehow managed to outsmart my Tumblr posting tool.
All I got is the error you see above. I haven’t seen such an error in three years of Tumblr usage either.
Google+
As a last resort I decided to share Designed to Move on (the by now defunct) Google+.
Well, that didn’t work either! How bizarre indeed.
Somehow the internal site scripts seem to block the Google+ bookmarklet.
There was not even a button! It was invisible.
I have seen sites where the button was hidden below some frame (here it happened too depending on the scrolling position).
Sometimes the button script was causing an error.
Sites that truly blocked the Google+ button from appearing were 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!
Why? It has been prevented from getting shares on social media.
I have to admit I rather assume that the Web designers who built the site were just too cool!
They probably made it using their newest Apple Mac computers with huge Retina displays etc.
They probably haven’t even tested the site on Windows properly! How do I know?
The webfonts did not display correctly on Windows without ClearType or ClearType switched off (roughly 20% of all computers out there at that time).
The cool Web designers were probably also way too hip to use Pinterest, Tumblr or Google+.
They maybe used them before they were cool, around 2008 (at least Tumblr existed then).
This site had also numerous other issues when it comes to UX, SEO and CRO!
Yet I don’t have the time to revel in the misery of others.
The number one purpose of this post was for them to fix Designed to Move.
I wanted to able to finally share the images and other material.
Yes, I like to move but instead I had to stare into the screen.
I had to witness and describe this annoying shareability failure instead. Time for some stretching now.
Stop creating fancy websites and start building usable, findable and shareable ones.
* Creative Commons image by THOR.
