Last week, Google announced the launch of mobile-first search indexing for a “handful” of websites. Although Google’s search engine won’t be giving priority to responsive sites until later in 2018, it’s time to prepare. Bookmark this page and subscribe for all new developments as Mobile-First SEO goes mainstream. For now, let’s dive into everything you need to know to get ready.
>>Skip to Recent Updates
It’s been said countless times, but mobile traffic matters. Every time mobile customers struggle to navigate your site, you’re losing money and market share. As recent studies estimate, over 55% of web traffic comes from mobile devices. Google affirms these numbers, saying “most people” are now searching from mobile.
Get Responsive, Fast
If your site isn’t responsive yet, it’s time to hop on the train. If the $2 billion racked up from mobile in Black Friday sales was any indication (especially considering the total for Black Friday online sales was $5B), your company better have a responsive site in development. The best way to ensure your SEO stays intact when the changeover occurs is to have your site completely mobile-ready in every way possible.
Mobile-First Ranking Difference
As Search Engine Land reports, “With desktop sites, Google said that content hidden in tabs, accordions, expandable boxes and other methods would not be weighted as high. But when it comes to mobile, Google’s Gary Illyes said content like this will be given full weight if done for user experience purposes. The idea is that expandable content makes sense on mobile and not so much on desktop.” While the leadership at Google expect mobile-first ranking to only have ‘minimal’ impact on changing current search results, sites who haven’t adapted properly may fall far from the first page.
As Tech Crunch reports, Google has publicly announced that, “Pages that already take advantage of responsive web design and implement dynamic serving don’t usually have to do anything to be ready.” However, while some sites have a mobile version, mobile sites occasionally hide content that’s found on the desktop version (think long product descriptions). If this is the case for your site, you’ll need to do some restructuring for a seamless transition. Your site doesn’t need to be completely identical across platforms, “but it should contain all the information users need to know about your business,” according to SEMrush. Providing as much content as possible, while keeping it fast and responsive seems to be the ultimate happy-medium.
How to Prep
So far, we already know that Accelerated Mobile Pages (AMP) will give your site an edge for ranking higher in mobile SERPs. Experts agree that while making big changes to SEO optimized mobile pages may be a daunting task (especially for ecommerce sites), they suggest implementing AMP to prep your Mobile-First SEO.
What We Don’t Know
How will Google index your “hamburger” navigation when it crawls your site? Will H1 and H2 tags be indexed the same on mobile and desktop so site UX can stay in-tact? Do certain photo-resizing methods give sites an upper-hand? How do mobile ads play into the new search rankings?
Flipping The Switch
It’s still unclear how exactly Google will initiate the switch-over. At the SMX West conference last spring, Google’s Garry Illyes said the new index will not come until search results are “quality neutral.” In a Google Hangout, Webmaster Trends Analyst John Mueller recently said Google might choose to switch-over batch-by-batch while others speculate there may be a day when Google decides to flip the switch for everyone. For now, however, it seems Google’s goal is to keep search results the as close as possible to how they appear today.
Jan. 19, 2018 — PracticalEcommerce confirms Google’s plans to make the speed of mobile webpages a ranking factor. Since “Shoppers Expect Speed,” this will be especially important for Ecommerce sites. The “Speed Update” is slated for July 2018.
See some awesome stats on site speed & mobile user behavior here.
Feb. 22, 2018 — SERoundtable reported today that Google plans to phase-in the next batch of sites to the mobile first index in the next few weeks! Google’s Gary Illys made the announcement yesterday at PubCon. Again, the company said they will hold true to their promise not to move your site until you are ready… But you are getting ready, right? Let us know if you need any help getting your fully responsive store up and running!
Go Mobile Now
Redstage specializes in responsive ecommerce site development. Want to learn more about how we can help make your Magento site mobile-friendly? Shoot us a message today
and let’s make your dreams a reality. View our responsive design work here
A couple of weeks ago, we did a webinar with eBridge Connections on Responsive design and why it is so important today. We hope that you were able to take the time out of your schedule to attend. It was a very informative session and we’re proud to have been given the opportunity to share our knowledge and expertise.
With that said, we know that not everyone out there was able to attend and we want to make sure that everyone can see how important responsive design is today and take advantage of this as a way to enhance their overall customer experience and increase revenue.
eBridge Connections was kind of enough to record the entire webinar and post it on their YouTube channel. To see what you missed, or to watch it again, you can follow the link to the video here: Responsive Design Webinar
We previously posted about what responsive design is and how to get started on a responsive design for your website. If you haven’t seen that post, you can read that here: Responsive Design: What is it and what do you need to know
This post will go into some detail about why responsive design is so important, specifically for Mobile and Tablet Devices. Originally, designers and developers only had one main challenge to deal with – maintaining the same look and feel of their website across multiple desktop computer browsers. As more and more mobile smartphones and tablets are released, things have started to get a little more complicated.
So, why Responsive Design?
Cost of Ownership
You may be asking yourself: “Why not just build a Mobile site and a tablet site?” Well, you could do that, but then you’re stuck with three different sites that you need to update as your site evolves. While there might be a slightly higher cost to implement a responsive theme, you’ll find that the cost of ownership is actually significantly lower when you factor in the cost of updating and maintaining one responsive site versus multiple sites for desktop/mobile/tablet.
User Experience is Important
Content may be king, but user experience is becoming a much larger part of the picture. A good user experience enables visitors to consume content on any website through the device of their preference at any time. As such, responsive web design is necessary to provide the optimal user experience for all site visitors regardless of what kind of device they access your site with.
Available to Anyone, Any Time
These days, people are constantly moving and on the go. Responsive design lets users access and view your site easily regardless of where they are and what kind of device they have. Early morning commuters can browse from their mobile devices and tablets, and then access the site from a desktop computer or laptop when they get to work or back home.
When Google Talks, We Listen
Google has about a 67% market share on search, so when they want something you do it. Google says that responsive design is the recommended configuration for mobile devices. Additionally, google refers to responsive design as the industry best practice (https://developers.google.com/webmasters/smartphone-sites/).
The reason for this is because websites that use responsive design have one URL and the same HTML making it easier for Google to crawl and index the website.
Mobile Browsing Statistics
It’s easy to support implementing a responsive strategy from a cost, design and usability, or marketing standpoint alone, but beyond that the statistics for mobile and tablet website browsing are compelling enough. Statistics show that 91% of all people on Earth have a mobile phone and 56% of people have smartphones. Out of all mobile phone users, 50% say that they use their mobile device as their primary internet source. That’s over 3 Billion (yes, Billion with a ‘B’) people browsing the web on their mobile phones. Moreover, people are turning to the mobile web at much higher rates than they did with desktops in the 90’s and early 2000’s with adoption rates 8 times higher. A recent survey has shown that 80% of consumers plan to conduct mobile commerce during 2014 with over half of the respondents (57%) saying they would not recommend a business with a poorly designed mobile site.
The graphic below shows just how much people are using tablets to consume data on the web and the expectations for mobile payment growth over the next few years.Infographic created by www.supermonitoring.com
As the number of people with web-enabled tablets and mobile devices increases, so does your customer base. If you fail to grasp the importance of this and don’t implement your Responsive strategy right away, you’re putting yourself at a big disadvantage.
Want to talk to someone about implementing a responsive strategy for your site? Call Redstage today!
What is Responsive Design?
You’ve probably been hearing a lot of talk about Responsive Design lately. If this is something new to you, you’ve probably also asked yourself some of these questions: What exactly is Responsive Design? How does it work? And do I even need it?
Well, we’re here to clear up some of the confusion on the topic for you. Responsive design is an approach aimed at developing websites which provide an optimal viewing experience across a wide range of devices. Basically, the idea is to have one website which adjusts depending on what device (viewport) the user is viewing the site on. The goal is to have a site with a style and user experience that is consistent from a desktop web browser to a tablet to a smartphone.
As more and more web traffic moves over to mobile and tablet browsers, it’s critical to implement a strategy which makes it easy for your customers to navigate and transact on your site regardless of their preferred web-enabled device.
Mobile Growth Stats
It’s no surprise that most people in the world today have mobile phones. Statistics show that 91% of people on earth own a mobile phone and 56% of all people own a smart phone. This is a huge market that you need to take advantage of by implementing a good responsive strategy on your site. Currently, mobile traffic accounts for 15% of all internet traffic with adoption growing 8 times faster than web adoption did in the early 90’s and 2000’s. Studies show that 41% of people have used a mobile device to browse for a product after seeing it in a show or advertisement, so you definitely want to make sure that they can get to your site and find what they are looking for from a mobile device so you aren’t missing out on that potential sale!
And mobile isn’t the only market to target – 72% of tablet owners purchase online from their tablet each week! Tablets are quickly becoming ubiquitous in our society and are beginning to replace traditional desktop computers for a lot of people. 52% percent of tablet users say that they prefer to shop using their tablets as opposed to a traditional PC, with users nearly 3 times as likely to purchase from their device than smartphone users. This is what makes responsive design so important! You’d be putting yourself at a disadvantage by just implementing a mobile strategy with no specific focus on tablets.
Implementing a Responsive Strategy – Useful Tools
By now, you probably realize the importance of having a strong Responsive strategy. It’s easy to think you can just jump in and put something together. In reality, implementing a good responsive design strategy for your site takes a lot of planning and design. A lot of considerations need to be made for what the best user experience is on the different devices and how elements will adjust and snap into place in different viewports. Take your time and do your research. See what your competitors are doing and what some of the bigger companies in your industry do. Go to the drawing board and start mocking up how you want things to look. Don’t forget to get feedback from other people. You know your products better than anyone, so it’ll be easy for you to find what you’re looking for, but what about your customers? Make sure that the site is designed in a way that is user-friendly and makes it easy for customers to get around and find what they want on your site.
After you’re done designing, it’s time to build out those designs. When implementing a responsive strategy for your site, it helps to have the right tools for the job. There are a number of libraries that you can use as a starting point for your responsive theme. For a lot of our projects, we use the following frameworks to help speed up development.
As you start building your theme, you can use some of these sites to test your theme on different viewports:
Need Help With Your Responsive Site?
The Redstage Team is here for you! We’re the leading agency in Responsive Design Magento Websites. Contact us to get a free quote for your project today!
“The art of war teaches us to rely not on the likelihood of the enemy’s not coming, but on our own readiness to receive him; not on the chance of his not attacking, but rather on the fact that we have made our position unassailable.” –Sun Tzu
The battlefield of the Consumer Market has changed. Consumers are no longer accessing your website from a single type of device. Reports show that mobile based traffic will be growing to 30% of overall traffic in the very near future.
The reality is that this chart is unfairly skewed toward the PC since streaming traffic is currently less prevalent on mobile devices.
To compound the issues that online retailers are facing, new sizes and resolutions of mobile devices are released monthly. Simply optimizing for the iPhone Retina or iPad is no longer an option.
In this fast growing, diversified mobile world, how can you rise above your enemy? How do you make your position—as Sun Tzu put it—“unassailable?”
RESPONSIVE DESIGN or Responsive Web Design is the art of creating a site that adapts to different sizes, devices, and input types—automatically. It is a non-app based; non-separate mobile site web design strategy. To get slightly more technical, it is web design that uses fluid grids (modifying code that defines grid dimensions in relative terms to maintain the proportions of your web design across differently sized browsers), flexible images (browser code that that flexibly scales images), and media queries (which basically “instructs” browsers to re-render layout instantly as the viewport/device screen changes size; without the issues of device compatibility).
But why choose Responsive Design over creating apps and mobile versions of your website? We’ve got some very compelling reasons for you…
Responsive Design Consolidates Marketing Strategies.
If you opt to create a mobile version of your site (an “m.site” where your main site redirects to when accessed on a mobile device) you lose or sacrifice the quality of this analytics data that gives you insight into your customer base and target market. You also run the risk of getting flagged for duplicate content, which although avoidable takes more effort and resources to keep in check. Responsive design keeps your analytics data intact by utilizing the same site regardless of the device. The source pool of this analytics data is even broadened, thus providing you more intimate insight into your customer’s needs and preferences.
Furthermore, you get SEO benefits as all backlinks link to one website. m.sites often end up stealing valuable SEO juice and can even outrank your main site on a desktop search for certain key terms.
Responsive design also dramatically decreases bounce rate (consumers losing interest in your site due to aesthetic and/or functionality/usability issues) because the content presentation, accessibility, and whatever marketing strategy you have applied remains intact and optimized for the consumer’s experience.
Responsive Design Creates Conducive eCommerce Environment.
PCs are meant to be used with a mouse and keyboard interface. Tablets often have users interacting with multiple fingers and enjoy swiping to navigate. And smartphone users are happy if they can navigate with just their thumbs. Responsive design can handle all of these by automatically adjusting the user experience as the size hits certain trigger points, or “viewports”.
Simply put, responsive design makes buying easy and seamless. It further strengthens consumer empowerment by automatically customizing the content of your website thus allowing the customer to enjoy the best buying experience from their favorite device.
Allowing your customer to make his purchase when and how he wants to communicates that you are valuing his time and preferences. Responsive design refocuses the content and content display of your website to cater to the customer’s device of choice, making the layout of your website adaptive—automatically adjusting at viewport/screen “breakpoints.” Meaning your customer’s experience of your website is optimized across ALL devices. This beats “small screen strategy” (which runs the risk of your website content being next to inaccessible because it just shrinks the website to fit a particular screen) and “mobile app strategy” (which runs the risk of sacrificing content and functionality that a customer may need to engage your product).
Responsive design is great because it marries both strategies into a concise, cohesive, forward-thinking approach. A customer doesn’t have to tediously “pinch and zoom” your website on his mobile browser nor does he have to lose valuable minutes going to the app store, looking for your app, downloading it, installing it and only then getting to use it—that doesn’t even include the time it takes for her to navigate through your product line, make his selection, and process her purchase.
Applying responsive design to your website lets the customer browse your site optimized for his device; lets him make his purchase unimpeded and uninterrupted—as easily and quickly as he would on his desktop or laptop.
Responsive websites are an absolute must if you want your business to reach a large mobile crowd as well, no matter if they are using their smart TV, tablet, smartphone, or PC. Here at RedStage we have got the ideal training and expertise to help you get the fully responsive sites you need quick and hassle-free.
What Is A Responsive Website Anyway?
First of all, know that the term responsive design refer to building a sire and then formatting it so that it can easily adapt to all screen sizes hat might be trying to gain access to it. Regularly, HTML5 and CSS are used by designers to create these sites and establish the right parameters in order for the content to successfully resize itself vertically and also horizontally. The screen a visitor might be using could be as large as a TV screen or as small as a smartphone touchscreen – the website needs to provide all visitors with an equal feel and high degree of user experience.
How To Create A Responsive Site
A site visitor looking forward to accessing your site in order to find information or buy something online who hits the unresponsive design issue is less likely to come back anytime soon. Spending more than a couple of seconds trying to zoom in and out, locate page frames and buttons are problems that will annoy, frustrate, and eventually drive potential prospects and buyers away. So in order to avoid this you will need to start turning your sites into responsive ones. You can accomplish this by planning a simple design for it. This is one of the biggest challenges you are going to have to confront with. You will need to avoid over designing it and adding too many elements that are going to turn navigation into a difficult process. Instead, focus on finding the perfect balance between simplicity, functionality, and site responsiveness each visitor is going to much appreciate.
The main idea is to focus on creating excellent content and trying to avoid falling into the pitfalls of adding too many advertisements or images on the web site. It can be quite frustrating to try to close an annoying advertisement on your small sized smartphone touchscreen, trying to reach the news or the product details section. One or two failed attempts of tapping the close X mark will eventually drive many visitors away. You definitely do not want to do that, so you need to learn how to maintain the proper balance between text, images, videos, and ads.
Using a flexible layout in the form of flexible grids and columns which you can use to ideally organize your site content is a good idea. If you wish to work on adapting the size of your viewport you can use a relative width instead of a fixed one. If you would like some professionals to handle your responsive website, get in touch with us. In the meanwhile, relax playing your favorite casino games at casino.com. Read a full review on the online-kasino.co site and learn all about the welcome bonus and the top 24/7 customer support service.