Web Design and SEO Blog

Feb201625

The Meaning Behind a Website’s Color

by Sam McCue in Design, Imagery, Tools & Tips, UX

The Psychology of Branding Colors

Do you ever wonder how website designers choose colors for their projects? There's a lot of strategy and consumer behavior research that goes into the colors on websites. Typically the color scheme is directly associated with the emotions they are trying to impress upon their users. Here are a few examples --

Domino's and other pizza chains predominantly use red on their sites.
Domino's and other pizza chains predominantly use red on their sites.
Red is an all-out attention getter, can have a physical effect on people and has been known to increase metabolism (1). Could this be why so many pizza websites prominently display this color in their design? In some studies red has also caused people to become more responsive to quick decision-making, eliminating the period of time they spend analyzing whether or not they should buy something (2). Notice how Dominoes and Pizza Hut have employed this with their “Order Now” button, enticing the user to get a pizza. You can almost smell the conversions.

Blue, a calming color, is often used for hospital branding.
Blue, a calming color, is often used for hospital branding.
Blue is the most widely-accepted color overall. It is associated with tranquility, peace, and similar soothing feelings. It is no wonder then, that some of the most notable hospitals in the country use them in their branding. Hospitals want to display a trusting, caring and peaceful format on their website.

BP and Sinclair hint at environmentalism with a green palate.
BP and Sinclair hint at environmentalism with a green palate.
Green has the repute of being environmentally friendly. It is often associated with organic foods, sustainable practices and an overall natural vibe. Is it no surprise then, that some well known oil and energy corporations have green themes, nudging those that interact with their brand to see them in an environmentally oriented light?

Purple hues are associated with royalty and indulgence.
Purple hues are associated with royalty and indulgence.
Violet is the color of royalty and is often found on websites that are offering products of indulgence or wealth. Some real estate companies use it to convey a premium product and banks have been known to integrate it into their brand as well. Crown Royal uses violet hues to elevate their bottles to a higher shelf. Why not candy? A violet theme on Cadbury’s website gives the user a sense of quality and extravagance.

Bank of Bozeman's blue palate set against Clark's orange one.
Bank of Bozeman's blue palate set against Clark's orange one.
Not every website follows these subliminal nudges, however many of them have put a lot of time and research into making sure their branding is consistent with the company’s messages. There are countless other examples of websites employing color psychology to help supplement their branding. To name a couple examples from our work, We gave Bank of Bozeman the cool, friendly feel of blue, and Clark Film Buying hues of orange to make it enticing and exciting. The goal is to find the point where intelligent design meets aesthetic branding. The colors of your website will have an effect on the way your users interact with your brand. Choose wisely.

Sources
(1) Smashing Magazine
(2) Forbes
Feb201624

A New Website for Ooh…Shiny!

by Mira Brody in Announcements, Design, Development

Ooh Shiny! website.
We recently finished a beautiful new website for Josh’s sister, Catherine, who creates handcrafted bracelets, earrings and necklaces. Ooh…Shiny!’s new online home features a full catalog of products, which links to her Etsy shop for purchase. We've included an About Us page as well as a Contact Us form to provide customers with a space by which to request custom orders.

We built Ooh…Shiny! as a single-page scrolling website, which makes for a nice, simple, flowing user experience, as most visitors are probably looking to browse her vibrant catalog. We invite you to view the new site, and check out Catherine’s pieces of art.
Feb201620

Benefits and Drawbacks of a Scrolling Website

by Mira Brody in Content, Design, Optimization, SEM, SEO


With over 18 years in the website design and development industry, our team understands that new trends are just another part of the job that changes drastically over time. Some are remembered fondly, others reminisced about humorously.

One such modern, trendy design pattern is the use of single-page scrolling websites, featuring animated text, images, or video sliding across the screen by scrolling up or down and providing the user with a tour-like participation. We’ve been applying this technique to a few of our projects, feeling out as we go where it improves or obstructs the user experience.

Here are some of our own experiences with scrolling websites:

UX benefits to scrolling sites.
Scrolling websites can be incredibly engaging when properly adopted by a company who has a chronological narrative to tell. For example, a business can use their story as a sales pitch to their visitors, leading them up to a call to action at its conclusion. Healthcare-Malpractice.com is an organization that helps victims of medical malpractice regain their dignity and receive legal and financial justice. For those unsure how they can be helped, there is an informational “tour” on the landing page for malpractice victims. Another good application of a scrolling page is fitbit.com, whose use of a scrolling products page unerringly represents their active lifestyle branding while thoroughly introducing their various products, ultimately leading you to their product sell page. Apple’s Mac Pro does something similar with the use of takeover scroll events to effectively present a product that leaves a lasting impression on visitors.
Healthcare Malpractice.
Healthcare-Malpractice.com's victims page presents a scrolling tour of their services.

Navigation through these websites is simple — the user doesn’t have to think too much; moving their scroll wheel in a downward motion is the only action required of them, and by the end, they’ve viewed all of your content. If this style works cohesively with your brand, it can create a positive and memorable experience for your users, encouraging them to return or make a recommendation. As with many fancy new trends however, there are instances when user experience (UX) can be compromised by these scrolling events and we are challenged to adapt our techniques to accommodate.

User experience disadvantages — and our solutions.

Ooh…Shiny! is a scrolling website we recently built for a customer who designs and sells custom jewelry pieces. We chose to go the way of the scroll because of the small size of the site and the linear, coherent narrative — there was only need for a home page, product catalog, about us, and contact form. Because of her extensive inventory, however, we discovered that the load time for this single webpage was excessive and needed an integrated solution in order to make the experience bearable.
Ooh...Shiny!.
The entire Ooh...Shiny! website is a single, scrolling page.

The solution to this performance issue was easily mitigated by “lazy loading” techniques, which allow the browser to only load product images as you scroll down to view them instead of loading all of the products when you first open the website.

Another common issue for single-page scrolling websites with immersive visuals and complicated transition effects is the experience on mobile devices, which is critical because mobile internet users have far surpassed desktop users (2). Fancy parallax scrolling effects can look cool on desktop computer with a fast network connection and high-powered processor, but often choke and sputter for those browsing from a phone or tablet. Parallax scrolling and other scroll takeover effects can introduce confusion, because the screen does not move predictably when swiping. There are a couple ways that we can work to improve the experience we want for visitors. The first is a specific solution for this problem: simply removing any fancy scroll takeover events, much like we did with Healthcare-Malpractice.com/victims. We disable the parallax sliding and what remains is a single mobile-friendly page with a simplified, stutter-free experience.

A bigger-picture way that we work to avoid this sort of problem is by planning the mobile layout of your site's content separately, taking care not to assume that the decisions made for the desktop size will translate on to a smaller screen. Instead of squeezing your desktop site into a smaller box, we create a visual system that takes into account whether you’re interacting with your fingers or mouse, the size of the screen, and the likely speed of your network connection — ensuring your company’s site is flawless no matter what device your customers are on.

In addition to design hurdles, there are a few online marketing drawbacks to scrolling sites as well. We have worked to build long-term solutions that overcome these problems, ensuring your visitors are not only happy with navigating your site, but that they can find you in the first place.

The problem with online marketing.
Search Engine Optimization (or, SEO) is the process of optimizing your site so Google and other search engines can properly index your content and display it in results for prospective customers to find. Because they are known to increase the chances of customers leaving, building an entire website on a single scrolling page can limit your ability to build your site’s online authority long-term (3). Usually, Google indexes each page of a site separately, recognizing their individual purpose and funneling the right searchers to the correct pages. Our marketing team has successfully created solutions for some of these issues and applies them in ways that will best benefit you.

Traditionally, sites are designed with individual pages, each of which has its own headers and meta tags — information that is not displayed on-page but instead informs search engines of its purpose. With our scrolling websites, it is possible to create a pseudo-page structure that assigns a unique URL, metadata and headings for each section on the single-page website. Because structuring your website across multiple pages provides the benefit of having multiple unique keywords in your URLs, there are some projects for which we’ve implemented different URLs as you scroll, allowing browser navigation such as bookmarking and improved keyword search for your visitors. For example, the detail pages of Ooh…Shiny! act like as landing pages and therefore are easily indexable by Google.

Replacing a multi-page site with a heavy, single scrolling page will likely penalize the strength of your business’s established SEO. For a new business or product-specific landing page, however, this streamlined design may increase visitor retention and overall user experience to benefit your business in the long-run.

The choice to scroll.
A single-page scrolling website can offer the opportunity for some creativity in design, allowing a business to effectively illustrate their personal narrative while boosting visitor interaction and retention. The focus of a scrolling site is to offer your visitors a tour through your offerings, which works well for organizations who have a cohesive philosophy or linear organization. It can be a powerful design choice, but should only be pursued if you’re aware of the challenges to overcome for user experience and SEO.

Whatever the business type, we welcome your thoughts on this technique, whether you have a similar site or have visited one:
  • What are the conditions that have led you to design and build a site this way?
  • What about this type of site do you find advantageous and what do you find that doesn’t quite work?
  • Is sacrificing a few SEO advantages worth an improved experience and are the solutions worth the work?
  • Do you enjoy the experience presented by scrolling websites?

Sources
(1) https://blog.kissmetrics.com/loading-time/
(2) http://adwords.blogspot.com/2015/05/building-for-next-moment.html
(3) http://aroundanalytics.com/trick-to-solve-high-bounce-rate-of-google-analytics-in-a-one-page-site/
Feb201619

