Web design and SEO trends, tips, techniques and best practices.
Whether you’re a web developer or a website owner, being able to quickly and easily view, edit and debug your website is essential. One way to do this is with a tool built right into your browser - Chrome’s own Developer Tools. In this blog post, we will take an introductory look at what these tools do and how you can use them to monitor and improve your site.
If you haven’t made much use of Chrome’s Developer Tools yet, simply open up your website in Chrome, right-click on any element and choose "Inspect Element". You’ll find that a new window opens are the bottom of the page and that there are several tabs across the top: elements, network, sources, timeline, profiles, resources, audits and console. Let’s take a look at each of these in turn.
This is the area in which you can see your main HTML coding. Because it is syntax-highlighted and an indented hierarchically, it is easier to read than some sources and will show you exactly how each page looks to the browser itself. You can edit and save any changes directly to this window if you like (and also go back and undo any unwanted changes you just made!).
On the right-hand side within the elements window, you’ll notice the CSS style panel, which will show you the styling that’s been applied to any given element. Particularly useful here is the ability to quickly change font sizes, colours, margin and padding, and a whole array of other effects directly on the screen.
Useful for providing information on load speed time, the ‘network’ area itemises and shows on a timeline each element that has been loaded on the current page, including the size and type of file. A useful shortcut here is to click on any heading to order the information. For example, clicking on ‘time’ will allow you to see at a glance which elements have taken the longest to download.
The timeline shows the length of time it takes for each element on a particular page to load, script and render. You can start and stop recording, before analysing the results using the profile tab.
This area helps to optimise site performance, decreasing page load time and therefore scoring more brownie points from the main search engines. Here you can see which resources are required by the browser to load the page, the time it takes to receive these requests, the order in which they fire-off and how much bandwidth is being taken up.
Device emulation mode
Google Developer Tools is not only useful for desktop sites but for mobile and responsive websites too. By clicking the button between the magnifying glass and the ‘Elements’ tab, you will be able to open up “device emulation mode” to view the site as it would be seen on Apple, Samsung, Google, Nokia and Kindle devices. Simply select the device required from the dropdown list. You can also select various network options and view in portrait or landscape mode.
Google Developer Tools are a really useful, free method of giving an overview of your site’s performance. Since they’re already built-in to Chrome, the tools an be used to make quick, temporary changes to your site when necessary or play about with layout, colour or font choices without even leaving the browser. With the ability to analyse site performance, eliminate errors, view on multiple devices and make live edits, it’s a powerful toolbox and is easy for both developers and site owners to use. If you haven’t tried it, go ahead. Before you know it you’ll wonder how you managed without it.
If you sell items on your website, there are things you should always be aware of, whether you run a fully fledged global site offering hundreds of products or are just setting up a small boutique store. In this blog post, we look at the essential elements that lead to ecommerce website success.
Let’s start with the most obvious but most important point – if you want people to buy from you, your products need to be great. But whereas in a bricks and mortar store where people can quickly ascertain the quality of your merchandise, online it’s a little more difficult. It’s therefore essential that you show your products in their best light. Self-taken, amateur shots won’t do. Make sure you have professional photographs taken of all your products and display these images with options to view from different angles and zoom in.
Once your customers have ‘clicked into’ an item to find out more, include as much information as you can – sizes, colours, dimensions, materials, availability, price and so on, as well as customer reviews and ratings if you have them.
Your brand needs to portray an image of quality and reliability, helping potential customers to understand what your company is about and encourage them to revisit. You’re expecting users to part with their hard-earned cash.
Branding and design can play a big part in making the user put trust in your products over a competitor, so you need to ensure that the various elements of your site are consistent, from layout, colours and typography to image use and tone of voice. Above all, your brand and your message needs to shine through, so make sure this is clear on every page.
The more products you are selling, the more complex your navigation system might become and it’s easy to end up with too many layers, dropdowns and multiple paths. Organising your products into a catalogue where users can browse by category or search for items is important, and including thumbnail images will help visitors to quickly find what they’re looking for.
An ecommerce site will only be successful if your customers trust you and know that their money and personal details are safe. You can raise your credibility with customer reviews and ratings, especially those from external sources, and ensure that you include FAQs, details about shipping charges, return policies and so on. If you are seen to be taking your business seriously, your customers will too.
Accepting safe payments is essential and so you need to have the ability to cope with encrypted transactions. Using a service such as PayPal is an easy way to do this and is a globally recognised company that already has a level of trust built in.
Well before you open your online doors for business, you will need to make sure you have all your backend systems fully functioning and ready to go. Your customers could potentially come from all around the globe and so you’ll require a robust hosting provider to make the most of this.
Supply and distribution needs to be smooth and fast to meet consumer demand and everything must be fully tested and working before it goes live. It’s essential to deliver what you promise. You will also need to have systems in place to deal with anything that goes wrong. Customers have plenty of power in the form of social media and if your service isn’t up to standard, it only takes a tweet or Facebook update to do a lot of damage to your business.
Making sure that your policies and procedures cover what to do in the event of returns, complaints, social media comments and so on can help you to turn what might seem like a crisis into an opportunity.
New content, deals and promotions
People like to see that your site is evolving and that new items are appearing on the ‘shelves’ of your shop. So when you add new merchandise, make a song and a dance about it with additional page real estate, glossy new pictures or extra pages for ‘Hot New Products’ or ‘Fresh off the Press’.
Similarly, everyone loves a bargain. You might choose to feature particular items, offer seasonal discounts, give promotional codes for subscribers of your newsletter, offer free postage and packaging when customers spend over a certain amount or even link your offers to Twitter contests or Facebook competitions.
However you choose to promote items on your site, make sure that visitors know about the deals that are currently available – don’t hide your best offers away at the back of the shop!
The personal touch
Finally, just like in a regular bricks and mortar shop, what people really want is the personal touch. Online, this means everything from including contact details (not just an email addresses, but real people on the end of a phone too), customer help options, live web chats and information pages on your site telling your customers who you are, what you believe in and what your story is. Remember, people buy from people.
Running an ecommerce site can seem a little daunting, but with an eye to the details and a sense of product, people, placement and promotion, it can be not only a lucrative opportunity but also a very rewarding business. Good luck!
In December 2012, a story by journalist John Branch was posted on the front page of the NYTimes.com website, entitled ‘Snow Fall: The Avalanche at Tunnel Creek’. An elegant, long-form, multimedia piece that captivated millions of readers worldwide, it went on to win a Pulitzer prize in feature writing and led to a change in the way many web designers view content.
The story itself was special, but it was the presentation of the story that made ‘Snow Fall’ such a phenomenon. (About 3 million readers visited the article in its first week online, a great number of them people who didn’t usually read the New York Times.) Including everything from video, parallax scrolling, animation and slide shows, the article delivered the story in a way that was forward-looking, stylish and utterly compelling.
In this blog post, we’ll be taking a look at some of the elements of the Snow Fall effect and some pros and cons of using this is a design strategy on your website.
What does Snow Fall content include?
The story itself
No matter how many bells and whistles you add to make your Snow Fall page engaging, the story must always come first and foremost.
The Snow Fall effect is all about quality and refinement, so high-quality, often edge-to-edge photographic images are essential. Snow Fall content is usually best viewed on large screens, so it’s worth thinking about this when you’re planning out whether Snow Fall is the best strategy for your story.
These automatically play, are often full-screen and can provide anything from a graphical backdrop to a more informative learning point. The absence of sound can be more powerful than audio, and is often used to set the mood for a piece.
Animations, explanatory videos and slide shows
“Snow Fall” articles work well for non-fiction texts where these elements can really come into their own. Remember the story you’re trying to get across to the reader and choose the best tools with which to do this.
A jquery.inview scrolling mechanism
As the user scrolls down the page, actions are triggered – videos start to play, animations begin, backgrounds are faded in or out. This is an essential part of the Snow Fall effect and the thing that makes it so exciting to read. Just be careful that it’s not too distracting.
A curtain effect
This style allows layers to be pulled up or pushed down to cover or uncover areas of text, images or video. Used well, it can draw a reader into the story effectively, but remember to use it selectively where it really adds something to the story and isn’t just a gimmick.
With this technique, different layers (or images or videos) of your website move at different speeds as the user scrolls up and down the page.
Are there disadvantages to the Snow Fall effect?
As with any type of web design, there are pros and cons. Using the Snow Fall effect takes a lot of expertise and is therefore time-consuming and costly. And adding too many images, videos or animations can distract the reader away from the story and focus elsewhere.
But when well executed, the effect can be magical. This is because the main strength of the Snow Fall effect lies in its ability to connect emotionally to the reader. By engaging so many senses and flowing seamlessly from one element to the next, it draws readers in and dovetails with natural storytelling forms. If you’re looking for a way in which to showcase your long-form content whilst inspiring and delighting your readers, Snow Fall is it.
If you have made a decision to have a mobile app developed for your small business, you probably don’t plan on engineering it yourself. Instead, you will be turning to a professional software development service provider to get the job done.
But even if you are not taking care of the technical side of things directly, the functionality and ultimate success will be down to you.
Your software developer should be able to provide solutions and suggest ideas to enhance what you are trying to achieve, but nobody knows your business or your target audience better than you do.
So with this in mind, here is a quick introduction to a few of the most important rules to follow when it comes to putting your first small business mobile app into development:
1. Have A Clear goal
First and foremost, you cannot expect your mobile app to perform to it’s maximum potential without first establishing what it is you wanted to do. In some instances, small businesses create mobile apps simply to entertain and engage their customers.
In other cases, mobile apps exist exclusively for the purpose of maximising sales. A mobile app can provide a wide variety of functions and any number of things combined, but you need to know exactly what you expect to get out of it before even thinking about putting a plan into action.
2. Know Your app’s audience
You’ll also need a comprehensive understanding of your target audience, in order to ensure that the mobile app created is as effective as it can be. This means carrying out as much research and analysis as necessary to find out how your audience interact with their mobile devices and what types of device they show preference to. This isn’t an easy or a quick job but it is of the utmost importance.
3. Keep your development simple
Simplicity is important for two reasons – the first of which being that mobile devices do not always have a great deal of power to work with. The more complicated your app, the more memory and battery life are required to power the processes. This is especially significant with lower-end devices. In addition, the average consumer is all about speed and efficiency when it comes to their mobile devices. As such, whatever it is your app is created to do, it should do it as quickly and simply as possible without unnecessary fuss.
4. Developing for iOS and android platforms
You will need to decide exactly which devices and platforms your mobile app will target specifically as there are enormous differences from one to the next. For example, it’s all well and good creating an app that delivers an outstanding user experience for iOS users with large-screen iPads, but what about the tens of millions of consumers with Android devices? The simple fact of the matter is the more devices and platforms your application supports, the better.
5. Unique app elements
Assuming your business already operates to an extent online, you need to give your target audience members some kind of reason or motivation to use your mobile app. After all, if the app doesn’t do anything different to your standard website, chances are they won’t bother. You could do something different with the user experience, perhaps introduce an exclusive special offer or really anything else that brings something unique to the table. To put it another way, your mobile app has to exist for a reason, not just for the sake of it.
6. Extensive app testing
It is of critical importance not to release a mobile app before testing it extensively and ensuring that 100% of bugs and faults are ironed out. This is particularly important if this happens to be your first mobile app. First impressions need to be excellent, and bugs and errors can reflect badly on your business. This also ties in with point 3 above, as simpler development processes can keep testing time to a minimum.
7. Monitor your app interactions
Last but not least, a mobile app launch is much like a website in that it represents only the first step in an on-going process.
From the very first day, it is of crucial importance to carefully monitor and analyse everything in terms of audience interactions, conversions and user behaviour. By doing so, you will discover exactly where to make improvements and refinements to make sure that every bit of your mobile app is as effective as it can possibly be. Even if this requires the help of a conversion expert, it is a good investment and one that must be considered in your app’s on-going improvement.
Not everything that’s on your website might be for public consumption. If your site is accessible to staff for example, you might wish to create an area especially for employee access.
And if you already have a website with plenty of free, high-quality content and an audience who are eagerly coming back for more, there could be some financial benefit to having a members-only area of the site.
In this blog post, we look at some of the reasons for having a membership area and the first steps you’ll need to take when planning and setting things up.
Why you might need a website member area
Some of the reasons you might be considering having a membership area include:
- Sharing documents or work-in-progress to clients.
- Sharing non-public information with stakeholders.
- Sharing photos with family or friends.
- Creating a members-only area to allow VIP access to audio, video, ebooks or other privileged content.
- Setting up a social platform for members to communicate with each other.
- Creating ongoing, passive income from a content-drip programme.
Before you start, be sure to carry out some market research with your existing users to find out whether they’d like and use a members-only area. Since this is a large and long-term project, you need to know that it will be worth your investment.
Having non-public areas will enable you to broaden and deepen your website productivity and really encourage interaction from everyone involved, but to get it right requires plenty of forward planning. Let’s look at the different types of membership areas available.
The different types of website secure zones
Yes, the way in which you set up your site will have advantages and disadvantages that you’ll need to think about carefully before selecting a strategy. Crucially, whichever you choose will need to fit your core purpose and audience. Here are the most commonly used solutions:
- One password for all members
- Password-protected areas for different groups of people (a different password per group)
- Personal log-in
- Personal social log-in
- Using a content management system (CMS)
One password for all members
Easy to set up and administer, having one password for all members has its advantages, but it’s the least secure option since people are able to share the password with others very easily.
Password-protection for groups
Group passwords allow you to share different pages and resources with different groups, such as running a tiered membership system where different people have a different level of access. Again, passwords can easily be shared or copied, so whilst it’s a practical solution, it’s not the most secure.
It does take more time and expertise to set up a personal log-in system, but this is outweighed by the fact that users can be added or removed individually, password recovery is available and you can control access much more easily. Content can be provided at an individual level, which can make for a much more personalised experience.
Personal social log-in
Integrating a social login feature gives users the option to sign-up and login with a single click using their ID’s from Facebook, Twitter, LinkedIn, Google+ or many other networks. This format offers you the control and flexibility of a personal login, but with simplicity for the user to access the system without the need for username and password fields.
Content Management Systems
A CMS can act as a social network for your membership area with a lot of potential features and advantages, from allowing your users to communicate with each other, offering an exclusive environment, privacy level, potential to integrate with email marketing and payments systems, links to existing social media and so on.
But depending on your choice of provider this might not be cheap, and will take time and effort to set up. What will you need to have in place before you start?
Now that you’ve chosen the type of membership area that would best suit your purpose and audience, you’ll need to plan exactly what content you will be offering and how you will go about presenting it. Typical content might include:
- Audio and video webinars, lessons or demonstrations
- Transcripts of audio and video resources
- White papers, articles or written reports
- Photographs and movies
- Special offers and discounts
- Sneak previews
- Ebooks or printed books
- Checklists and templates
- Ways to interact personally with you (support links, phone conversations, online chats etc.)
Whilst you won’t have all of this in place before you start, you’ll need to have a good amount of content ready to go when the doors to your membership area open.
You’ll also need to have a clear plan for keeping up with content creation, client interaction and website maintenance. Ensuring that you have the time and the resources to manage the system long-term is absolutely essential for success.
Setting up a membership area on your website can range from a small, staff-only area containing shared documents to a full-on, tiered, paid subscription site for thousands of visitors.
Whichever type of site you are setting up, making sure that the basics are in place before you begin and keeping an eye to the longevity of the project will help you to achieve your goals and create a truly valuable addition to your existing website.
Or if you prefer use one of our linkware images? Click here