Are Your Google Analytics Tracking Properly?

Checking whether your Google Analytics code was tracking properly used to seem like trial and error. Worse still, you use to have to wait a day or so to see if your test actions worked.

This changed a little with the advent of Real Time, but it wasn’t perfect or even that ‘real-time’!

Along comes Google Tag Assistant to the rescue! It’s a Chrome extension that allows you to debug your Google Analytics code in real time. No more waiting, now you can fix your code problems in real time.

And here’s a handy video on how to use the extension to solve your tracking issues:

And here’s how you can use the useful Recoding feature to debug in real-time:

Click here to find how Symphony Online can help you improve your Google Analytics reporting.

Google Analytics: Essential Set-Up for Marketers

Ok, you’ve added Google Analytics to your website, so it’s time to sit back, relax and watch that useful web data roll in. After all, Google Analytics gives you everything a marketer needs straight out of the box, right?

Wrong! There’s still some configuration work to do to get your Google Analytics account to a minimum viable reporting tool! Here’s our handy checklist for your Google Analytics minimum configuration.

5 Steps To Cover the Google Analytic Bases

1. Set up your views (3 minimum – raw, test, filtered)

Views allow you to have multiple instances of your Google Analytics data. This is useful for many reasons, but as a basic set-up we use a minimum of 3 views:

Raw – this is the standard view with no filters applied. This is the one you get as default. Leave this alone, it’s there as a backup, in case your other views go ‘tits-up’. You’ll have raw, unfettered data here as a failsafe.

Test – this is the view you use to test filters, before you add them to your Live view. Don’t forget, once you filter data in Analytics, it’s filtered for good, there’s no going back. Hence why we test first, and have the Raw view as backup.

Live – once you’ve tested your filters, you can apply them to this Live view. This is now your default view, the one you go to for data.

2. Filter out unwanted data (own ip etc)

The first thing to know about filters are that they change your Analytics data. Once you’ve applied a filter, you can’t unfilter and restore the data to it’s original state. Once the data is filtered and processed for a view that is it. That’s why we have our Raw view.

But filters are incredibly useful. You can filter all sorts of stuff, you should start by filtering out ip addresses of users who you do not want to track. We always filter our own ip. You can also filter out those unwanted spam referrers too!

3. Set up your goals (and Ecommerce)

If there’s ever a set-up config for Google Analytics that will transform your understanding of your data, this is it! Every site is goal orientated, whether it’s a blog site or an ecommerce site, goals matter. And being able to track users who complete (or just as importantly don’t complete) them is fundamental to your understanding of your customer journey:

Click here for info on Goal set-up
Click here for info on Ecommerce set-up

4. Set up your funnels

Inbound Marketing is about getting your audience to the next step (attracting, converting to leads etc). Correctly set up funnels can help you to visualise this process so you can take action to become more effective.

5. Link your Adwords accounts

This one is a no-brainer but is often over-looked. Connect your Adwords account so that you can see your customer journey, end to end in both Analytics and Adwords reports.

That’s the end of our basic set up, we’ll go into more Advanced set-ups in another post. If you need help with Google Analytics set and/or reporting, just get in touch.

Our Introduction to Agile/Lean Project Planning

We’ve heard about Agile and Lean principles, particularly in relation to software and website design planning and implementation, it’s created a real buzz in our industry. So we counted ourselves very lucky to be asked to design and build a website with a company who are experts in training, consulting and advising companies in this area, Agility in Mind.

We had our first introduction to the whole process today, and boy, it was a real eye opener! For a company such as ours, in the sector we are in, Agile and Lean practices for development just make simple sense. Here’s why:

Take our normal method of development, it’s known as the Waterfall process. Here’s what happens in the Waterfall process:

  1. The client provides a specification for the website.
  2. We quote to build that website.
  3. We build the website to the original specification.
  4. The site is checked to see if it adheres to the original specification.
  5. We launch it and get paid.

Traditionally, clients tend to like this approach, they are in control, and can check that they get what they asked for, so why change?

The case for change is a simple, and affects 2 main areas:

1. The client writes the requirements, and this is adhered to, sometimes rigidly. But, would you take your car to the mechanics and then tell them how to fix it? Maybe, if you had some knowledge, but in most cases, you’d accept that the experts would probably know best. And therein lies the first problem, the brief/functional spec is often written with very little input from the web developers.

2. It’s just too rigid, a lot of valuable information throughout the process is lost in the rush to fulfill the original spec. The spec becomes the be all and end all, not the website or the app.

An Agile and Lean approach takes a different view, here’s how that process normally breaks down:

  1. The client identifies an objective, or a problem.
  2. The web developer gives a rough estimation of the costs.
  3. The whole team set out a vision to solve the problem or meet the objective.
  4. Tasks are identified, these form the development backlog.
  5. For lean development, these tasks are then organised, filtered and tested for their importance to the project, and their return on investment. The ones that are left form the sprint backlog.
  6. The sprint backlog is then organised into a project flow that can be delivered in stages if necessary, the most important and valuable ones first.
  7. If necessary, the estimate can be revised.
  8. Deliver quickly and in stages or iterations until the objective is met.
  9. Ensure the objective is met, or the problem is solved and value has been delivered.

This approach should not only produce a better result, but it should speed up development significantly. In a world where design can (and some would argue should) happen in the browser, this fluid approach really delivers.

We’re looking forward to learning more about the process over the next few weeks, keep an eye out for more in-depth posts on the actual process coming soon!

Responsive Layout vs Adaptive Web Design, What’s the difference?

Responsive Web Design or Adaptive Layouts. Fight!

There seems to be some confusion about these terms and what they mean, in fact it was my own confusion which led me to look for an answer so you are not alone. I am going to share my own thoughts and findings with you to hopefully clear up any confusions that you may also be having – keep everything crossed, I might just make it worse.

Firstly * this is a biggie * Adaptive Layout should not be confused with Adaptive Design, which is in essence another term for Progressive Enhancement – Aaron Gustafson’s book titled Adaptive Design is a great place to start on this subject.

Secondly * this is equally biggles * Responsive Layout should not to be confused with Responsive Design, which is in fact a subset of Adaptive Design and a responsive or adaptive layout are just two techniques that can be deployed to achieve a Responsive Design, now Ethan Marcotte’s seminal article Responsive Web Design is partly responsible for my confusion as when he coined the phrase ‘Responsive Web Design’ the technique put forward to achieving this was purely a responsive layout. Moving on from that groundbreaking moment the realisation is that Responsive Design is much bigger than this one technique, Jeffery Zeldman (in my humble opinion) quite correctly points this out in his blog post ‘Responsive Design. I don’t think that word means what you think it means‘, for an interesting insight into Adaptive Layout techniques Marc van den Dobbelsteen’s article ‘Switchy McLayout: An Adaptive Layout Technique‘ is also a fantastic read and puts an interesting slant on the should I use a responsive or adaptive layout tussle.

So..

What is a responsive layout?
In simple terms a responsive layout utilises fluid grids, flexible images and breakpoints which are set using media queries.

And..

What is an adaptive layout?
Again in simple terms an adaptive layout utilises fixed + fluid grids, fixed + flexible images and media queries.

I do think it’s easy to get bogged down in this is ‘this’ and that is ‘that’ BUT for my own sanity I felt I needed to research further and clarify the difference between these two terms, uncovering allot more on my journey.

So in conclusion it is my opinion that our understanding of Responsive Design should be to embrace any technique (of which responsive and adaptive layouts are two) which works towards presenting users with a visually graceful experience regardless of the screensize this is being viewed on or the device this is being viewed with – in essence use the tools / techniques available to create the best experience possible – how we get there to some extent is no more than a means to an end.

Adwords Optimistion

Paid search, Google Adwords in particular, forms a healthy part of most Digital Marketing strategies. In fact, for startups, paid search success can be vital to get traction in the marketplace.

We’ve worked closely with SVS since the company was launched earlier this year. In that time, they have gone from strength to strength.

We were asked to review SVS’s Adwords campaign, so we dived head first into the data to try to gain some valuable data insights. As we had already implemented a robust Google Analytics plan to capture key data such as conversions, we were in a great position.

Our first aim was to increase conversions, so we set about optimising the campaign wholesale. Keywords were reorganised, re-instated and new ones found. We started from scratch with the Ad Groups, rewriting the headlines and most of the copy, before we looked at, and revised, the bidding strategy.

Conversions increased threefold, but this put a fair bit of strain on the SVS team. A rethink was needed. We put our heads together and worked out what, or where in this case, an ideal client came from. Surprisingly for us, it turned out to be the UK.

So that’s where we concentrated the spend, and voila, in the first month conversions from the UK were up 92%.

It just goes to show that most paid search campaigns can be significantly improved with some valuable data insights.

5 Things We Love About Laravel

I love frameworks, and not just because they are extremely handy. There’s a certain beauty in some of them. Probably the most beautiful of all the PHP frameworks is Laravel, here’s just 5 reasons to fall for it :

1. It uses PHP 5.3. For me, its a no brainer, a framework that rocks the later version of PHP wins in terms of functionality, security and longevity, see http://php.net/releases/5_3_0.php.

2. Its got some sexy documentation, peel back those pages and have a peek http://laravel.com/docs.

3. It calls classes and methods with some old school charm. Its heavy use of static methods is handy, (http://phpduck.com/php-static-methods-and-properties/) and IMHO, reads better.

4. Its lightweight, but comes bundled with most of the stuff you need. Basic authentication stuff for a start, you hear me Codeiniter!

5. The cool kids use it, apparently, nuff said!

Why not try it, http://laravel.com, and see where it takes you!

Check out more of our blog posts here.

Utilising the image ALT attribute for SEO

The ALT attribute or ‘Alternative text’ (frequently referred to as ALT tag) is quite simply text that we add to the image properties to provide a description of the image when it is not available i.e. when the website is being viewed with a screenreader, crawled by the Googlebot or because images are turned off. It is always a smart approach to add an alternative (alt) text for your web design images as this has a massive benefit from an accessibility point of view (which is great) but it can also have a positive impact for your websites SEO which is also pretty fantabulous!

What are ALT attributes?

The ALT attribute or ‘Alternative text’ (frequently referred to as ALT tag) is quite simply text that we add to the image properties to provide a description of the image when it is not available i.e. when the website is being viewed with a screenreader, crawled by the Googlebot or because images are turned off. It is always a smart approach to add an alternative (alt) text for your images as this has a massive benefit from an accessibility point of view (which is great) but it can also have a positive impact for your websites SEO which is also pretty fantabulous!

Below is a sample of how to get your ALT attribute swag on:

<img alt=”YOUR IMAGE ALT TEXT” src=”image source link”/>

What those crazy guys at Google say about the ALT attribute

Taken from Google Webmaster tools: ‘Use the alt attribute to provide descriptive text. In addition, we recommend using a human-readable caption and descriptive text around the image.’

A statement about how they handle ALT tags: ‘Some of you have asked about the difference between the “alt” and “title” attributes. According to the W3C recommendations, the “alt” attribute specifies an alternate text for user agents that cannot display images, forms or applets. The “title” attribute is a bit different: it “offers advisory information about the element for which it is set.” As the Googlebot does not see the images directly, we generally concentrate on the information provided in the “alt” attribute. Feel free to supplement the “alt” attribute with “title” and other attributes if they provide value to your users!’

(Make sure you check out the video from Google engineer Matt Cutts above to see what he has to say about the ALT attribute and also to check out his cat sketch, good job Matt knows his Search Engine shizzle because hes no artist!)

So what we can gather from this is that the ALT tag is the attribute that Google ranks highest with image optimisation, but that shouldn’t stop you flexing some other attributes such as the ‘title’ attribute and in a best case scenario you would definitely make sure that both were in place.

Our advice to you

Take some time to think of keyword rich and targeted alt and title attributes ensuring these remain relevant to the image used and the surrounding copy.

* Also keep in mind that using an alt attribute for each image is required to meet the minimum WAI requirements, which are used as the benchmark for accessibility laws in UK and the rest of Europe. They are vital for making your website design accessible but this does not mean that you can not benefit SEO wise at the same time WIN WIN!

Do I need a responsive website?

What is responsive web design?

You may or may not have heard a whispering about responsive web design, in the web sector it has been more of a bellowing echo. If you haven’t the chances are you have seen it in action whilst browsing the web, in fact this very blog post you are reading lives within the magical world of a responsive website. To see it in action, open this blog post on a desktop browser and then make the browser window thinner, then wider, and then do the hokey cokey. You should see the layout/content gracefully (he hopes) adjusts itself to fit the new width of the browser, even if you make the page as thin as the resolution of a mobile phone.

Put simply responsive web design is the way of describing the process of designing and developing a website so that the layout alters depending on the device/viewport it is being browsed, there are different variations of how this is achieved but for the sake of keeping things simple I think this explanation is adequate. The ‘device’ could be a mobile phone, tablet, laptop, desktop or even a smart TV.

Do I need a responsive website?

If you have your own website, or the company you work for does, you have probably been in a situation where the website doesn’t look exactly as it should or function as you would expect due to the device you are viewing it on. A responsive web design would tackle and provide a solution to this problem. But before embarking on the journey of finding someone to provide you with this new fangled super cool responsive website first you need to identify the following:

1. How do current users browse your website?
Depending on the source, it’s estimated that up to 50% of web browsing is now being done on mobile and tablet devices. I believe this figure is going to continue to grow and the introduction of new devices suggest that responsive over mobile only sites will give you the flexibility to move with these changing times. However your figures may vary to these estimates so this may not be as urgent but it is not a bad idea to begin thinking about it and formulating some plans for the future of your web presence.

2. How would a responsive web design service fit into your online strategy?
Can your key website goals be met with a responsive website design? Are your website goals going to be easier to achieve in a responsive design? in my opinion not every site should be responsive, in fact some content just wouldn’t translate very well to a responsive design and some functionality would be made more difficult by responsive web design. So you need to identify if a responsive design is going to cause as many problems as it solves. It could be that a mobile site or an app is more relevant for your business or alternatively it could be that the benefits of a responsive website don’t warrant the extra cost (there is more work involved for an agency and as such it will result in a bigger outlay for your website).

3. Are you open to a different design process?
Due to a responsive design taking many forms upwards from 320px (mobile) the design process is somewhat different to what you might be used to. The process of a mock-up based on a fixed width is redundant and the feasibility of mocking-up designs for multiple screen widths wouldn’t be cost effective. The way in which an agency will approach this will differ but an approach which seems logical to us at Symphony is a process of defining look and feel with a style tile (you can read more about this at http://styletil.es/) then defining some specific layout using barebones wireframes and building a web version based on these approved design aspects, test site and revise, test site and revise (this is not limited to two cycles but you get the idea, it makes much more sense to be making design tweaks in the environment where the site is going to be viewed and used).

What should I do

If you have any queries regarding responsive web design and whether this is something you should be looking to implement do not hesitate to get in touch with us and we would be happy to have a chat about it.

Are you a business that has recently been through this process, or a web designer who has a differing opinion or agrees to whats in this post? drop us a comment below.