For the likes of Membership organisations and Higher Education services there is palpable need to create appealing and worthwhile online communities to ensure user loyalty, engagement and enthusiasm. We feel that online communities are vital for acquisition, retention and customer service of members and users. However, how do we get people interested and engaged online?

Pixl8 has devised 8 tips for building awareness and engagement in your online community

1. Stellar Content

As the cliché goes ‘Content is King’, providing content which users want to see is vital to the health and growth of your online community.  People are busy and will ignore content that is not valuable to them, valuable and targeted content will add to the user experience; providing knowledge, enjoyment or practical skills.

Remember, new content will not only boost loyalty among users by demonstrating your website is up-to-date, it will also help SEO. By providing a steady stream of engaging ‘stellar’ content you are able to continually nurture visitors with practical information and cutting-edge advice.

Click here for more information about generating the right content.

2. Positioning

We know the importance of having a great digital presence and keeping up with the changing times.  For many members, online communication is the easiest way for them to keep in touch with you.

As an alternative to the established method for managing the membership or customer base it is now possible to use a custom CMS to easily govern communication in your online community. By positioning yourself in this way you are effortlessly able to raise awareness. Now all events, announcements, support documentation, training opportunities and promotional materials have a lot more visibility and are easily accessible.

3. VIP Treatment

Entice users into your online community by making information elite. Members who join an online private community want to feel they are getting information that is not available to just anyone. Providing special access to valuable information, discussions and events that your customers or members cannot get anywhere else, makes a superb incentive to join and return often to your online community.

4. Exclusivity

The element of exclusivity can also be monetised as a way to boost sales; from an e-commerce point of view, you can use member exclusive events and shops as a tool to significantly increase ROI. Think of exclusive content as a carrot and stick approach without the stick.

5. Gamify Users

The concept of gamification is being used more and more online. It is a great way to reward your users and keep them coming back! Virtual status and competition will make the community an addictive part of users’ everyday lives. For example, within Membership Organisations the emerging trend could be used in conjunction with CPD points to promote a feeling of goodwill among your members as you bestow rewards on them, which allow them to gain the respect of their peers and showcase their knowledge.

To see gamification tactics in use visit Quora, Stackoverflow or Yelp.

6. Personal Contact and Rewards

Make your users feel special with personal contact. One easy way to do this is if your website is integrated with your membership database/CRM.  It is possible to track engagement from the point of login and reward member’s with points. You can also spot members who have a low score to find those who are less engaged with your organisation and automatically target them with personal  and bespoke contact to encourage use.

7. Reward

In addition to personal contact it is important to reward users. By attending events or gaining qualifications your members are able to see their own growth increase within your community. You can make their efforts tied to discounts, admittance into special groups and more. These kind of benefits drive action and improve member retention and loyalty as your community now offers your members something that others do not.

8. Keep it simple and easy to use

It is also essential to keep your website clean, simple and easy to use. Here at Pixl8 we know there is nothing more off putting than a cluttered and unintuitive website. If you want your online community to thrive, keep things simple. Don’t overload users with too much content and make sure the user experience is simple and clear.

If you want any more information on how to make your online community more accessible and rewarding for your users please do drop us a line and we will be happy to help.

The spontaneous nature of social media is often in direct contrast to the controlled marketing messages many colleges create.  We are all also fully aware that engaging young people in their “natural habitat” can be risky. Like all establishments, a college can easily fall victim to a viral tweet or meme.

For many students the thought of colleges looking at their facebook is worse than mum rooting around under their bed!

So, how do we get around this challenge?

Well the good news is there are many out there (admittedly Universities) who have.

According to Mashable the top 10 social media savvy Universities are:

1 - Harvard
2 - University of Pennsylvania
3 - Massachusetts Institute of Technology (MIT)
4 - University of Michigan
5 - Stanford University
6 - University of California, Berkeley
7 - University of Oxford
8 - University of Sheffield
9 - University of Wisconsin, Madison
10 - University of Texas at Austin

That’s right people, good old University of Sheffield is right up there in the top 10!

The most recent stats show that two-thirds of prospective students check out their potential schools on their YouTube, Pinterest, Tumblr, Twitter, and Facebook channels during their decision-making process.

So here are my 8 tips for effective social media in colleges:

1 - Variety is key
This is not a prospectus, content needs to be up to date and of interest to your audience.  Stories about college outings, special guests at the college and student achievements, along with anything out of the ordinary, will spark some interest.

2 - Involve your audience
Nominated students who are trustworthy can be a great help creating interesting posts and helping to answer questions.

3 - Use real images taken by students
Social media is not about glossy or fake marketing images, get the students to take and submit their own pics.

4 - Keep in honest and real
Print materials allow you to portray yourself how you choose. Social media is your chance to display a student’s view of the college.  Frequent comments and student involvement provide people with a realistic picture of what it is actually like.

5 - Have some fun
It’s hard to take risks sometimes but have some fun and allow the students to do so too, so long as it’s in guidelines.

6 - Ask questions
Engage the people on your page and get them involved, competitions can be good too (a free haircut at the college Salon)

7 - Use your media and arts department
Get students doing arts, drama and media involved, these are the people who are passionate about this and know the most about your audience.

8 - Show off
Get students in hair and beauty, catering and any where else to submit their best images and videos to really shout out what they do well.

If you're a College in need of a helping hand with your social media or general digital strategy, then you've come to the right place - we have a lot of experience working with Colleges and other Further Education establishments...

Our stand received heaps of interest as always, attracting many of the college representatives over for a chat around their existing web strategies, and ways in which Pixl8 can help improve student engagement.  Some of the many topics of discussion during the day included:

- Planning and running a successful web project

- Ways to improve communication with potential and existing students

- The possibilities available to colleges by embracing mobile browsing

- Personalised online prospectuses

- The challenges and benefits of seamless integration with back office systems such as the course database, student records and intranets.

If you'd like us to provide further suggestions of ways to improve your online presence, please do get in touch here and we’d be more than happy to share our knowledge and experience.

However, there’s no need to panic!  By simply choosing and breaking down the most effective SEO tasks, one can very easily optimise a website.  So here we go…

1. Carry out keyword research

The first thing you should do on your path to SEO stardom is to consider which search terms people are most likely using to find your website.  These should reflect whatever products / services / information that is on offer and you wish to promote.  A good start is to list out the obvious keywords first, then from there consider the alternative words or phrases people may use.  Try using a thesaurus or the Synonym feature in word to provide a helping hand.  Also Google’s keyword tool can be really helpful, especially if you’re considering running PPC campaigns too (see step 8 below):

2. Target your content and keep it fresh

Now that you know the keywords you’re looking to target, it’s time to review and rewrite your website copy with these in mind.  Don’t overdo it though; Google isn’t stupid so keyword stuffing your content to the max may well get you penalised!  Try to also find ways of constantly refreshing your content - having a news section or a blog is a great solution and helps prevent your website from becoming stale (not good for SEO). 

3. Apply keywords to your Meta-data

To further boost the effects of your search engine optimised content; you should really consider applying ‘Meta data’ to each and every one of your lovely website pages.  These should include the keywords mentioned above, whilst also describing the content of the page in question.

- Meta title – The title of the page, which appears in search results and also at the top of the browser window when on the site.  Make sure it’s both catchy and relevant!

- Meta description – The extra information which appears in search results under the Meta title, use this to further hook the users interest.

4. Structure your content properly

It’s extremely important to structure your content in a sensible manner – not just for SEO reasons!  Think about how newspaper and magazines articles are traditionally written: a title (known as H1 in the web world), subtitle (H2), the text below (body) continues to explain things further…  The reader should get an idea of what the page is about simply by reading the title then the subtitle underneath.  It is believed that search engines check to ensure the Meta-data, H1, H2, body and even the URL all share similar keywords before ranking the page.  If the H1 text doesn’t tie in with the Meta-data for example, then you’re missing an opportunity.  

5. Mind your media

It’s not just text that search engines use to rank your website, video and images need some attention too.  Ensure you use appropriate image and video alt text when inserting these into your website.  Not only is this important for SEO, but also for Accessibility reasons.

6. Speed and site maps

Following the introduction of Google Panda (not the animal but a change to Google’s search algorithm) website speed has become an important consideration in SEO.  Ensure your website is coded well (speak with your developers / agency if you’re unsure) use correctly formatted images (using the “Save for web” option in Photoshop) and opt for video streaming rather than locally hosted (like YouTube or Vimeo) where possible.  Also make sure you have a sitemap for your website (again speak to your developer / agency if you’re unsure) and that you’ve submitted it using Google’s Web Master Tools, to ensure your site is indexed. 

7. Grow your backlinks

Search engines view other websites linking back to your website very highly (you can monitor these via your WebMaster Tools account), especially if those websites:

a) Are reputable websites, not link farms (websites designed to artificially aid the creation of back links)

b) Use appropriate, descriptive text as part of the link (ideally including some of your chosen keywords)

If you’re struggling with ideas of how to get websites to link back to you, below are some examples:

- Partner organisations (do you have any partnerships setup that could maybe link to you?

- Suppliers (within their “who we work with” section)

- Directory listings (often free, but sometimes paid for)

- Social media (Twitter, Facebook, LinkedIn are all becoming powerful ways to bolster your SEO)

- Forums (although it’s believed that Google doesn’t rate these as highly as normal websites)

8. Consider paid for options

If you’ve completed all of the above and still want to do more on the SEO front, the next logical step is to go down the paid for route, often referred to as PPC (Pay Per Click) and PPI (Pay Per Impression).  Both Google and Bing offer robust advertising platforms, as does Facebook.  Check out the links below for more information:

- Google Adwords

- Bing

- Facebook advertising

Please note this isn’t an exhaustive list, SEO is a skill and can become a full time profession when carried out properly in its fullest forms.  The above is purely an introduction to the key SEO tasks.  In terms of tracking your progress, there are various tools available, Google Analytics is by far the most commonly used so a great place to start and is free :)  If you’d like to know more about SEO, feel free to get in touch – we don’t bite, we promise!

1. Single page design
 

Navigating around websites with loads of sections can be frustrating, especially when the content on every other page adds up to merely a few lines of text.  This is where the genius method of single page design comes in.  Rather than splitting a section’s content over multiple pages, a section instead has only one page, which is split horizontally into content areas.  Clever use of anchors ensures users can easily navigate around.

Single page web design examples:

- cageapp.com

- pitch.csspiffle.com  

2. Fixed navigation
 

When reading a long blog post or browsing a single page design (as explained above), it can be a real pain having to scroll all the way to the top to continue navigating around the website.  Not to worry, this problem is easily solved through the use of a fixed navigation bar.  This way the primary navigation is always subtly accessible on the screen no matter how far down the page you’ve ventured!

Fixed navigation examples:

- happycog.com

- hardgraft.com

3. Lazy loading / infinite scrolling
 

Making your audiences wait for pages to load not only ruins the user experience of a site, but will also negatively affect your SEO efforts (due to the introduction of Google Panda which takes load speed into consideration when ranking your website).  So what do you do when you want to display a long list of content with images?  Content could be split across tabbed pages, forcing users to click repeatedly to browse.  Although a better alternative is to implement lazy loading:  So a given number of items is displayed, when browsing to the bottom, a new set loads automatically below. 

Lazy loading examples:

- Pinterest.com 

- Soup.io 

4. Mega drop down menus
 

Primary navigation has come a long way over the past few decades.  First vertical, then some clever clogs had the idea of making it horizontal, to provide more screen real estate for content.  Having a multiple sections made it difficult and time consuming to find what you’re looking for, so people started using drop downs enabling users to browse sub-sections on hover over.  Today see’s the rise of the ‘Mega drop down’, larger, often full width drop down panels that can provide even more information on each section such as related or featured content.

Mega drop down examples:

- renewableuk.com

- nationalgeographic.com

5. Oversized buttons and giant text
 

As computer screens and their resolutions have increased, so too has the space that websites are able to utilise.  This has meant that text can now be larger with more line spacing and increased padding between images.  These changes allow content to breathe, making a website more inviting by improving readability (great in terms of accessibility too).  In turn, buttons and calls to action have also been ‘supersized’, helping to increase conversion rates (and useful when it comes to responsive design considerations for mobiles with smaller screens).

Oversized buttons and text examples:

- new.myspace.com

- mailboxapp.com

6. Enormous photo backgrounds
 

The phrase “a picture tells a thousand words” can be so true.  This is why so many organisations (especially those with consumer focused and brochure websites) are ditching bland single colour / gradient backgrounds in place of stunning, eye catching photography.  Although one needs to be careful and keep file sizes to a minimum so as to ensure fast load times, when the photography is relevant it can be extremely effective.

Enormous photo background examples:

- join.me

- cappellosglutenfree.com

7. Responsive design
 

With the evolution of smartphones and 3G technologies, users are accessing web content via mobile devices more than ever.  Responsive design allows you to have one website that is capable of recognising the size of the screen it’s being viewed upon and adapts its layout accordingly, reducing its width, making images smaller and buttons more ergonomic.  Therefore no need to host and edit two websites anymore!

Responsive design examples:

- optical.org

- docet.info

8. Parallax scrolling
 

The demise of Flash (thankfully) has given rise to the mobile friendly alternatives of HTML5 and CCS3.  With this shift have come new ways to provide fun, inspiring and animated websites.  Parallax scrolling is one of the hottest methods today:  It involves using multiple backgrounds that are cleverly overlaid so as to give the impression of animation and depth when scrolling down a page.  Unneeded use of this technique can slow down a site and seem a little naff, however when used appropriately it can make a visit to your website truly memorable.

Parallax scrolling examples:

- meethue.com

- bagigia.com

I think that just about covers it for now!  If you have any other web design trends you’ve come across recently and want to share or have questions on those above, don’t be shy, please comment below or drop us an email…

Warning signs of poor navigation

Here are some of the classic indications that your website navigation needs reorganising:

- You receive hundreds of phone calls from members asking for documents and information that is already on the website.
- Use of internal website search (Monitoring what people search for can help indicate hard to find content)
- High bounce rate / low page views (Analytics can tell you the number of people that left a page without looking at a second)
- Staff members asking for you to email documents that are already available on the website
- You say out loud "where was that page?".. a lot

Please feel free to add any i've missed to the comment section below :)

Common website navigation mistakes

Confusing labeling

Terms bandied around your company daily may mean something very specific to you. Sadly it can't be expected of a first time visitor to read your mind or tell the difference between news, announcements and bulletins. Try to keep navigation labels understandable, in line with industry convention and jargon free.

Lets just add another section

Too many sections means a website's navigation can quickly become complicated and difficult to use. It’s a good aim to not exceed 7 or 8 sections in your primary navigation. Drop down navigation and mega drop downs can help users see what's in each section at a glance but again try not to overloads these either. So the next time you hear "lets add another section" it should set alarm bells ringing.

Department silos

You have your events team in one room creating conferences and events, your policy team working on documents and your news team hard at work on the latest articles and it all goes directly into their own section of the site. The problem with this is that the average website user is probably more interested in content based on what’s new since they last visited, their job role, their own interests, specialisms, region or a particular difficulty or problem they need a solution for.   Adding additional ways to find content such as audience navigation, popular/latest pages panels, a good site search and showing related content are top ways to help break content out of the large dark departmental silos and share it around the site.

Navigation planning

It’s easy to joke and criticise but how do you manage to get 25,000 or 250,000 web pages into a easy to use, ordered navigation. There is no easy answer, It all comes down to planning and testing.

Card sorting

A good process to help when organising the primary and secondary navigation structure is card sorting. Card sorting is a manual process where participants write out key pages of the sites on to little pieces of cards. The cards are then grouped by the participants by what they think belong together and give them an overall name which they think clearly describes the contents which become the section name. Remember to try and keep organising until you get them into manageable piles of 7 or 8.

Who should participate? Several small groups or teams of staff, members and target audiences are all good candidates to help test the process. There is a very good online tool call Websort which we use, that allows you to to set up the cards and ask people to arrange them online. This means the link can then be emailed to a section of members and users and the results are all organised into an easy to process chart.

User testing

Once you have conducted the card sorting exercises and agreed a new structure of the navigation it is a good time to test it out. Another great tool we use from the same company is Plainframe. You start by setting up the proposed new navigation is an easy to use menu builder. The next step is to create a range of informational goals or tasks which users to the site will be looking to do. You can use your organisational goals and personas information to help guide these.

Some example tasks may be:

- Join the membership organisation online
- Find out when the next event is taking place
- Find directions to the company HQ
- Rent a conference room 

