Website Design

Dec 30 2016

Effectively Integrating Large, Noticeable Images into Your Website Design

On almost all modern websites, there are slider ads, background images, marketing graphics, or any number of other creations to avoid blank space. As page development becomes increasingly inexpensive and user-friendly, designing a website that features movement and rotating hero shots is now the norm. The trend is catching fire between large corporate and small business sites alike.

We can see the strategy used here to a medium degree on the Ikea homepage:

Retrieved from ikea.ca

And to an even larger degree on the Scotiabank page:

Retrieved from scotiabank.com

How the large image trend became a trend

All the marketing geniuses of the world wouldn’t be using large images on homepages if it wasn’t effective for some reason. For the most part, if used correctly, it can be as sleek as it is sexy. Especially when used as a background picture, the image works two-fold as it doesn’t take the room of precious content, and it makes the page immediately unforgettable. If it’s a flashy product or an attractive person, interest levels have a way of automatically rising. So, what could possibly go wrong?

You know how you feel ill when you see those commercials with a middle-aged man and wife, their 2.2 kids, and a golden retriever? It’s a similar case if you use stock photography on your website. So, in order for your large images – or any images for that matter – to be effective, invest in high-quality, personable camera work. This is just one of the many small discoveries that have been made during the investigation of the effectiveness of large photography on the web.

Effectively using a small image versus a large image to invite user reaction

Papiris wanted to increase the number of submissions on their Contact Us page. They kept the old page while going live with the new in order to compare, and made the following adjustments:

Removed bullet points to be replaced with short, sentenced copy
Removed the ability to scroll and navigate to other pages (to an extent)
Inserted a large background image and solidified the print

After these simple transformations, the newly designed page decreased the number of users who immediately left the site by 27%, and increased the number of submissions by 36%. The company used this data as a starting point and continued to apply background image tests on their other pages with success.

Large images on your website work, but to what extent? Four basic guidelines:

The problem with the above case studies is that they already had popular, optimized websites. Their raised conversion rates can’t be well rationalized or purely credited to graphics. The large images weren’t added to a failing website or just because they were trendy, so their effectiveness becomes very difficult to judge. Can this design type still work for moderate or small businesses?

To tell the truth, I really like this design type. If there isn’t a picture there – it’s just space. Too much writing is a hassle and also a turn-off for most users. So what’s left? Keep in mind it’s not Facebook or Instagram, so having a multitude of images is redundant and cluttered. Large-scale, beautiful, singular graphics seems to be the most optimal of solutions.

Overall, though this started as an analysis, but this article ended up to be well into the ‘for’ column in support of mega-images. But, they’re certainly not to be taken for granted. Consider the following when applying this design:

1) Give the user the option to scale them down

This can be as simple as a small “hide” selection or a mouse-over function. While they’re attractive at first, they can become too annoying or distracting. So if the viewer has the choice, it’s kind of the best of both worlds, right?

2) Make sure they aren’t too busy

The sports equipment image worked well because it was a landscape; there weren’t too many colours or textures. You will have to put text and content overtop the image, so make sure there’s not too much going on at once that will distract or confuse the user. The hue and brightness schemes become vital at this stage as well.

3) Be personable

We can’t state this enough! Use an image – or images depending on the number of pages – that are unique to your website. It’ll be much more effective than some drab graphic that was dragged from a stock image selection.

4) Test, and test again

You may love your page design, but as you quickly learn, others may not. Have any friends and colleague at your disposal take an unbiased look at your new design that features a fantastic, large background image. Test functionality and clarity, and be as objective a judge as you can.

The web-world is constantly changing and you won’t keep up, especially if you don’t have the dollars that the big marketing corporations do. Trust your gut, do your best, and your website will take care of itself. You just have to ask, what’s the best image I can input that will have the most effective cosmetic and meaningful impact?

May 30 2016

Optimizing for Smartphone and Mobile Device Users is a Must

It’s becoming a problem, and many have noted it as an already staggering addiction; I am at the point where I’m nervous if I don’t have my smartphone on me. And trust me, I’m not the only one. I’m not even a business owner, so I can only imagine what effect being phoneless has on someone whose livelihood depends on it. So, with a mobile or something similar always at hand, there’s bound to be a distinct effect on how people traverse the fad we call the internet, and therein, how they shop and educate themselves on products.

