In the mid-2000s, sites like Digg helped popularize the term “Web 2.0″ without ever specifying exactly what it meant. Web 2.0 often came to describe a style of web design that employed new techniques like CSS rounded corners. Color was in. Curves were everywhere. But Web 2.0 also represented something bigger: a trend towards social media integration, community interaction, and a richer, fuller web experience. The term itself is dated now, but the goals are still very much alive. Social’s still important. Web apps and technologies are more advanced than ever.
The good stuff comes first. Easy as it is to complain about pop-ups and everything else that makes web browsing a more frustrating experience, HTML5 alone has made the web more dynamic and animated in the last couple years. In short, these positive innovations easily outweigh the design choices that we oh-so hate.
Founded in 2007, Tumblr arrived on the Internet around the same time Twitter was gaining traction as a major social network. That timing is significant, since both platforms differ from other web services like Blogger and Facebook. Tumblr started off as a Twitter-esque microblog service, specifically geared towards the creation of short, bite-size posts with an image or video embed or just a few sentences of text. Yeah, that sounds just like Twitter–and Twitter grew enormously. Tumblr seemed destined for Twitter’s shadow, but that’s not quite how things shook out. Instead, the service moved into the traditional blogging space, offering free and customizable blog hosting for anyone interested in signing up. Tumblr renovated blogging. And, to a lesser extent, personal website design.
Perhaps most importantly, Tumblr allows its users to redirect real domain names to their Tumblr blogs. Free and premium layouts are installed with a couple clicks, but Tumblr fully supports custom HTML coding and rooting around in theme CSS files. Thanks to all these features, what began as a microblogging platform became a free tool for creating personal websites and portfolios. The change paid off: Tumblr now hosts more than 20 million blogs and offers a substantially more customizable and open-ended service than competitors like WordPress.com. It’s so good–and so free–there’s practically no reason to pay for monthly hosting for a small personal website.
WebGL and 3D CSS
Here we are on the cutting edge of web technology: WebGL, a software library for creating 3D images inside a web browser, just hit a 1.0 release in March 2011. Mozilla, Google and Microsoft have all focused on adding GPU acceleration to their browsers throughout 2010 and 2011, resulting in dramatically improved rendering speeds in graphically intensive web apps. Early demonstrations of WebGL like Google’s WebGL Globe and the beautiful 3 Dreams of Black hint at how powerful hardware accelerated 3D graphics can be within the web browser.
WebGL stands to revolutionize browser games, or at least change how we interact with web technology. We don’t need plugins for WebGL–a modern browser is enough to jump into 3D web apps, and there’s no telling where this tech will go in the future. It can already run a demo of Quake 3. Some seriously impressive browser games likely aren’t too far behind.
3D CSS rendering offers similar advances in web design by allowing developers to position page elements in 3D space using CSS. 3D CSS includes transforms, transitions, and animations, which currently don’t work in all browsers. If you’re using Safari or Chrome, you should be able to see all three implementations of 3D CSS. Firefox 4 and 5 do not support 3D CSS transforms. Check out these demonstrations of 3D CSS3 at work to get a feel for how CSS is advancing.
Both 3D CSS and WebGL are bringing us closer to being able to experience interactive 3D using nothing but native web technology. HTML5 is doing the same by gradually replacing Flash video. Exciting progress.
While the platforms and technologies listed above are making web design more powerful and more accessible, there are always new annoyances creeping their way into mainstream Internet use. And there’s always the really horrifying stuff like identify theft, trojans, and widespread hacking, but those are security risks as old as the world wide web itself. Here are some recent “innovations” that are sure to have us jamming on the Back button or grimacing in distaste.
Copy and Paste Shenanigans
Here’s something that happens on the Internet every day. Constantly. People steal stuff. They copy the written word without making attributions, rip off images without acknowledging the source, or hijack RSS feeds to load their own sites with content from other sources. That sucks. But some publications have decided to fight back in the most annoying way possible–but inserting extra unwanted attribution text into your clipboard whenever you copy a few words of text. John Gruber calls it “a bunch of user-hostile SEO bullshit.” Yeah, that sounds about right.
This evil practice comes from a company called Tynt, which promises 40 percent more visits to an individual webpage from its viral dissemination of hyperlinks. Every time you copy a set number of words from a publication like The New Yorker (typically 8+) you get some text like this rudely attached to the text you wanted to copy:
Shortly after eleven o’clock on the night of May 1st, two MH-60 Black Hawk helicopters lifted off from Jalalabad Air Field, in eastern Afghanistan, and embarked on a covert mission into Pakistan to kill Osama bin Laden.
The Roving Rollovers
/* when reaching the element with id “slideboxplacer” we want to show the slidebox. Let’s get the distance from the top to the element */
That’s a chunk of the code that makes the slidebox work–it goes on to specify how far down the page users have to scroll for the box to pop into view. Scrolling down to the end of an article tends to call upon the slidebox. We’re already easily distracted–these things don’t make reading any easier. Sometimes they even sneak in from the top of a page. Begone, obnoxious ads!
The Spammy Social Media Button
Social media tie-ins have their place. We get it: tweeting articles, giving thumbs up, and pushing posts to Facebook can drive serious traffic to worthy content and encourage user interaction. That’s all great. In digg’s heyday, that digg button was invaluable. Today, too many services push out canned messages to Twitter not to share interesting content but to broadcast worthless information. “I favorited a Youtube video!” “I’m at Bobby Jo’s Bar-B-Que with 4 others!”
Some of these messages have good intentions. Foursquare, for example, telegraphs where you are, what you’re doing, and who you’re with. In a perfect world (or a social media ecosystem ruled by Google+ circles), this message would go out to the friends who live in your city and regularly socialize with you. To them, that information is relevant. But that’s not how it works. In general, these messages are just pushed out to an entire Twitter feed. To most of those people, the post is worthless. And yeah, there’s lots of worthless junk on Twitter–but this isn’t even original junk.
Too many websites integrate these social media tools and encourage users to click a couple buttons and shoot out formulaic messages that no one cares about. Forcing users to enter their own text would be a step in the right direction. That would, at the very least, introduce some variety into the spammy nature of check-in and achievement-driven social network integration.