Yield Better Google Results

by Mira Brody in Google, SEM, SEO, Tools & Tips

search tips for Google.
Search engines carry immense indexing power. When you type in a certain search phrase, it takes milliseconds for the engine to return results. We have compiled a list of “search engine hacks” that make our lives easier, because when you search smarter, you can increase the success rate of your searches and your productivity as a result.

1. Know your keywords. The sentence “Best hamburger joint in Bozeman Montana” is going to return similar, if not the same results as if you typed in “Best Hamburger Bozeman MT.” What is the goal? You want a Hamburger. What kind? the best. Where do you want it? Bozeman, MT. This may seem robotic, but that is an incredibly concise statement for a search engine. If you are typing it into a mobile phone on the fly, you might save yourself a few extra steps by knowing googlespeak.

2. Use Voice Search. If you are distracted, on the move or have grease and ketchup-covered hands from that hamburger you just ate, speak your question instead of sliming up your screen. Google’s voice technology has neural network models that account for logical phrases, noisy backgrounds and a whole host of other features to make your handsfree search as simple as possible.

3. Quote it. Most people know that when you are searching for exact phrases you can put them in quotation marks, but what about and if you can’t remember certain words in a phrase? Replacing these unknowns with asterisks serves as a placeholder for Google, so it knows to fill it with the most appropriate word in order to best match the quote, line, tag or phrase you are looking for. This John Wayne quote is a perfect example:
Googling.

4. Definitions. Google integrated a full dictionary system into their search platform in 2011, making it easy to type in a words or phrase you need to know the definition of without having to navigate first to an online dictionary source. A fun Google easter egg: try searching the definition of “askew.”

5. Word search article titles or bodies. If you remember the gist of an article title, or a specific line in the body content, you can use “intitle:” or “inbody:” before the phrase and Google will come up with a refined list of links with your search where it is located in the title or body.

This list barely scratches the surface, in regards to searching tips. These are things we use in our day-to-day to increase efficiency in both our workload and personal lives. Hopefully you can integrate this into your routine and enhance your search for information.
Feb201615

Outpost Restaurant of West Yellowstone, MT

by Mira Brody in Announcements, Design, Development

For anyone looking to find a bite to eat after a day of hiking, camping or auto touring in West Yellowstone, Montana, Outpost Restaurant offers high-quality, homestyle cooking for breakfast, lunch and dinner. Because the internet is a key tool in drawing in potential customers, Outpost is working with us to design and build a custom website which will properly showcase their impressive menu to both those local to the area and Yellowstone National Park tourists passing through searching for food options. The site will include a menu, their hours and the fact that they are seasonal (May through October) as well as location info and social media integration including Google+, Yelp, Siri, Apple Maps and more. We will also integrate Google Translate so that it can be read by those visiting from other countries.

We are pleased to help Outpost Restaurant establish their first online presence in a region that caters to a constant flow of new visitors from around the world.
Feb201612

Goin Mobyle

by Mira Brody in Announcements, Design, Development

Goin Mobyle.
Finding the extraordinary in the often overlooked.

As Brian and Louise explore North America and the world, they keep a daily chronicle of their stories and photos of their journey and share them on their travel blog, Goin Mobyle. Organized by trip, their posts illustrate in great detail the types of flora, fauna, geography, people and much more that they experience along the way.

A trip through Spearfish Canyon, for example, warrants vibrant photography of cascading waterfalls, rugged canyon walls, bright ivy foliage and a closeup of a grasshopper accompanied by their observations. Through these journeys, Brian and Louise hope to inspire fellow travelers to set out and adventure beyond the main interstates and off the beaten path to seek out hidden gems others may pass by.

We’ve begun development on a new website for Goin Mobyle, including a fresh logo and aesthetic. When completed, their new site will establish a more interactive and build a robust audience for their travel blog in order to attract sponsors and advertisers to join in on their endeavors. The site will also serve as a source of ecommerce for Brian’s photography prints among other pieces of fine art.
Feb201610

Route 93 Pizza Mill: A New Eatery in Eureka, MT

by Mira Brody in Announcements, Design, Development

Route 93 Pizza Mill is a new eatery opening in Eureka, Montana looking to serve a wide variety of clientele and promote their business with a brand new website. Eureka is a small town in the northwest region of the state and Route 93 is a main artery for tourist traffic to and from the Canadian border. The new pizza restaurant will look to serve a wide menu including pizzas, pastas entrees, burgers, salads, deserts as well as wine and beer. They especially want to provide a late-night option for locals looking for a family-friendly place to watch sports or those simply passing through town for a bite to eat.

Our teams’s primary focus for this web development project will be to give Route 93 Pizza an advantage over their competitors by establishing a distinctive online space for their new business. It will feature location and contact information as well as access to their menu and thoroughly represent the expected atmosphere and service to attract the full range of their target market.

