Have you heard?

No we haven’t brought Pimms Friday forward this week, or been working so hard that we’ve lost all sense of reality. It is just an analogy that came to us earlier today on the tube, in transit between meeting and office. 

It’s all about the anticipation: the idea of the magic bullet, the ultimate fresh start, the miracle cure. We’ve a newfound empathy with those salon stylists who, daily presented with torn out magazine photos of Scarlett Johansson, Jessie J or Harry Styles, calmly meet the slightly frantic eye of their client, nod and say, “Well, we’ll do what we can...” The expectation emanating from those people sitting awkwardly in their itchy nylon gowns must be terrifying, waiting as they are the application of fairy dust that is going to change their lives forever.

There is definitely an element of that same pressure on web designers and developers. All businesses and organisations these days are aware that they need a solid, effective web presence. They know that the difference between having that online profile and not having it can be the difference between success and failure. They come to the door of poor beleaguered web experts with their hopes in their hands…

Which is all very well and good, but in the case of both haircuts and websites, there are limits to what is possible or, perhaps more importantly, what is desirable. 

Just as someone about to brave a new hairstyle needs to consider how it’s going to work in their everyday life, e.g. whether they’ll be able to recreate the salon look with ten minutes to spare while simultaneously making their kids’ packed lunches and spinning the washing, clients need to think carefully about whether what they think they want from a new website is actually what they need.

In the same way that any decent hair stylist will insist on an initial client consultation, to discuss lifestyle, type and condition of hair, etc, any web agency worth its salt will spend the first part of the working process becoming as familiar as possible with your organisation, the nature of your business, your short and long term goals, and with how you operate on a day-to-day basis. Your web team ought to be asking you so many questions that even you begin to look at your business differently, perhaps more strategically. 

This is what we at Webstars call the ‘immersion phase’. It’s a collaborative effort and all subsequent work - scope, design, build, etc - is based upon it. You may have your heart set on a five minute fun animation on your home page that explains in detail what you’re about. However, if during the course of the immersion period, your web team has come to realise that your chief objective is getting as many potential clients as possible to sign up for newsletters, they ought to be firmly advising you against any such gimmicks, and suggesting snappy bites of text and/or highly communicative images that will instantaneously convey exactly why the visitor to the site needs to be leaving their details.

While we would never want to completely dispel the myth of the web magician (we do have some superpowers, you know), and we accept we aren’t bounded by quite as many constraints as a hairstylist may be (frizzy or superfine hair), we would never advocate throwing fancy tricks at a website for the sake of it. 

So yes, websites are like haircuts in that it’s all about context, and each case is individual and unique.

The Office for National Statistics (ONS) has today released the latest UK internet usage stats. At a stroke, these latest figures have dispelled the myth that Britain's internet use has plateaued. In the last quarter 300,000 people went online for the first time, hinting that there may be some way to go before the UK reaches web saturation point. ONS data also confirms what anyone who uses public transport has long suspected - that more people are using smartphones to access the internet than ever before.

As sales of internet-enabled phones continue to rise, many of us are getting used to carrying the world in our pocket. Soon we will reach a point where smartphones, rather than computers, become the primary device used to connect to the internet.

The impact of this change is already being felt - as companies are increasingly being forced to redesign their websites for use via mobile phones. They are realising that what works well on a desktop or laptop can often be very frustrating on the small screen of a smartphone. The pressure is on to build simpler, smaller websites with fast download times and fewer clicks needed.

It's the web's equivalent of the move seen in the music industry three decades ago. As record labels switched from LPs to CDs, album artwork became simpler and cleaner to cope with the new, smaller format. (And the purists amongst us all moaned that the new format would diminish the impact of the beautiful cover art!)

The rapid growth of smartphone use is leading many of us to view instant, on-the-go internet access as the norm - and forcing businesses to radically rethink and redesign their websites as they try to keep up.

Have you checked how your website looks on a smartphone?

New desks, new logo, new business cards- it's all in with the new at Webstars lately!  Anyone would think we're undergoing some kind of re-brand or something.

Since we last updated the blog, there's been quite the transformation taking place in and around the office.  First we got a beautiful new logo to update our rather outdated one.  Then, some pucker looking business cards found their way to us, and a few days later some bloke came along to install new desks sporting 'on brand' purple dividers.  These naturally caused quite a stir.