Individuals can then be given individual tasks via a link to see if the navigation structure is easily understood and efficient to use. The data you get back is very powerful, each task is graded on number of click to find the content, time taken and where it had a successful outcome. You can even watch a video of each interaction with the menu - which can be fascinating!

The results give you complete confidence that something is working correctly or requires more work. At this stage it is easy to change navigation labels and terms to see if it improves the usability also.

If you think you navigation is not doing your website justice, try the above processes and start to see where it all could be going wrong.

Here are some good navigations sites for inspiration:

www.bbc.co.uk

Obviously! It has huge amounts of content in an easy to digest form.  The BBC main navigation is present across all sites, news, sport, iPlayer, weather etc. Once you are inside a section of interest such as sport or news, you may find that you will rarely use the typical navigation menus and more likely pivot from story to story in a natural way of related and popular panels.

http://www.lfhe.ac.uk/

A site we have worked on recently for The Leadership Foundation makes good use of an audience based navigation, The ‘I’m looking for tab’ allows users to identify their requirements for example if they are looking for something for themselves or their University, the page then is tailored by displaying relevant news, events, consultancy and publications.

http://www.west-thames.ac.uk/

(Mobile view - just grab you browser and resize to be the size of a mobile phone screen, the website will change automatically).  Mobile navigation is a large topic in itself, but after research it was decided that visitors to west thames college website via mobile would benefit from a reduced navigation of simply ‘courses’ and ‘Find us’. There is also a more tab that still gives users access to the remaining sections of the site but they just have less prominence.

Please feel free to share any websites you particularly love or hate the navigation of in the comments below, and let us know how you get on with your navigation restructuring!

Creating a successful website that connects with your users and fulfils their needs takes planning, analysis, great design and development, user testing and a plan to keep it running successfully into the future.

You know it needs updating, so where do you start?

What’s the purpose of the website?

The first question that anyone designing a website should ask is “What are the organisational goals?” translated this means what does the organisation want the website to do? Depending on your type of organisation the purpose of a website can vary greatly.

Goals may be to gain more members, achieve more event bookings, sell more products, distribute information as widely as possible or offer as much value to users as possible plus many more and probably all of the above. List these out and keep them to hand.

Who is the website for?

Now you know what the organisation wants (everything probably and more!). It’s time to think about the website users; after all they’re the ones who will be using the site.

The first step is to define the website audiences. A large website will need to cater for a wide range of audiences which could be both public facing and serve the needs of specific audiences such as professional practitioners. Whereas a smaller site could be purely consumer focussed with the sole aim of selling products or connecting users with companies.

List out all the website audiences you can think of and why they would come to the website, what they might expect to find and what tasks they would expect to fulfil. Some audiences will have similar needs; some may need everything the website has to offer whilst others may only use a small amount.

Starting to think this way is the first step to success, move away from silos of data or internal departmental thinking, this is how the organisation is structured not how users will interact with the website. It will also give you a perfect argument for defining what the website needs to do, because it’s based on real life facts.

A good exercise is to create some user personas, these are website users that you can make up or base on people you know will be using the site. List who they are, maybe what stage of their career they are at and then list what they come to the website for.  (check out Jonathan's recent blog post on persona planning here)

Don’t do it all on day one!

The temptation with a new web project is to do everything at once, everything should be automated and all the content will be there to support it.

The process above helps you to define why you need a website and what users will be able to do with it. The next step is to look at the results of the process, talk to users and establish some priorities. What needs will the initial release of the website need to meet? When those needs are met will you speak to the audiences and base the next phase on their feedback?

What functionality will the website include on day one? Functionality usually equals cost, especially if the website needs to pull the data from other systems seamlessly, so it’s worth defining how much of this process will be automated and what budget and human resources you have available.

Being flexible and doing your research means that you can adapt to the needs of your organisation and users to produce a website designed around them and ultimately it will be successful!

Before even contemplating the design, layout, structure or tone of voice for your website, it’s critical you consider:

“What are the needs of my audiences?”

After all, if your website doesn’t meet the needs of your target audiences, then your website has failed at the first hurdle and to put it bluntly - is a waste of time.

The idea behind creating personas is quite simply putting yourself in other people’s shoes.  It’s easy to think your website is or will become a perfect specimen.  Of course it’s easy for you to use the site and find what you’re looking for, after all it’s your website and you most likely created and structured the majority of the content!  But surely you’re not that selfish, what about other people?

This is where personas come in:  the creation of fictional characters that represent the key audiences you’re looking to cater for / are seeking to appeal to.  Not only will this task radically improve the likelihood of your website meeting the needs of your users, but it’s actually quite a bit of fun – honest!  Fear not, we aren’t suggesting you need to go and create a persona outline for every man and his dog, simply the primary ones so as to cover the majority of possibilities.

Below is an example of the types of information you need to consider for each persona.  Depending on the type of website you’re working on some points may be more important than others, but they’re all relevant to some degree.

Name

Here you can be a little creative, and think up some unique names for each user.  If these are to be for internal eyes only, perhaps they can be a little comical – I.P.Squintly or Seymour Butts…?

Age

The age of the user can determine a lot – for example casual copy will appeal more to younger users, and social sharing functionality is a must.  However an older user is likely to expect a more professional tone, and social sharing won’t be as important.  If catering for the ‘Silver surfer’ generation with poorer eyesight, you may want to consider using bigger text with more line spacing and larger buttons.

Profession

A lot can depend on industry sector and position.  A junior marketing professional is likely to be impressed by catchy one liners and creative imagery, however an IT manager will usually want technical information, diagrams and will often care less for clever play on words. 

Informational goals

Why is the user on your website, what are they seeking to find out?  Take a prospective member of a trade association.  They’ll usually want to know what the organisation does and what the benefits of membership are, before signing up and paying their subscription.  Therefore ensure this content is easy to find from the homepage and ideally everywhere else on the site via calls to action and an intuitive primary navigation structure.

Functional goals

Once a user has found the information they’re looking for, they will often wish to complete a functional goal.  In our previous example, this may be to subscribe as a member online.  It’s important that the option to do this is well signposted from the relevant areas (such as the benefits of membership).  Functionality should always be well thought out and tested to ensure a great user experience is provided, especially if you want repeat visits.

So there you have it, a watertight argument for the use of personas in website planning.  What are you waiting for?  Go forth and get your personas made up.  If you’re still stuck and need a helping hand, feel free to drop us an email and we’ll get right back to you with some tips and other examples!

Balsamiq

Create wireframes and mock-ups easily on your desktop PC or Mac.  Even better, Balsamiq can be installed as a plugin in Google Drive or even your Jira tracking system!  With over 75 user interface components and 187 icons included as standard, the possibilities are endless.

Adobe Ideas

Annotate existing designs using this handy vector based drawing app for the iPhone and iPad.  Adobe Ideas includes a concise set of tools and an advanced colour picker, providing you with all the flexibility you need.  It’s even possible to open your work in Illustrator to further refine things.

OmniGraffle

Develop your website structure and user journeys with this ingenious Mac and iPad application.  OmniGraffle gives you the ability to easily create a variety of flow charts, page layouts and wireframes.  Check out Microsoft Visio for a great Windows alternative.

Google Analytics

The power of Google Analytics cannot be underestimated when it comes to determining which page templates need to be focused on during redesign projects.  Clever visitor-flow features are also extremely useful when it comes to developing a user friendly navigation structure for your new website.

Lorem Ipsum

Ensure your designs will still look great with content, using this clever website.  Lorem Ipsum is deeply treasured by the print and typesetting industry, and allows you to easily generate dummy text based on your own chosen criteria – number of paragraphs, words, bytes and even lists.

POP

“Prototyping on paper” is an incredible iPhone app that allows you to turn sketches on paper into working prototypes.  By taking photos of your drawings, the POP app allows you to create links between these.  Once you’re happy, you can then share your creations with others to gain valuable feedback.

Silverback

Take usability testing to the next level using this amazing Mac software.  Silverback provides you with the ability to capture screen activity and even record the tester, allowing you to truly understand how intuitive your designs are, before moving to development.  Morae is a great Windows alternative.

Pen and paper

Our list wouldn’t be complete without the good old pen (or pencil) and paper!  Sometimes there’s nothing better than grabbing a piece of paper and scribbling away to your heart’s content. Blott is a truly inspiring alternative to your usual stationary supplier...

Not too surprisingly, we’re a dab hand at digital project planning and strategy!  So feel free to get in touch if you need help or advice.