We are excited to play a pivotal role in establishing an online authority for their region as well as drool over their menu and daydream of pizza as we work on this new website.
Feb20168

When to Post on Social Media

by Mira Brody in Social Media, Tools & Tips

Best Social Media Times.
Another Super Bowl has come and gone, and whether you watched for the game, the commercials, Halftime Show or the Puppy Bowl, you are a consumer of primetime marketing for businesses all over the country. Just as these corporations scramble to buy a commercial slot during the Super Bowl, you too should be scrambling to market your business on social media when the most people will be watching.

Social media is an effective tool for your business to not only drive more traffic to your website, but also a place to build customer relations and represent your brand. Because platforms like Facebook and Instagram are casual mediums, users more more receptive to personalized, conversational posts, even if they are motivated by business.

We’ve done some research to determine your primetime for posting on some of the most popular social media platforms.

Facebook
  • Weekdays vs. Weekends — While visitors to Facebook spike on Thursday and Friday, engagement is at its peak (a 17% increase) on weekends.
  • Timing — Call it an after lunch productivity lull, but post shares are highest at 1:00PM while clicks are highest at 3:00PM.
Instagram
  • Images are consumable — Instagram delivers engagement to brands in the form of clicks, likes, comments and shares 58 times more per follower than Facebook and 120 times more than Twitter.
  • Case of the Mondays — People seem to be on Instagram mostly on Mondays from 3-4:00PM.
LinkedIn
  • Workplace referrals — LinkedIn is responsible for 64% of all social referrals to cooperate websites.
  • Timing — The most LinkedIn engagement is on weekdays, namely Tuesdays, between 10-11:00AM.
Pinterest
  • Pinning is winning — Although 71% of Pinterest users are female, most of these gals (29%) are using the site once a week, while 17% visit every single day, presenting a huge window for those using it as a platform to market products.
  • Late-night Pinning — The most engagement is observed on Saturday between 2 and 4:00PM and again from 8:00PM to 1:00AM.
Don’t miss out on your primetime audience! Think of theatre — your performance can be incredible, but if you start an hour after your audience has already left, no one will be there to enjoy it.
Feb20165

Boosting Brands By Using Buyer Personas

by Mira Brody in Tools & Tips

Using personas.

Who are my customers?
What challenges are they facing?
What tasks do they want to complete on my website?
Why are they leaving my site?
What can I do to convert them into regular buyers?

These are common questions that business owners ask; after all, who doesn’t want to know how to draw in more customers? All of them, and many more, can be answered through the implementation of company-specific buyer personas.

Personas are fictional characters created to represent the various demographics that might use a site, brand, or product. They are a common tool in marketing to attract the right customers, locate potential gaps in your strategy; places where you may lose buyers, because running a business isn’t only about solving your own issues, but those of your customers as well.

When I build personas for JTech’s clients, I carefully consider the goals, desires and limitations of the people they are looking to serve. The team as a whole then applies these personas to the copy, design, development and testing of the site. We’ve found that by testing the site as a user with specific needs and concerns as opposed to dummy data, we reveal areas of refinement to improve the user experience.

Aside from foundational details such as name, gender, age, job title and family details, here are some more specific qualities I consider when creating these characters for a new site:
  • Primary goals for visiting
  • How can we make sure these goals are met?
  • What can we do to ensure they are a repeat customer?
  • What are their personal values?
  • What are their objections and how can we navigate them?
  • How else can we create a positive user experience for this persona?

Building personas for your brand is a great way to add a human element to your services; we are developing sites for humans, after all.
Feb20162

Night Shift: preventing eye strain and sleepless nights

by Mira Brody in Industry News, Tools & Tips

Night Shift for iOS.
Most of us are familiar with the jolt of turning your phone on in the middle of the night. That piercing ray of light, destroying your pupils and any chance of quickly falling back to sleep. There are even studies that show that most lighting with an abundance of blue tones (like the one emitting from your screen) can inhibit the production of melatonin and increase alerting effects; bad news for those with high anxiety, sensitive eyes or who already have trouble falling asleep.

Night Shift, a technology being integrated into iOS’s forthcoming software update, will allow you to control the temperature settings on your mobile device. Essentially, the color temperature of your phone, tablet or computer screen automatically adjusts to match the position of the sun in your location. In the daytime, your screen will be its bright, normal self as it competes with the sun. As the day progresses and the sun begins to set, blue tones will be replaced with those of redder hues to match the natural, fading light, similar to candlelight, fireplaces or that “mood” lighting intimate restaurants often employ. By eliminating the blue hues, the light your screen emits is more natural, easing some of those sleepless nights.

If you’re an early adopter, Night Shift is available in public beta and will be released officially in the iOS 9.3 update — your eyes will thank you.