Yep, this hungry little caterpillar is well on its way to butterfly-dom.  We're working on our image, building the new brand and sinking our teeth into some pretty exciting projects including a Facebook App for O2, a re-brand and site design for Nutkhut, the performing arts company, and a new e-commerce site for the well established dance footwear company, Bloch, a foot-tappingly impressive 80 years in the business!

It's not just new business and shiny business cards.  We have also changed up the office chair warmers.  After the departure of James and Adam, the Webstars team are delighted to have taken on board not two, but three new excellent members of staff.

Chris Youd is our new Head of Project Management.  Nandita Lovage has joined us as Project Executive, and recently, we also welcome Tom Mortimer, Project Manager, the newest addition to the project management team.

So I'd say we're pretty much ready to spread our wings and emerge renewed- onwards with the updated website!

I’ve been meaning to get this post up for a little while now.  Maybe a part of me was subconsciously putting it off to save face- no, come to think of it, I was trying to literally save you the pain of witnessing our ridiculous faces.

Too late now though (plus something tells me it's more of a schadenfreude-type emotion you're beginning to feel as you scan the pic...)



I don’t know if you’ve heard of the ‘Big Book’ but this year, Webstars’ project managers’ mugs are all over it.

All shiny and serious-looking in its hardback glory, the ‘Big Book’ is the annual “woah, you’re cool”  to the design and advertising world, celebrating the industry’s 2011 Campaign Big Awards winners, and this year it happened to be sponsored  by our friends from down the corridor, Cogs Agency.*  

And they just so happened to have selected the Webstars' PMs as ideal candidates to pull silly faces for their sponsorship ad- spose they saw something in us.

No sooner had they turned on the camera, than we were already warming up, contorting our face muscles into all sorts of fancy formations- and hey presto- the stars of their double page spread were born.

As I’m sure you’ll agree, we all meet the brief perfectly.

Guess that’s the natural glow of odd looking folk "Talented People" with "Great Careers."

(err...yeah...that's us)

--------
*yes, that's us on their site too in case you were wondering, and indeed some of these images we're using here on our own site- we're everywhere.

Have you ever ended up coming across a URL in a webpage only to find out it was not clickable? It can be really annoying to have to copy and paste the URL from the webpage into the browser's address bar.

Bookmarklet: Make Links Clickable
Drag the above link to your bookmark bar

Example page: Demo
Javascript raw source: View

How was the bookmarklet made?

A bookmarklet is basically a normal bookmark that has a javascript function passed on to the browser through the 'javascript:' protocol instead of simply a URL.

To make an "installable" bookmarklet, create a link with the javascript function in the href attribute of the <a> tag and instruct your users to drag the link to the bookmark bar.

Example:

HTML Source <a href="javascript:alert('Document has ' + document.getElementsByTagName('a').length + ' links');">Count links in document</a> Output Count links in document

After writing my javascript function for the bookmarklet in a separate file (as so - snippet.js) I used a php function to create the one-line javascript function by striping out all new line characters ( , ) and all tabs ( ) with the help of str_replace.

The resulting javascript function can be called on click by surrounding it with () and calling the newly encapsulated function with another ().
Javascript Source ( function() { /* ... */ } )();

Final Code
PHP Source <a class="bookmarklet" href="javascript:(<?php echo str_replace(array(" ", " "), '', file_get_contents('javascript/snippet.js')); ?>)()">Make Links Clickable</a>

*Note be sure to end all javascript expressions with a semi colon (;) as the bookmarklet has to be one line of code. This includes function constructors.

How was the link finder made?

To find all links in a document (not counting all the ones that are already inside an <a> tag) you must first get all the raw text from the HTML. The browser holds this raw text in so called TextNodes.

In order to get all the text nodes from the DOM, we start from the top (document.body) and make our way down the DOM tree, saving all nodes that are text nodes (child.nodeType == 3) and walking down recursively to nodes that are not text. Be sure to not go down nodes that do not allow <a> tags in them such as <textarea>, <script>, etc.

Having all the nodes, you can now parse them, finding "http://", "https://" or "www." to create a clickable link. For more information please check out the raw javascript.

That is it! I hope you find the bookmarklet useful. If you have any problems or questions feel free to send me a message to bogdan@webstarsltd.com.