Showing posts with label responsive web design. Show all posts
Showing posts with label responsive web design. Show all posts

Wednesday, August 20, 2014

10 Tips for Designing a Web Page That Looks Great and Ranks High

English: Google Logo officially released on Ma...
Here are some of the best SEO techniques for Web design that will maximize the impact of your website.

1. SEO-Friendly URL

You need to make sure that the URL of your site is SEO-friendly. Only use keywords that are relevant to your business and relate to it in some way. Avoid using long URLs, and if possible separate terms using hyphens. The URL should give people an idea about your business.

2. Optimized Images

To get a better rank in the search results, optimize your images along with the text on your website. Avoid using large images on your website. Keep the image size from 30 to 100 KB with a resolution of 72 dpi.
Large images make your site load slower. When you are creating an alt image text, make sure that you use keywords in graphics, header images, logo images, and buttons on each page.

3. Responsive Web Design

Designing for multiple devices, aka responsive design, is what Google recommends. This type of design allows your website to perform optimally on multiple devices. From an SEO perspective, a responsive website has a single URL for both the mobile and the main site, which means that you will have to drive links to a single URL instead of two. This is an easy way to increase your external backlink count.

4. Quick Navigation

When you design your website, make sure the navigation is not difficult. Let users experience an easier navigation when they land on your website so that they can easily find what they are looking for. Place the navigation bar either at the top or along the left margin of the page.

5. Be Careful With JavaScripts

When you are designing your website, make sure that you do not use JavaScripts for your entire site design. Search engines crawl through websites to index them, thus excessive use of JavaScripts will cause crawling issues.
Another disadvantage is that JavaScripts do not work smoothly on mobile devices. You need to make sure the website is simple and easy to read for both users and search engines.

6. Fast Page Load Time

Page load time is an important aspect from a website visitor's perspective. Consumers are busy and do not like waiting for a page to load. Mobile users on an average only wait for five seconds for the page to load, whereas desktop users wait only for three seconds for the page to load.
To reduce the page load time, make sure you are minimizing Javascripts, enabling compression, using small images, and browser caching.

7. Creating Sitemaps

Sitemaps have always been a part of best Web design practices. But, since the time when search engines first adopted sitemaps, they have become even more important. A sitemap, along with offering easy navigation and better search engine visibility benefits, informs the crawlers immediately about any change on your website so that the page is indexed faster. From an SEO point of view, we suggest you to do away with a conventional sitemap and create an XML sitemap.
Read this Google Webmaster Help article on how to manage your sitemap.

8. Relevant Keywords

Definitely, using the right keywords is important, but do not overuse them. This will make your page spammy. You can use the Google Keyword Planner to find out what your customers are looking for.

9. Anatomy of Page - The Visual Hierarchy

To fully capitalize on the assets discussed above, it is important for you to understand the page structure. The correct positioning of text, images, and call to actions on the page is important not just from an SEO perspective but for user engagement level as well. A large number of people visiting your website and staying on it just because it is neat and interactive will definitely going to get you into Google's good book.
A good visual hierarchy will help you in separating out important elements from the less important ones.
Here are our recommendations:
  • Have a clear head identifying your company's name
  • Use the top quarter to communicate your key products/services/features
  • An image slider helps in making the page more lively
  • Place the navigation bar at a place where users can easily locate

10. Social Media Integration

We all know the power of social media networks and how high they rank in search engine results. While designing your website, you can add social media buttons for your accounts on Pinterest, Facebook, Twitter, etc.

Tuesday, July 1, 2014

Mobile Trends and Search Optimization: Why Aren’t We Catching Up?

As mobile search continues to grow at a rapid pace, we cannot miss the opportunity to become better mobile search practitioners.
When I think of the current state of mobile search practices, my mind flashes to dog racing. I'm not particularly a fan, but the image of those dogs chasing a mechanical rabbit reminds me of the current state of mobile search. Right now, the mobile consumer is the rabbit and marketers and technologists are the dogs - everyone's moving quickly and trying to keep up the pace.
Mobile purchases are expected to outpace desktop purchases in the near future. Juniper Research estimated that annual retail payments on mobile handsets and tablets should reach $707 billion by 2018. Yet, according to Uberflip, only 25 percent of brands have a mobile strategy. If mobile marketing is the coming supernova it's expected to be, why aren't more enterprises first-movers in the mobile space?

Mobile Consumer Behavior

Fifty-five percent of all time spent with online retail in June 2013 occurred on a mobile device. Add to that comScore's assertion that just more than 50 percent of time spent engaging with websites is being done on a mobile device, and you can see that paid, organic, and site optimization for mobile are paramount to global search success.
With thanks to mobiThinking.com, here are some additional data points regarding mobile behavior, specifically mobile search behavior:
  • 25 percent of overall search queries are now on mobile devices. - BIA/Kelsey (April 2014).
  • In the U.S., mobile accounted for 34.2 percent of all paid search clicks in December 2013. It is expected to be 42 percent by December 2014 and 50 percent by December 2015. - Marin Software (March 2014)
  • 58.7 percent of smartphone users access search; 73.9 percent of tablet users access search. -ComScore Mobile Future in Focus (March 2013).
  • During the 2014 Winter Olympic Games, 60 to 65 percent of Olympics-related searches were performed on a smartphone or tablet. - Google (April 2014).
  • The number of calls to businesses driven by mobile search is growing at 42 percent per annum and is predicted to fuel a staggering 65 billion calls in 2016. - BIA/Kelsey (April 2014).
To further push the notion that mobile search needs our full attention, Yahoo and Kenshoo partnered to survey 350 global marketers about their mobile marketing practices earlier this year. They revealed a stark reminder that multiscreen behavior is being driven by a negative impression of the mobile experience.
This is the first reason there aren't more first-movers. Marketers have been lagging when it comes to taking ownership over their mobile presence. As the BIA/Kelsey report showed, more than half of all mobile shoppers are low-funnel, high-intent buyers while searching. But if they arrive on a search result, landing page, or site not optimized for mobile use - click, they're gone. Solutions such as responsive Web design should make it easy to deploy mobile. So, where are we failing our mobile search audience? Part of the disconnect lies with search optimization practices.

Mobile Optimization: Thoughts to Consider

While many brands recognize the need for mobile optimization, adoption drop-off remains high because of a lack of cohesive, device-driven, activity-based strategies. Here are some of the more prominent issues facing mobile optimization neophytes.
  1. Consumers still buy locally. U.S. e-commerce still represents less than 10 percent of all retail spending, with the balance usually completed within 10 to 15 miles from home. What's changed is that mobile and Web searches are being used to find brick-and-mortar goods and services that will be purchased in-store. So, while online conversions are great, the reality is that we must optimize for offline conversions as much if not more heavily right now. How do we generate a call to the store? Can we drive a visit through our mobile presence? Effective optimization recognizes the pathways that connect search behavior to in-store activity. 
  2. Paid campaigns and site optimization deserve focus. Organic listings are being pushed further down the screen, below the fold, and Google has indicated that click-through rate (CTR) drops substantially after position four. While organic optimization is still relevant, a focus on paid campaigns and site structure is probably going to result in better return on investment (ROI).
  3. Authoring boosts results. Structured authoring for mobile, as it is for desktop applications, enables quick viewing and rapid response. What is the task at hand, what is the concept being delivered, what is the reference? The general objectives remain the same for both formats. However, the intent of the mobile user is very different from the "lean back" desktop user. Therefore, search optimization is dependent on authoring that renders a result that encompasses low-funnel criteria mobile users invoke such as price, dimensions, inventory, etc. 
  4. Tagging for mobile activities. Tags targeting the nature of high-intent consumers will be more effective in mobile than for desktop. What do they want while searching for solutions? Quick, hard facts that can lead to a purchase or further activity within 60 minutes. Local calls-to-action, though a seemingly obvious tactic, aren't being considered when marketers create mobile campaigns. There still remains a lot of desktop mentality during migration to mobile search marketing when it comes to tagging landing and site pages. 
  5. Click- to- call features for all mobile sites. The rise of click-to-call appeal to mobile consumers has been met with a stunning lack of deployment by many brands. Search is inexorably linked with inbound calls on a local level. For many services (IT, financial services, home improvement, especially) and complex goods verticals, qualifying calls to local merchants are required to make a sale. Therefore, it makes sense to leverage mobile search (site, paid and organic) with click-to-call functionality.
The second reason there aren't more first-movers into the mobile marketing space is the Hummingbird-spawned move to semantic search.

How Semantic Search Influences Mobile Optimization

The evolution of semantic search poses the same challenges for mobile as it does for desktop. But mobile searchers are typically more oriented to navigational searches than research searches. In other words, they are using search to retrieve actionable information, such as a store location or product price, rather than attempting to explore any resource for information about an unknown. Therefore, the contextual attributes that exist for mobile semantic search are more likely to be structured around factors like geo-location and prior browsing activity.

Readability

Remember, we want to develop content that meets the two readability standards: those of the user and spider. The user is looking for action, while the spider is looking for relevance. Just as with desktop, Hummingbird has moved mobile optimization to a contextual approach. So metadata, page content, site structure, etc. that are built around conversational queries will tend to have better visibility and higher engagement.
For example, site pages filled with action-driving copy like "protect your skin" and "limit sun exposure" on clickable content within a skin care mobile site provides context for search engines and engagement for visitors.
Semantic search will drive localized SERPs. This, in turn, drives the need for sharper location-based optimization, which serves a more personalized experience that meets the local consumer on their terms, using their devices to shop locally.

Page Design Impact

On-page elements enable the user experience. Effective element attribution can lower the historically high abandonment rates by mobile users. Rendering instructions deploy page design elements, such as font size and color, background, white space, and other on-page characteristics. Mobile users seek a formatted page that fully displays on the horizontal axis and has robust functionality. Page rendering should quickly adapt to mobile access. Load speed is incredibly important, so is element positioning. Clean design attributes like simple navigation, concise copy, and lean imagery help drive mobile engagement. "Heavy" content such as video feeds must quickly orient, load, and stream seamlessly.
Mobile searchers look for different content cues on devices. Buttons, sliders, and image links move traffic on a smartphone. (Beware, the same doesn't hold true for feature phones.) HTML5-designed mobile sites rely heavily on CSS3 to deliver unique page views across smartphones, feature phones, tablets, and phablets. But you don't have to be immersed in code to optimize for mobile deployment. Best-in-breed tools like Adobe's Muse CC makes it easy for Web design neophytes to create a mobile site without code.
When it comes to page design, you should consider that searchers may use multiple devices for one purpose. For example, a person searching for a new vehicle on his smartphone during a lunch break may wish to return to a page on the home desktop after work. Chrome's multi-device features make this easy. Responsive design (or dedicated mobile sites) allows you to deliver the appropriate page layout for each device. Optimizing for multi-device search flow enables a better user experience with your brand.

Social

Google has shown us that social activity, while not an official ranking factor yet, is a signal that must be accounted for in the mobile space. Semantic search optimization is important in your social campaigns as well. Social activity that is optimized for mobile viewing gets more engagement, leading to higher visibility through indexing relevancy. (Hint: video, apps, images, and links that connect followers to other mobile-centric content is typically more effective when it comes to mobile ranking.)
Within the desktop environment, search has long been the primary conduit providing a path for our brands to reach consumers. The time where we must put emphasis on our mobile search marketing practices is here. The mobile generation has sprouted quickly and is demanding. We've got to adapt to the change that this movement has thrust upon us.

(via)

Sunday, June 22, 2014

How Responsive Design Increases the Results of Your Online Marketing

We all hear about responsive design. But as a marketer, sometimes we are only focused on the specific tasks, such as creating content, developing email campaigns, building links, and updating social media networks. The fact of the matter is, if you or your clients do not have a responsive design in place, then all of the online marketing strategies we implement will not bring the full potential of results.
This post will cover the points you need to make to your boss or your clients when it comes to adding responsive design into the marketing mix.

A Quick Rundown of Mobile Statistics

So how does mobile play into content, email, search, and social media marketing? Here are just a few of the stats.
  • 60 percent of Internet access is made on a mobile device. 
  • 51 percent of emails are now opened on mobile devices. 
  • The majority of mobile consumers use search in the shopping process. Forty-eight percent start on search engines. 
  • 70 percent of mobile searches lead to action on websites within one hour. That's assuming that the website is mobile-friendly, otherwise 40 percent will choose another result. 
  • 60 percent of social media time is spent on smartphones and tablets as opposed to desktop browsers. 
What do these statistics mean? They mean that every aspect of our online marketing efforts – content, email, search, and social – is affected by mobile. People are reading content, opening emails, performing searches, and engaging with brands on social media – all on their mobile devices.
If statistics do not convince you that getting mobile-friendly with responsive design is important, then hop into your Google Analytics and go to the Mobile Overview in the Audience portion. Chances are, if you do a traffic comparison between this year and last, you'll notice that your mobile users have grown, potentially significantly.
Change in Mobile Visitors
Even if it's only a small portion of your traffic, that's still a large number of users that could be converting IF you have a mobile-friendly website.

How Responsive Design Helps

Responsive design allows users on any device – desktop, smartphone, or tablet – to have the same experience. Some businesses choose to go with a mobile-only and desktop-only experience, but the trouble with this is the lack of consistency between the two.
People who make a purchase on the desktop site will have a completely different purchasing experience on their mobile. And the most troublesome issue is generally how a mobile-only design will not include every page that a visitor will want to see.
Hence, responsive design will help support your online marketing efforts in the following ways:
  • Content Marketing: When people are browsing their Feedly subscriptions and post from your blog comes up, they will be able to not only read it on their mobile device if you have a responsive blog design, but they will even be able to use your social sharing buttons.
  • Email Marketing: When people open an email with a responsive template, they will be able to read it no matter what device they use. Most importantly, when they click on a link from that email, if the website design is also responsive, they will have no issues browsing the website.
  • Search Marketing: When people click on a link to your website from search results, if you have a responsive website design, they will be able to get to that page and be able to consume the information they need. If the page in search isn't included in your mobile-only design, they might get redirected to a homepage and never make it to the page they want.
  • Social Media Marketing:When people click on a promoted offer from your Facebook page on their mobile device, they'll be able to purchase the promoted item just like they would on their desktop browser.
This means that you won't lose any visitors coming to a website as a result of any of the above online marketing strategies just because they are on a mobile device. This is especially important for any paid advertising you may be doing that appears to a mobile user.

Where and How to Get Responsive

So how can you make sure your online presence is as responsive as possible? Here's what you need to do.

Responsive Websites

First and foremost, you need a responsive website design. If your website, shopping cart, and blog are all built on a responsive design, then visitors to your website will be able to learn about your products and services, buy your products, and consume your content on any device without issues. The consistent experience will also make it more likely that users who discover your business on their desktop can easily make conversions on their mobile device at a later time.
Obtaining a responsive design for your website doesn't require you to be a website designer or to pay a lot to hire one. You've got several options to choose from.
Responsive WordPress Template
  • If you use a content management system like WordPress, you can choose a responsive theme design. Premium theme makers and marketplaces like StudioPress, ThemeForest offer plenty of responsive designs to choose from.
  • You can also find responsive templates on services that make designing your own website as simple as drag-and-drop, such as IM-Creator, Wix, and Weebly.
No matter what path you choose, make sure it is a responsive one. Test demo themes and templates on your own mobile device to confirm their ease of use and flow. Also be sure that the theme or template can support additional features, such as shopping carts, on-site search, comparison tools, account logins, and other specific functions your visitors will expect.

(via)

Friday, April 20, 2012

SEO Benefits of Responsive Web Design

Site owners have many competing needs when developing mobile sites. Different devices, different capabilities, different screen sizes and resolutions, all have an impact on designing and developing mobile sites today.


According to Mongoose Metrics, a tracking and analysis firm, only 9 percent of sites are ready for mobile in 2012. The primary consideration with mobile tends to be enabling better usability and — for ecommece sites — conversion. Another study by Compuware, a software and services provider, shows that 57 percent of users will not recommend a company with a bad mobile site and 40 percent of users will visit a competitor's site rather than using a poorly optimized mobile site. The case for usability and conversion as primary concerns in the drive to take ecommerce sites mobile is easy to make. Fortunately, responsive web design — the leading solution to the mobile usability challenge — is also beneficial to search engine optimization.






What Is Responsive Web Design?

Responsive web design is a concept that blends CSS, CSS3 and JavaScript to create fluid site designs that can expand, contract, rearrange or remove content based upon the user's screen size. Instead of developing different sites for devices with different screen sizes and capabilities, one site with one set of pages reacts flexibly to display optimally on everything from a 27-inch desktop monitor to a three and a half-inch iPhone display. The usability benefits are obvious: Customers can interact with a site regardless of the device they're using instead of having to choose between viewing the whole page illegibly or one small part of it that's disorienting. Where usability improves, decrease bounce rates and increased conversions are usually not far behind.
True, there are cases where the function and content of the mobile site needs to be different than the desktop site. Responsive design can handle those instances also via CSS by removing or reducing the visibility of content that's less relevant to mobile users. In some cases only a mobile app will really meet the needs of mobile users. But this article is about neither mobile apps nor the technical details of implementing responsive web design. For an excellent technical overview and references to other resources, see Smashing Magazine's "Responsive Web Design: What It Is and How to Use It."

Responsive Web Design Benefits SEO

Fortunately, search engine optimization offers another great reason to consider responsive web design: links. The alternative to developing a single responsive site that meets all device needs is to develop multiple sites to meet individual device needs. One site for desktop browsers, one for smartphone browsers, one for tablets, and each has to be maintained separately after the expense of designing and developing them separately. From a search engine perspective, each needs links and/or user agent-specific redirects to get customers to the right version of the site. One site means one set of links to build, and no annoying redirects to add to server load, site speed and maintenance hassles.
Think of it this way, Groupon has developed Touch.groupon.com for smartphones, Ipad.groupon.com for the iPad, and www.groupon.com for desktop computers. The search engines don't have much interest in figuring out which sites should receive searches on which devices, though they easily could with their ability to crawl sites as different browser types. The point is that the onus is on the site to redirect the customers to the site that meet their device's needs. For more on this, see "How to Benefit from Googlebot Mobile's New Smarts," my recent article on that topic.
Most ecommerce sites I've visited do a terrible job of redirecting customers to a mobile version of a site — if they even have a mobile site in the first place. Even my poster child for mobile success, Amazon.com, uses different sites for different devices and redirects, instead of responsive design. In their case, however, it's hard to argue for a change when they're running on all cylinders with their current solution.

Do Links Matter for Mobile Sites?

So back to links. If a site has to physically redirect mobile users from its desktop site to its mobile site, and if smartphone and tablet sites rarely if ever rank in the search results, what do links matter for mobile sites? Excellent question. It's not about getting more links to the mobile version so it can rank. It's the fact that some mobile users may create links to or share pages from the mobile site, which essentially steals link equity from the desktop site.
Say a mobile version of a product page has links to it from two blogs, two Tweets, two Facebook Likes and two Google +1s. But the desktop version of that same page has links to it from 20 blogs, 20 Tweets, 20 Facebook Likes and 20 Google +1s. The mobile version of that page is almost certainly not going to rank, and it's stealing those links and shares from the stronger desktop version of the site. If the site had been built using responsive design, the single product page would have 22 of each type of link and share instead of 20 and two to separate pages. In summary, the benefit is consolidation is link equity to a single page, enabling that single page to send stronger signals and rank better than the two separate pages could have alone.

Example of Responsive Web Design in Ecommerce

The best example of responsive web design I could find was Nike's Store. From the home page down into the product pages, the URLs were the same for the mobile and desktop versions, but the display changed to suit the device. See the image below of Nike's 6.0 Dunk Low Women's Shoeacross a laptop PC display, an Android tablet screen and an Android smartphone screen. The URL is exactly the same for each of these images, despite the difference in design and layout. That's what makes it responsive web design and not merely a mobile web site.

Nike's responsive site design adjusts page design and layout to best display on various screen sizes.
Nike's responsive site design adjusts page design and layout to best display on various screen sizes.




For large screens, Nike renders their full-featured website.
For large screens, Nike renders their full-featured website.




For smaller screens, Nike has a cleaner, simpler web interface.
For smaller screens, Nike has a cleaner, simpler web interface.




For mobile browsers, Nike shows only the basic options needed for a purchase.
For mobile browsers, Nike shows only the basic options needed for a purchase.


Interestingly, Sony.com was the only other site I could find that practiced responsive design, but it has so far only implemented it on the home page. As soon as you click off the home page, the formatting reverts to desktop display. It's interesting that a company that makes mobile devices doesn't itself have a more mobile-friendly site.
Other sites like Walgreen’s, Shoes.com, Coldwater Creek, and others have mobile versions, but the URLs for the mobile pages are different than the URLs for the desktop pages. These sites, while mobile, are not examples of responsive web design. They are still splitting their link equity between different pages of the same content, missing the opportunity to send a stronger signal by consolidating their links to a single page with responsive web design.