What does this mean for you? In short, if your website isn’t optimized for mobile and smartphone use, you’re putting yourself out of a lot of opportunities. A lot might even be an understatement. Here we discuss why it’s worth putting the extra cash into making your website mobile-friendly or choose a mobile responsive theme for your website on Nili Site.

The Stats Behind Optimizing for Mobile

Consumers now spend more time with online retail on mobile devices – including smartphones and tablets – than on their desktops and laptops. There’s a lot of waiting to go on in this world; whether it be on a plane, train, or in an automobile. Not to mention at the Department of Motor Vehicles (DMV). To rid themselves of boredom, people have a ton available at their fingertips to kill the time.

In July 2013, 45% of time spent with regards to online retail shopping was done so with a smartphone or similar mobile device. Since October 2013, this number has not dropped below 50% and in June 2014, the most notable increase hit 60%. If you and your site aren’t concerned with optimizing for mobile, you’ve potentially given up on almost two-thirds of your prospect base.

As if that wasn’t enough, there are also a number of US digital retail visitors that do so solely on their mobile device. As of January 2015, 13% of Americans only online shoppe via their smartphone, tablet, etc. To simplify the point: if your site isn’t being optimized for mobile users, you are literally eliminating over 10% of your possible consumers. Staggering.

If you and your site aren’t concerned with optimising for mobile, you’ve potentially given up on almost two-thirds of your prospect base.

Google Loves Optimizing For Mobile; So Should You

Google released its new Hummingbird Algorithm for how it uses its bugs to searches through keywords, graphics, web content, etc. There were a number of new changes, but they notably increased their rankings for optimizing for mobile use. This included an internal look at their own mobile and voice-related search activities as well, so you know they mean business. What does it mean for you? If your site is not being optimized for smartphones, you’ll take a serious hit in rankings.

This is inherently linked to load times as well, as 30% of mobile shoppers discard a transaction on a site that is not readily tablet or smartphone friendly. If a page takes three or more seconds to load, 57% of mobile customers will abandon your site altogether. Google takes all of these factors into account, and the more effort you put into optimizing for mobile, the more you will be found. No ifs, ands, or buts.

Increased Traffic and Conversion Rates

With higher ranks on Google, you’ll increase your traffic. That’s a fact. But remember that not every business is putting as much cash into optimizing for mobile as they should be, so users will quickly move onto the next option. I’m the same way! I don’t want to wait for what I want now. So, if you are one of the ones that can load quickly on my smartphone, with a noticeable Call-to-Action and a tidbit on what you can do for me, I’m much more likely to treat you well. I’ll take the time to at the very least give your site a cursory look because you took the time to make my life easier.

And, because you were so kind to me, I am more likely to buy something from you. It’s pretty much a good customer service standard that you make your site accessible. I shouldn’t have to work to buy something from you, right? I know you’re giving me a good product, but streamlining the mobile process is a sure way to increase your conversions. Not to mention, if I’m on a smartphone, spreading the good word also becomes a much easier endeavor.

In Summary

Remember this doesn’t just go to your site; optimizing for mobile is a necessity for all aspects of your inbound move. This includes your social media feeds (which should be done anyway, but make sure), your email campaigns, your blog and interior pages, etc. The better the functionality of your site is from any type of smartphone or tablet, the more sales you will have; or, at the very least, the more sales you will give yourself the chance of being able to make.

Remember when you’re optimizing, you may have to cut some things from your mobile site, depending on the apparatus the user fancies. What do you think a mobile site should include to effectively increase conversion rates? Do you find the mass increase in mobile shoppers an inconvenience, or do you consider it an opportunity for you to up sales?

Apr 27 2016

Your Landing Page’s First Impression Lasts Forever: Make it a Good One

You have written plenty of pieces on the content of your site, and that is vital for collecting viewership, but the first things your viewer sees are the most important in capturing their attention.

That’s part of the reason a Call to Action is important, especially on your landing page, so viewers aren’t asking questions about what their role is in the buying process. And, especially with all the competition out there, the look a prospect gives your site will be cursory at best.

