Mobile websites and mobile commerce have grown rapidly in the last few years.\u00a0 With such rapid growth and the changes in technology that occurred as developers rushed to keep up, some of the buzzwords and definitions have gotten a little fuzzy.\u00a0 Even seasoned web developers who specialize in mobile development sometimes disagree when it comes to what it means when we say, “responsive.”<\/p>\n
We’d like to help retailers using ProductCart, and specifically those considering upgrading to or purchasing version 5 which features two very powerful mobile commerce solutions, better understand what our team means when we use some of the most common terms.<\/p>\n
Here are the buzzwords you might have heard:<\/i><\/strong><\/p>\n If you are a merchant using or considering ProductCart, you should know that both mobile solutions in version 5 (the bootstrap themes and the Basic theme with mobile turned on) are responsive mobile<\/b>.<\/p>\n <\/p><\/blockquote>\n <\/p>\n ProductCart 5 offers two distinct responsive mobile ecommerce solutions for merchants offering maximum flexibility and options.<\/p>\n Adaptive Web Delivery<\/strong> If you are starting from scratch<\/em>,<\/span> you choose the Basic theme in the Settings section of the Control Panel, then turn of Mobile to deliver a super-fast, optimized mobile commerce experience to your customers.<\/p>\n Responsive Web Design<\/strong> If you’re brand new to ProductCart or would like to start a redesign<\/em>,<\/span> we recommend that you choose one of our Bootstrap themes the Control Panel.\u00a0 You use the designs as-is, or customize them by updating the CSS and building a new custom theme of your own.<\/p>\n <\/p>\n Mobile Website<\/b> \u2013 This is the most generic of terms.\u00a0 It refers to any website that is designed or developed for display on smaller handheld devices or phones.\u00a0 This can be a website meant only for mobile devices or a website that accommodates smaller devices through some form of responsive display.<\/p>\n Mobile Specific Website <\/b>\u2013 This kind of mobile site is specifically formatted only for smaller devices like smart phones.\u00a0 They are designed to load quickly and deliver only the information and tools that the developer and client feel are most important for a mobile visitor, meaning that most of the time a mobile specific site only has part of the standard website\u2019s content.\u00a0 A mobile specific site detects when someone is accessing the standard website via a mobile device and then will reroute them to the mobile site, typically hosted at m.website.com or website.com\/mobile.\u00a0 The important thing to note here is that a completely separate set of files and URL are at work here.<\/p>\n Previous versions of ProductCart had a Mobile Add-on<\/strong> that functioned in this way; however Google no longer recommends this method of mobile website delivery<\/span>.<\/i><\/p>\n Responsive Web Design (RWD) \u2013<\/b> This is a very specific definition, created by Ethan Marcotte at the beginning of the mobile development movement, to defined the use of 3 techniques: using fluid layouts, flexible images (and media objects), and media queries. This phrase is often swapped with \u201cresponsive\u201d as a very strict definition, however responsiveness and responsive websites have come to encompass more techniques than these three as mobile development has evolved.<\/p>\n Responsive Website \/ Mobile Responsive<\/b> \u2013 These broad terms are interchangeable and refer to the many different website strategies for delivering a mobile optimized experience to website visitors by adapting the layout, content, and functionality of a page depending on their device and screen resolution (or a combination of the two).<\/p>\n Fluid Layout <\/b>\u2013 One of the building blocks of responsive design, fluid layouts use proportions to define elements on the page, for instance a width of 60% instead of a fixed width of 500 pixels.\u00a0 When combined with grid systems, media queries, HTML5 and CSS3, these fluid layouts not only shrink and expand proportionally depending upon the resolution of the visitor\u2019s screen and browser window, but it will also adjust the layout of columns and block-level elements for optimal display and usability based on screen resolution. For instance, the menu might collapse into a stacked two column list when the screen resolution is between 640 pixels wide and 960 pixels wide.<\/p>\n RESS (responsive web design with server side components) <\/b>\u2013 The traditional understanding of Responsive Web Design relies exclusively on client-side rendering or hiding of elements.\u00a0 RESS uses server-side components in addition to RWD techniques to produce faster load speeds and performance and improved functionality on mobile devices.\u00a0 RESS can include server-side dynamic CSS, like Sass, as well as device detecting software for functional enhancements.\u00a0 The important improvement over traditional responsive here is the reduction of \u201cpayload.\u201d Instead of simply hiding elements on the client side and shrinking down full resolution images and elements, we deliver exactly what is needed for that device and resolution, swapping out scripts, images, and plug-ins as necessary for specific devices.<\/p>\n Adaptive Web Delivery (AWD) <\/b>\u2013 This technique takes RESS to the next level, by detecting the requesting device and then delivering entirely different batches of HTML and CSS code.<\/p>\n <\/p>\n <\/p>\n","protected":false},"excerpt":{"rendered":" Mobile websites and mobile commerce have grown rapidly in the last few years.\u00a0 With such rapid growth and the changes in technology that occurred as developers rushed to keep up, some of the buzzwords and definitions have gotten a little fuzzy.\u00a0 Even seasoned web developers who specialize in mobile development sometimes disagree when it comes […]<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[6,13],"tags":[33,34,35,36],"class_list":["post-755","post","type-post","status-publish","format-standard","hentry","category-about-productcart","category-mobile","tag-bootstrap","tag-mobile-commerce","tag-mobile-themes","tag-responsive-mobile"],"_links":{"self":[{"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/posts\/755","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/comments?post=755"}],"version-history":[{"count":0,"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/posts\/755\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/media?parent=755"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/categories?post=755"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.productcart.com\/index.php\/wp-json\/wp\/v2\/tags?post=755"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}\n
<\/h2>\n
\n
Executive Summary:<\/h2>\n
How ProductCart’s Mobile Ecommerce Works:<\/h2>\n
\nIf you already have a website design and simply want to upgrade<\/em>,<\/span> you can turn on Mobile in your Control Panel and suddenly transform your website into a responsive mobile site that delivers an optimized web browsing experience to mobile phone users.\u00a0 All without having to complete a single line of recoding your existing design!<\/p>\n
\nIf you have created your own website design using HTML5 and fluid responsive layouts<\/em>,<\/span> once you upgrade to ProductCart5 you can deliver an elegant, fluid responsive experience to your mobile online shoppers.<\/p>\nDEFINITIONS:<\/b><\/h2>\n
Want to learn more about our Mobile Themes and customizing your own?\u00a0 Check out our Support Center articles:<\/h3>\n
\n