IMG Source: http://www.flickr.com/photos/kashklick/3406150405/sizes/m/in/photostream/

A little late, this post was supposed to go up on Six Revisions at the start of the year as “Five things that will keep shaping the web in 2012″ however there were a few issues over there so I’ve decided to publish it here anyway. As it was written at the end of December some of the things may already have moved on a little.

So having looked back at last year’s predictions and having survived a sober new years eve (I was driving and had places to be on New year’s day) I’m back to have a look at what 2012 might have in store for us.

The technology and tools we use on the web seem to move at a frantic unstoppable pace sometimes and it’s interesting to sit down and have a think about what the future may be even if the prospect of keeping up can seem daunting at times. So here’s my predictions for what will be shaping the landscape of the web for the next year.

The Cloud

Like many things that appear on these lists I write each year this isn’t something new (if I could guess at something brand new and unexpected I’d probably be out there developing and selling it and not writing articles!). The cloud has been with us for a quite a while and is in it’s most simple form just an extended version of the basic networking facilities you find in offices and schools and even homes around the world, bringing storage, distributed computing and the like across the world wide web. Services offering cloud storage such as Amazon Web Services (AWS) and Dropbox have been around long enough to now be trusted and considered safe.

Direct extensions of these services such as Content Delivery Networks and cloud based servers have been around for a while and gaining an increasing foothold on their way to becoming the normal way to offer faster and more scalable solutions to clients.
But the cloud has become more than a huge off site hard drive and more innovative extensions of these services are where it gets interesting. I’ve touched on the Kindle Fire and it’s Silk browser before and whilst it’s had speed issues it is in it’s early stages and the levering of the AWS for remote processing seems like a very interesting step in the evolution of a next generation of browsers and devices.
If this were isolated you could wonder if it was simply a mad cap experiment from one company but devices such as the Chromebook have launched and are essentially setting a blue print for what may well become of cloud based computing. The advantages of the scaled down requirements for hardware at the user end go beyond cost and allow you to offer a sensible controlled platform for people to use.
The onLive games system that launched over the last two years is another example of scaled down user end hardware utilising the internet and the cloud for it’s processing. It allows the company to keep control of the systems being run as well, they can upgrade their system and service and keep users perpetually up to date and at the top end of processing power.

One of main enabling factors behind all of these advances is the increase of speed and availability of internet connections. Without a reliable fast connection these services often fall down and certainly having an off line alternative to all your cloud data is useful. And these technological leaps aren’t without their disadvantages, concerns over privacy and data security and safety abound as well as worries over the life span of services – if someone goes bust you stand to lose everything you’ve got with them.

In all the cloud is becoming a normal way for us to serve up our content and speed up and enhance our end users experience and the more innovative and main stream these approaches become the more you will need to look at utilising them for yourself.

Mobile

We’re all getting quite used to browsing on our mobiles, smart phones are well established and increasing in market share and we’re all set for another major leap forward. As 4G starts to roll out the increased speed and bandwidth will offer a better experience for users and encourage more browsing whilst on the move. Whilst we’re still a long way from mobile browsing becoming the norm the last two years have seen an increase and the start of a decline compared to desktop browsing.
Even with the increased speed on offer though optimising for mobile will still be necessary, 4G won’t become widespread for some time. As such responsive design and techniques will most likely see an increase in the development of tools and approaches that will make it the way to design and build websites.
As the number of devices we use to access websites increases (see the next point) so do the variables of screen size, resolution, bandwidth and interface and those are just the start. It makes sense to work on a platform that will allow as much flexibility as possible when these variables change and when new devices are released that will challenge and break assumptions we’ve already made, so far responsive design provides the best solution to that. It makes more sense than commissioning multiple versions of a site for each new device that arrives at a different resolution.

As with many things that make this list there are issues, a lot of them revolving around multimedia content and increasingly these are being resolved. Resizing of images and video within a fluid grid can pose problems, as can ad space. This is where I expect there to be innovation over the coming year as people start to focus on and address these issues, whether they be solutions involving JavaScript, server side technologies or even coming directly from browser makers, gradually solution to these problems will develop giving us new methods and processes to work with.

TV

I know some of you are thinking “but you said this last year” and in my review I touched upon various points related to the internet and TV. TV on the internet certainly saw a lot of progress last year where as this year I think there may well be more change regarding the internet on your TV.
The big buzz word is of course Apple, with Steve Jobs, shortly before his death, apparently raving about the innovations an Apple TV was going to bring to the living room. A summer 2012 release date for the apparently name iTV seems likely and whilst many people are guessing there isn’t too much of an idea what it will bring. Close integration with other Apple devices, especially the iPad and iCloud, is likely to be high on the list. Beyond that most people are expecting another revolutionary triumph to change the way we view the TV to add to the list of Apple’s previous revolutions with the iPod, iTunes, iPhone and iPad.
Exactly how this will effect those of us building websites we can’t really be sure and that’s not surprising, after all nobody could really have predicted the impact the iPad was going to have on the way we work and how users digest the work we produce. However I would imagine if browsing the internet on your TV becomes common place then most people will simply take approaches that treat it as a huge monitor to start off with. Beyond that people will begin to see the possibilities and start to create some very interesting work.

Social Media

For many people social media is the web, so often people do everything from the confines of Facebook and won’t ever set an eyeball on your web page. As Paul Boag says in his post “It’s time for you site to play nicely with social media” your social media strategy should no longer consist of simply linking to your facebook profile – your site and your social media will become intrinsically linked.
Social media widgets have been a long standing start of this and one of the first steps to this closer relationship was released recently with the embedding of tweets. Rather than the old basic linking of tweets with a URL you can now interact with a tweet from the page it’s embedded in, retweet it, follow the tweeter, favourite the tweet. The internet we browse is becoming an ever complex web, not just of site to site links, but of linking content within those sites, and social media is key to this integration.
Comments on blogs for example are increasingly managed by apps such as Disqus, or even Facebook comments directly on your page, sites also offer login to their site through an increasing variety of services and in many cases no longer manage users themselves. The end result is increasing integration and use of existing social media profiles for users, providing them one place to share all of their activity.

Obviously Facebook is leading the way in implementation due to it’s huge user base and is closely followed by Twitter in terms of influence. I expect that Google+ will have an increasing amount to say over the coming year as Google push the service as a major alternative to Facebook and which they are very determined not to be seen to fail over.

It isn’t all straight forward though as many people don’t trust companies such as Facebook and won’t use the service often meaning they will be unable to take advantage of some offerings. Website owners will be faced with cutting off a certain percentage of their audience or taking time to provide an alternative to the popular social networks. Treading careful with social media is certainly wise as it is such a contentious area for some users and taking the wrong steps can cause uproar as Spotify found earlier this year when they started offering Facebook as their only sign up method.

Politics

Piracy and censorship are big issues on the web and the US stands on the verge of some historic changes regarding big issues. Over the last year there have been many discussions of the censorship of the web, from the closing down of sites by dictatorships during the Arab Spring to the suggestions of censorship during the London riots. This is all in addition to the ever present censorship by nations such as China.
The main thrust of the debate in the US though is now raging around the Stop Online Piracy Act (SOPA) and the possible abuses of powers that can penalise websites and website owners through no fault of their own. (A quick look at the possible issues here – http://thenextweb.com/insider/2011/11/16/sopa-is-an-easy-no-these-idiots-are-coming-for-your-internet/) Just about any website on or online company could be at risk with bloggers threatening that it could spell the end of blogging. Many leading figures in the industry are rallying to oppose the bill and there is every chance that the bill wouldn’t even be effective in it’s primary aim of curbing online piracy, there is already a Firefox plugin to work around the basic DNS restrictions that would be imposed.
Built on top of the Protect IP act (PIPA) some see it to be a heavy handed and potentially easily abused law that is being heavily pushed and supported by large entertainment corporations. Whilst most people (if not all!) agree that copyright legislation needs to be maintained to protect creative industries most of those opposed do not agree that this is the way to do it. It very much has a feel of being drafted by people who don’t quite fully appreciate some of the intricacies of the internet and seems like law makers are trying to fight on a battle on somebody else turf.
Whilst this is primarily a US issue in terms of actual legislation they are seen as leaders on the internet and will no doubt set down rules that will be possible guidelines for other nations shaping their own policies. In the UK the law already fell foul of twitter this year when a super injunction was violated on Twitter by a user naming parties involved with a super injunction and discussions of whether Twitter should be responsible for it’s user’s content ensued. In Spain there has also been an act passed restricting access to file sharing websites at ISP level.

Leading politicians in the US are lining up on both sides with Republican contender Ron Paul speaking out against SOPA and the fall out of the debate in US politics has already been felt by companies such as GoDaddy. Other companies are being asked to make their stances known, many games companies have removed their name from supporting the bill in the wake of the GoDaddy back lash but have yet to officially speak our against the act  and a number of technology companies appear to have leant support by proxy through other organisations.

Regardless of the outcome of the SOPA bill the repercussions and debate will be felt right across the internet and there is no doubt that the companies who are supporting and pushing this bill will give up even if it doesn’t make it through to law.

[Addition]

Since writing this SOPA and PIPA have hit huge headlines, sparked in the main by Wikipedia’s “publicity stunt” of blacking the entire english version of the website out in protest. That and high profile protests from companies such as Google have helped shelve the SOPA bill, however I would be surprised if that means these issues go away. The companies behind the bill will still seek to find a way to protect themselves against piracy and that is embodied in the current high profile case targeting Mega Upload and their founder Mr Dotcom.

Having made my predictions on what will effect the web for a couple of years running on the Six Revisions website I’ve had a look back at last years predictions before jumping in again.

Head over to Six Revisions to read A Review of a Web Designer’s 2011 Predictions.

Not so long ago I put together an article for Smashing Magazine about using CSS3 and I did mention that using CSS3 features would not be suitable for every situation and that they should be used sensibly and not just splashed everywhere and I think a sign of the maturity and true usefulness of CSS3 will come as people realise this and use it where it is truly necessary, using it as a design tool and not include it just for the sake of it (1px white text shadow springs to mind again!).

So I was rather pleased to see Google+, ok Google haven’t been praised for their groundbreaking design in the past but Google+ is a really well put together and visually appealing design and it’s mostly square. There are the odd subtle rounded corners but on the whole there are a lot of straight edges meeting straight edges with no hint of curve and it looks lovely, you don’t look at it thinking “Oh if only they’d rounded the corners of that button”. It’s not like Google are completely blind to CSS3, there’s plenty used around the Google+ site and the other redesigns of the Google network of sites, no they have chosen to leave square edges in without a hint of remorse.

Yes ladies and gentleman just because you know how to use a gradient doesn’t mean you have to, just because you know all of the border-radius web prefixes by heart doesn’t mean you need to use them – it is hip to be square.

(If you’re looking for something to do whilst you’re not using CSS3 how about checking out Paul Boag‘s post on Web Designer Depot – Stop obsessing over HTML5 and CSS3)

The old setup

To start with my old work setup was well, pretty dated. A desktop PC that is so old I’m not even sure when I got it, I think I got after I finished Uni but I can’t be sure so that would put it at around 7 years. As with any PC it had it’s fair share of hardware upgrades and was working happily, if a little nosily, plodding along with windows XP. One of my big issues was the fact that even buffered it was really struggling to play a youtube video without jumping – not great. Add to that the fact that I spend a lot of time away from home with my job I had a laptop – a Lenovo Thinkpad – that I got and had kept from my first job out of uni, so that was probably about 6 years old, and still an XP machine.  The real push over the edge came when the laptop screen ripped, given that it was so old there wasn’t much doing on the house insurance so I was in the market for something new.

To switch or not to switch

Obviously I had a look around and working between different places I wanted something that wasn’t just going to be a makeshift machine for when I was away but something that I could work on all the time. Being in the web industry you’re never far from voices recommending a switch to Mac and whilst I wasn’t a complete newbie, I’d used them on various modules at uni, I was a little apprehensive, after all I wasn’t unhappy with my PC setup so why switch? And there weren’t any immediately obvious benefits that I wouldn’t have from simply switching to a newer more powerful Windows setup.

So what swayed it?

So why have I switched then? Well as I said I had a good look round and initially I was rather keen on the MacBook Air but I decided that it was going to be a bit out of my price range and decided that if I was going to switch it was going to be a MacBook Pro, so I set about looking at what I could get as an alternative. The main factors that swung it were actually battery life and build quality, two things that aren’t major considerations for most in amongst processors and RAM and hard drive space. I just couldn’t find anything PC wise that would match up to the MBP in both of those areas. The long battery life means that I can happily sit working away in hotel receptions and airports without having to unplug the cleaning ladies hoover and build quality? Come on we all know Apple makes sexy computers.

Leasing

As a freelancer I’m a registered sole trader so I decided to lease as a business, this made a lot of sense in terms of affordability and also means I have the option to keep extending the lease and updating the machine every 2 years – that MacBook Air might be on the way in the future! Given the way this gave me the possibility of spreading the cost of getting an Apple device I decided to make the switch. Had I had to pay for it outright I would most certainly have stuck with PC and lost out on the battery life and build for a machine much more affordable outright but at a similar spec to the MBP.

So what have I got?

I haven’t actually mentioned what I ended up with, I’ve got a rather low end 13″ MBP, I don’t need much more, I toyed with the idea of the 15″ but I like the slightly better portability I get for carrying this around. I think people often get carried away and over estimate the spec they need, I was always going to be safe in the knowledge that it was going to be better than my current laptop regardless.

I’ve also got windows 7 on bootcamp but I rarely open it up, only for a rostering program that I can’t get for the Mac and that’s it.

Am I happy with it?

Yes I am, but I certainly don’t think there’s too much that I wouldn’t have gotten from a upgraded windows machine. I’ve not been bowled over by Mac OS as I thought it would, or as every Mac evangelist would have you believe. There are still things I’ve had gripes with, keyboard shortcuts for pop up boxes for example, but amongst it all I’ve gotten used to it pretty quickly. I’ve found equivalents for all the little programs I had on windows that I liked and I’m starting to pick up the shortcuts, for example I found myself thinking “how the hell do I take a screen shot?”, then rather confused when it stuck it on the desktop and not onto the clipboard.

I also decided to stick the right zoom utility on as I much prefer a full screen view, given that it isn’t a massive screen this makes sense, maybe on a much larger monitor the native mac zoom works better. I’ve also found it a little strange at times where you can see all the things open behind, especially with using things like Fireworks where everything is floating on top of other programs. It’s something I’m getting used to though.

The one thing that I’ve been really taken with is the multi touch track pad, I used to always plug a mouse into my laptop and I’ve done it maybe once or twice since I got the MBP when I’ve needed to do something a little more intricate design wise. The track pad is great and really useful once you start to get au fait with it.

Would I go back to Windows?

I think when it comes to upgrading again I’ll be sticking with Apple, assuming I can afford it, however I wouldn’t be put off by the thought of moving back to Windows.

Final thoughts

If anyone skipped to the end looking for a quick summary well here’s my thoughts. If I were stuck within tighter budgetary constraints I would have stuck with Windows, there is no doubt about that. I still think a lot of the complaints about Windows from Mac users are dated and baseless, although it isn’t without it’s faults, and a lot of promotion of the Mac OS you get from people is over the top, whilst it is good. (Queue the Apple fans in the comments!) Given my old setup to begin with there’s a lot of improvements I would have seen simply from getting newer equipment.

The fact that I have my work machine with me all the time is great as well, much better than keeping everything together across two machines and getting somewhere to realise you’ve accidentally only saved a file to your desktop machine.

The MBP though is a great bit of kit, the mentioned plus points of the battery life and build certainly show and I’ve settled in as a Mac user nicely. Although now sporting this and an iPhone I’ve had for a while I wouldn’t quite consider myself a full Apple convert yet, I’m not quite sure if I ever would, I’ve such a legacy of use of windows machines and there’ll always be friends and family with that thing to look at to keep me in the loop, and I’ve still retained my beast of a desktop machine in the corner for the odd, this site looks funny on Windows XP and IE complaint.

Here’s a few examples I’ve come across recently but I’m sure there’s plenty of you with more to share.

Using forms as links


<form action="link" method="post">
<input type="submit" value="link text">
</form>


This is a weird one I’ve encounted where a form is used as a link to another page, it’s not passing any post variables or anything it is just has the page set as the target and a submit button. All the function of a link, in a form! I can only assume the developer wanted to have browser styled buttons instead of text links?

Using the class “header”

This one really bugs me but I’ve often seen <p class=”mainHeader”></p>, this is what a heading tags are for!

In line styling

Ok more of a legacy thing, it used to be acceptable until people realised that it was much better to code semantically and keep your content and styling seperate. But it gets me nearly every time when I’m debugging trying to work out why a style won’t change something, after lots of messing round I eventually notice the style= in the element.

Not using lists

This I guess is just a personal bug bear but if you have a list of things, stick them in a bloody list! You don’t have to do it for everything, for instance menu items as lists I guess are more of a personal preference (although it could be argued otherwise!)

Tables

Again this is a legacy thing but I’m amazed that people are still turning out design in tables there is quite simply no excuse for it!

JavaScript as navigation

I’ve seen some strange things done with JavaScipt but this is a gem, http://www.kingstriangle.com/ tweeted by @rachelandew, all seems normal when you visit the site, but just view source on those top menu items. You will get the quite mind boggling coding of this.

<div id="nNews" onclick="document.location.href='news.php'">News</div>

It looks like a link and it works like a link but it is the strangest implementation ever, surely as a developer somebody would be familiar with an <a> tag?

If I encounter more I will add to the list but please feel free to contribute in the comments.

Some of you may have noticed that I’ve not done any writing for a while, well it’s kind of a new years resolution for me to get back into it. I’ve got lots of half articles strewn around which I’ll look at finishing off but I thought I’d kick off with a look back at last year.

I wrote a looking ahead to 2010 piece for Six Revisions last year so before looking ahead to 2011 I had a quick look back at the piece and 2010 and you can have a read here – Things That Shaped the Web Design Industry in 2010.

I’ll be following it up with a look ahead to 2011 soon!

But as I read over the various improvements in the interface, the new support for up and coming standards and the use of hardware acceleration amongst many other advances, one thought stuck in the back of my mind – how good will IE9 have to be to offer a chance of growing it’s market share again? The answer obviously is pretty damn good.

IE will no doubt maintain the majority share of the browser market for a long time given the large number of users who neither know or care which browser they use, or are quite happy to stick with IE out of comfort. The growth of Google Chrome has shown that users are not unwilling to switch their browser if a better alternative is available. But even if IE produced the best browser by a country mile I’m not sure how much it would effect it’s standing as a browser. Could you see web designers and developers recommending it to their clients? Sure there are plenty of fair minded sensible people out there who would hold their hands up and say yes it is a great browser, but it’s become cool to hate Microsoft and IE and to bemoan their problems. There are many for whom IE would have to show something really really special before they would consider doing anything other than picking at it’s faults.

Still we don’t live in a one browser world and it’s nice to see that Microsoft are finally taking up the baton and producing a more modern browser that supports the standards and innovations that designers and developers like me want to see.

I’ve been using CSS3 in plenty of places (yes even client projects!) and trying to code in HTML5 where possible, but it occurred to me when putting together some stuff with CSS3 animations for my new project StatShare (open up something webkit and have a little look round for it), especially after making a mess of various things and trying out new ideas, it isn’t about getting it right. In the end I did get what I wanted done, and I’m pleased with that, but even if I hadn’t I would have learned plenty more about CSS3 anyway, things that I can take on with me future projects.

As CSS3 isn’t a finished draft either if in my experiments I find that things don’t work as I expect, well then I can write about it, see if other people have similar problems even submit a bug report to the W3 if I want to go that far. Essentially we are the test bed for this new stuff and it’s only by trying new things that we’ll learn how it works and what the limits are.

It’s about learning and testing and helping to move the web forward to better and easier coding methods and techniques, so what if what you try doesn’t work, at least you’ll learn something and you’ll be a few steps ahead of those who aren’t using new coding methods.

Conventional wisdom as we progressed from 800×600 to 1024×768 was that as bigger screens became affordable and PC usage more common place home users would eventually gravitate to a 1920px width screen and so on so forth. However whilst all your designer mates might have large 1920px screens most home PCs are still 1024×768 and as such web designs are generally fitted to a 960px width to sit comfortably on this size screen. Add into the mix the growth of mobile internet and the announcement of the iPad and we’ve come full circle and are right back designing for smaller screens than ever.

So whilst you may design for designers on larger monitors and we will still have to consider where our background goes beyond the 1024px width will we ever find that a commonplace width for client sites or have we reached our widest “normal” width with our 960px wide site?
Will the transition of internet access from the desktop simply mean that we design more fluid sites and mobile alternatives instead, whilst still sticking to conventional widths?

Recently I’ve been a bit disappointed by a number of articles. They’ve promised me the world and they’ve delivered nothing short of disappointment and badly re-hashed content. But why should I have expected anything? – Because the title of these articles promised so much.
I know blog titles are written to pull in readers, the way we digest the content through twitter and RSS feeds means that titles are written to get people onto the site and add another eyeball to the all important visitor count.

Sure I know titles like “Win that client pitch everytime” are over the top because if they worked everyone would win every pitch and we’d all get no where. However I still expect something from the article, something that says wow or makes me think “oh yeah” at least a little bit as much as the title but sadly so many articles fall short of the bar they set themselves.
An article that disappoints damages a sites credibility and it gives people a negative impression of the writer and first impressions are hard to shake.

But why does it matter? Well great content leads to return visitors, great content gets tweeted around, great content gets bookmarked, great content gets applauded, great content is… well, it’s great.

So bloggers of the web it’s up to you, you can strike a balance, write honest blog titles and your content will either pleasantly surprise people or be just as dull as the honest title you’ve written

…

Or

…

Just write great content! Content that speaks for itself in a much better way than any title you could have given to it.

I implore you all, please try and do the latter and I will try to do so myself.