An abundance of research shows how important a first impression is, and even if that first impression is later proved to be wrong, there’s no real coming back from it. So, what can you do on your website to make sure you nail your first impression?

We have a few ideas that’ll help:

1) Find What Makes a Poor First Impression?

For me, it’s initial load times. If a landing page takes too long to load, I’m impatient, will hit the back button, and go to the next one on whatever Google returned. (And this is why Google considers your website load times!)

Secondly, if I find the website doesn’t answer my question or service relatively quickly, I’m bound to move onto another option. If there are too many irrelative pop-ups or the layout seems old-fashioned and difficult to navigate, well, if you’re not contemporary, you’re probably not worth buying from.

2) Try a Short Video

I used to work in corporate and commercial media, writing and producing videos running from $2000 all the way up to $50,000 in cost. There are some amazing things you can do with 2D and 3D graphics to capture viewer attention to make a great first impression.

This Psychology Today article helps break it down. Consumers are 39% more likely to share content if it’s delivered by video, 36% more likely to comment, and 56% more likely to “like” it.

Moreover, a video is perfect on your landing page to inform your customers as well as increase your viewership. Watching a video is passive and does not take nearly as much effort as reading. It just requires less processing. Which in some areas may be bad, but when trying to produce conversions, going the route where the brain processes information 60,000 times faster is definitely the safer bet.

3) Being Too Vague and Impersonal

When shopping online, consumers usually have a good idea of what they’re looking for. It’s not like walking through a mall and “window shopping”; they’ve deliberately searched for a specific item or service, and your first impression – again, usually on your landing page – tells whether they’ve found it.

So, when they land on your site, they want to see what you have to offer and for how much. This is what’s called a value proposition. It’s not a slogan or a call to action, but can be somewhat related to both of them. It can include bullet points, a 2-3 sentence paragraph, visuals, etc.; as long as it’s concise and clear. You want a person who knows nothing about your site to see it, and in one sentence, be able to pass onto their friend exactly what you’re offering. Your Call to Action is then the medium to the conversion.

Seeming like a faceless corporate entity can also lose you some prospects as well. Despite it being an online process, consumers still want to know they’re buying and helping someone local or someone personable rather than funding the corporate machine. This can be as simple as a few sentence mission statement of the Founder/CEO, a picture, or a short bio. It doesn’t necessarily have to be on your landing page, but a bit somewhere on your site is sure to benefit.

4) Spark Interest for a Great First Impression

Just like playing the dating game, the key to starting and continuing a successful relationship (at least one of them) is sparking interest. A study was conducted where participants ranked sites of what sparked their interest, spending only 20 seconds on each site. The results, in order, were:

Logos
Navigation menus
Search Box
Link to Social Media
Primary Image
Written Content
Bottom of the Page

Take this list and conduct a vetting process for your own website. I think how these items are ranked is pretty accurate, so make sure that your pages follow this order of what’s catchy and exciting. On a budget? Think of it as a game of Risk: you don’t have to distribute your pieces evenly at the start of the game, and similarly, when starting your website on Nili Site, put the majority of efforts into what matters.

To Sum Up

A first impression is vital and near-impossible to come back from. Don’t let it go to waste, especially after all the extensive labour you’ve put into drawing viewership in the first place. I say it all the time: have an objective third-party scan your site and tell them to be as critical as possible. You don’t have to pay for it; there are enough in-laws in your family who will be happy enough to find reasons to criticise you.

What do you think are the most important factors in spicing up a website’s first impression? Why are you most likely to ignore a site, and how can it be efficiently mended?

Nov 19 2014

Tips 4 Designing Landing Pages That Will Attract & Keep Users

Maintaining a modernized website is a vital aspect of any business. Just like seasonal fashion lines, online presence is a changing atmosphere that must be constantly adapted to command attention.

After a search, your landing page is the first your user will see. Similar to the cover of a book, if it’s not appealing, the viewer will assume the same goes for the rest of your site. Think of it as an audition or a first impression. So what’s in your control? How do you know what to change? One of the most influential factors, if not the most influential, is colour.

It’s the first sense that the brain interprets, and in order to have an effective and attractive landing page, its adequate integration is vital. Here are a few tips on how you can apply colour to increase viewership and time spent on your site:

Firstly, design your landing page for your demographic.

Gender

Depending on your product or viewership goals, you probably have some type of target audience. If you’re not sure, it’s important you find out; your success could depend on it! The attractiveness of your website pages will persuade someone to stay and play or leave and never return.

For women

the most appealing colours consist of purple, green, and blue, while orange, grey, and brown are the least.

It’s important not to overdo it; this research doesn’t mean to splash your site with the same colours over and over again. Rather, your landing page and primary selling pages should consist of similar schemes to identify your brand. It’s still important to keep it simple and not overcomplicate.

Targeting the male demographic

Surprisingly similar to the female, blue, green, and black have shown to elicit the most positive responses, while brown, orange and purple do the opposite. These are the classic ‘manly’ colours, and should be prominent around the calls to action and the sections of your page you want to notice the most. The slang and embedded images have plenty to do with the attractiveness of your landing pages and they too must complement each other.

Age

Children hold a significant influence on where their parents’ money is spent. Use this to your advantage, and sell to them as much as you do their mom and dad. As you can imagine, the younger your target demographic, the brighter and more attention-grabbing your landing page needs to be. Children appreciate web pages that apply colours like red, orange, pink, and yellow. Discontent and depressing are more associated with brown, purple, and surprisingly blue. Of course, the hues/shades of these do make a difference as well, and these should only be used as general guidelines.

As later adolescence and adulthood arrive, the preference moves more toward cooler, less flashy shades, like a blue or maroon. In hand with this development, so does the ability to critically think and make connections. These associations include colours to emotion, feeling, and memory; for example, red with alarm, severity, and passion, green with envy, or black with sadness and grief. Many of these relationships may be personal, so aptly interpreting each colour for your landing page is impossible. It’s still vital to take the most popular into consideration.

Secondly, use your landing page to evoke emotion

Colour is a primary interpretation to consider when evoking emotion from a user. Keep in mind; your landing page design must also work in complement with your writing and images in order to maintain the feeling that the colours first presented. Many researchers have come to different conclusions about general representations of emotion as dictated by colour, but here are some summary points that most agree on:

Red: the most opposing of all, it creates feelings of love, passion, and excitement; but at the same time, anger and danger. It can increase the heart rate and appropriately draws attention as an accent, but not so much a primary
Orange: Like red, it demands attention but isn’t as overbearing. It’s aggressive and demands energy, vitality, and happiness, and in a way remains friendly. Great for calls to action and subscription requests.
Yellow: Energetic and warm, think of it like the sun. Optimism and cheer tend to arise from this colour and will generally make a person feel similar to the effect laughing has. It can act as an irritant if overused, apply it similar to orange to command attention or accent, but not as a base.
Green: Many see this as the colour of wealth, but more deeply for new beginnings outdoors, and health. It is a relaxing hue that should be used to balance design and for inspiration.
Blue: Similar to green, this colour offers calmness as well as trust. It’s one of the most favourite as a base for websites and is a great start to give your landing page attractive appeal. It’s professional while easing and friendly, but too much can create a feeling of coldness or hardship.
Purple: Mostly associated with royalty, this colour is also a sign of wealth and also a soothing agent. Use it as a base to show luxury and wealth, or if you have a primarily female target audience. Romance and mystery are also drawn from this colour, accounting for its use for health and beauty products.
Neutral colours: These include black, grey, brown, and tan – they’re the ones that can pretty much match with anything, perfect for background colours. Apply texture and grains carefully with these, as they’re boring on their own but can be used to create excitement and elicit thoughts of change; i.e., “they’ve taken something boring and transformed it into something of substance. Maybe their product will do the same.”

Now, these are suggestions, and colours are extremely opinion based. They won’t mean the same to everyone, and how one person reacts will be the opposite of how the next dose. That being said, it’s information that’s vital for your consideration and will be effective in engaging your audiences. Keeping a fresh look will consistently draw repeated visits to your site as well; so ask yourself, how can I consistently use colours to my advantage?

Website Design

Effectively Integrating Large, Noticeable Images into Your Website Design

How the large image trend became a trend

Effectively using a small image versus a large image to invite user reaction

Large images on your website work, but to what extent? Four basic guidelines: