milerwan Posted September 25, 2016 Share Posted September 25, 2016 Hi all, You could find v2.3.4 BS of my shop from this URL : http://www.infinitydream.comThe script has been updated with the old Newsdesk addon (http://addons.oscommerce.com/info/934).NB: Many changes were necessary to be able to make it work in an v2.3.x environment. I have adapted the Front Page Carousel module (http://addons.oscommerce.com/info/9444) to boxes modules to show only 1 product when in column format and several products in large format (XS and SM screen sizes).Like this the boxes are able to display several products across the width simultaneously.Finally, I modified the search bar to displays the results on the fly via a dropdown menu with product image and article content Newsdesk.To do this, I have modified the original script of Store Search (BS) (http://addons.oscommerce.com/info/9328) to show picture product and use SEO product keywords which is very effective for the relevance of research.You could find this addon here : Store Search with Image (BS) (http://addons.oscommerce.com/info/9504).Otherwise, I tried to optimize space whatever the screen size to limit the blank zones.Hope this example gives some ideas for current or future users. ;) Regards. Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
burt Posted September 26, 2016 Share Posted September 26, 2016 Every thing seems to work good. The site is not pretty. You need to do something more to move away from the stock look. For me, I dislike scrolling boxes. Maybe 1 is oK. You have five on the home page - it makes the page move too much. Link to comment Share on other sites More sharing options...
milerwan Posted September 26, 2016 Author Share Posted September 26, 2016 Every thing seems to work good. The site is not pretty. You need to do something more to move away from the stock look. For me, I dislike scrolling boxes. Maybe 1 is oK. You have five on the home page - it makes the page move too much. Thank you for your opinion. As you see, the goal is to immediately highlight the richness of the products of the store, rather than a long narrative of what the store offers. To operate this, scroll boxes work fine in my case and several reviews displayed rates from the first moments which can put visitors in confidence. Without scrolling boxe it's more difficult without loss screen space. As I have deleted the left category column, witout animation and curiosity of visitor, this one can go his way because he does not perceived the product catalog at the first page. Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
♥GLWalker Posted September 30, 2016 Share Posted September 30, 2016 I see lots of work went into your site. Good job keeping it together. You have to much going on with the scrolling though. All the scrolling items scroll at the same time and is a big distraction and will not be very welcoming to users with certain impairments/disabilities. See https://www.w3.org/TR/WCAG10/#gl-movement for accessibility guidelines. No one really cares how much space your saving by using hidden elements that scroll into focus. It looks neat, but if one is interested they will click further. Good job implementing newsdesk. That is an old monster. Follow the community build: BS3 to osCommerce Responsive from the Get Go! Check out the new construction: Admin Gone to Total BS! Link to comment Share on other sites More sharing options...
ecommunlimited Posted September 30, 2016 Share Posted September 30, 2016 That's a whole lot of scrolling going on. Because of it your scores are suffering really bad. Test your homepage URL at the links below and you'll see what I mean. I'll show you the difference. These are my averages On GTmetrix - PageSpeed Score: A, 99% - YSlow A, 98% On Pingdom - Performance Grade: 97, Load Time, 946ms On Google PageSpeed Tools: Mobile - 94/100 speed, Desktop - 96/100 speed https://gtmetrix.com/ https://tools.pingdom.com/ https://developers.google.com/speed/pagespeed/insights/ I'm not picking on you nor am I patting myself on the back. I'm just trying to show you how bad scrolling can hurt you. Bill Link to comment Share on other sites More sharing options...
Mikepo Posted September 30, 2016 Share Posted September 30, 2016 @@milerwan the following page is missing http://www.infinitydream.com/contact_us.php osC CE live - developing osC Phoenix adding modules with no core changes(awesome and easy!) Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 @@milerwan the following page is missing http://www.infinitydream.com/contact_us.php Do you mean the contact us link ? It is hidden in "Info" dropdown button (nearch search bar). Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 That's a whole lot of scrolling going on. Because of it your scores are suffering really bad. Test your homepage URL at the links below and you'll see what I mean. I'll show you the difference. These are my averages On GTmetrix - PageSpeed Score: A, 99% - YSlow A, 98% On Pingdom - Performance Grade: 97, Load Time, 946ms On Google PageSpeed Tools: Mobile - 94/100 speed, Desktop - 96/100 speed https://gtmetrix.com/ https://tools.pingdom.com/ https://developers.google.com/speed/pagespeed/insights/ I'm not picking on you nor am I patting myself on the back. I'm just trying to show you how bad scrolling can hurt you. Bill What are the consequences of a low rate ? Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 I see lots of work went into your site. Good job keeping it together. You have to much going on with the scrolling though. All the scrolling items scroll at the same time and is a big distraction and will not be very welcoming to users with certain impairments/disabilities. See https://www.w3.org/TR/WCAG10/#gl-movement for accessibility guidelines. No one really cares how much space your saving by using hidden elements that scroll into focus. It looks neat, but if one is interested they will click further. Good job implementing newsdesk. That is an old monster. Another "old monster" adapted can be see here displayed: http://www.infinitydream.com/kynar-wire-awg-30-p-54.html Quantity Price Breaks Per Product (http://addons.oscommerce.com/info/1242) NB: Original version used. Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
ecommunlimited Posted September 30, 2016 Share Posted September 30, 2016 As a general rule a webpage should take no longer than than 2 seconds. On GTmetrix alone yours is 4.9 seconds. Google can / will penalize you for that and they'll put you lower in the search ranks. So will the others. Nobody likes to wait on a slow page to load. And many people aren't willing to wait for it. Think about how many times you left a page because it's slow and you got tired of waiting on it. You personally might have a blazing fast internet connection, but not everyone does. The majority of online shopping takes place on mobile phones or other small devices through WiFi. Think about how many times in your life that you haven't had a strong cell signal. You can have the best cell phone or tablet in the world and it does you no good if you got a lousy signal or a slow internet connection. This is how rendering works at different connections. The more Mbit/s the faster the connection is. A whole lot of folks in this world don't have a 10 Mbit connection. And you can't forget that. 178.6 sec 56 kbit/s78.1 sec 128 kbit/s19.5 sec 512 kbit/s10.0 sec 1 Mbit/s5.0 sec 2 Mbit/s1.0 sec 10 Mbit/s You stated earlier: "As you see, the goal is to immediately highlight the richness of the products of the store, rather than a long narrative of what the store offers.To operate this, scroll boxes work fine in my case and several reviews displayed rates from the first moments which can put visitors in confidence." A narrative of what a store offers is called Content. Google believes Content is a must have. Google don't give a hoot about products, they care about content. It's a relevancy thing. If you have no content, you're not relevant to Google. They make the rules and if you don't follow them, they're gonna punish you for it. And that is a fact. And you're breaking 2 of the rules that are most important to them. You stated: "As you see, the goal is to immediately highlight the richness of the products of the store". Well that all fine and dandy. But if Google doesn't send perspective customers your way, they'll never see the richness of the products. That equates to low sales. I already told you, Google don't give a hoot about your products. But they do give a hoot if you break their rules. A slow website with very little content and, being a very visually distracting page is a bad recipe. So it all boils down to this. By breaking their rules they won't send customers your way and therefore, you won't make as mush money. That is your consequences. I'm not trying to give you a hard time @@milerwan, I'm trying to help you. I hope you understand that. Take care sir. Bill Link to comment Share on other sites More sharing options...
Mikepo Posted September 30, 2016 Share Posted September 30, 2016 Do you mean the contact us link ? It is hidden in "Info" dropdown button (nearch search bar). @@milerwan in contactus link on this page is broken http://www.infinitydream.com/infinitydream-has-a-new-look-n-168.html osC CE live - developing osC Phoenix adding modules with no core changes(awesome and easy!) Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 @@milerwan in contactus link on this page is broken http://www.infinitydream.com/infinitydream-has-a-new-look-n-168.html Fixed. Thank you for your vigilance. ;) Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
burt Posted September 30, 2016 Share Posted September 30, 2016 OK, but you must do more to make this site look different; 1. so that it does not look like all the other shop using the Responsive version 2. so that the owner of this look does not one day decide to stop you using it Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 As a general rule a webpage should take no longer than than 2 seconds. On GTmetrix alone yours is 4.9 seconds. Google can / will penalize you for that and they'll put you lower in the search ranks. So will the others. Nobody likes to wait on a slow page to load. And many people aren't willing to wait for it. Think about how many times you left a page because it's slow and you got tired of waiting on it. You personally might have a blazing fast internet connection, but not everyone does. The majority of online shopping takes place on mobile phones or other small devices through WiFi. Think about how many times in your life that you haven't had a strong cell signal. You can have the best cell phone or tablet in the world and it does you no good if you got a lousy signal or a slow internet connection. I have made some tests with carousel boxes and index disabled that gives from Mobile Website Speed Testing Tool : Without modification : - mobile speed : 53 - desktop speed : 64 With all corousel windows disabled : - mobile speed : 61 - desktop speed : 73 If I disabled just "Best seller scroll" box : - mobile speed : 60 - desktop speed : 71 It seems Best seller scroll box is as greedy for himself alone than the 5 carousel windows together !!! How can I optimize the "best seller scroll" display ? Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
milerwan Posted September 30, 2016 Author Share Posted September 30, 2016 If I minore the number of products displayed for all boxes the speed rate grows...I have read some advices about mod_headers and mod_expires which can be parameterized in .htacess file. Does anyone know optimized settings for an oscommerce website ? Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
ecommunlimited Posted September 30, 2016 Share Posted September 30, 2016 I'm in a massive hurry so I'm only going to mention one thing right now that can really help you. I'll tell you more later. Since your partial to scrolling and other high resource usage things, you're using a lot of JavaScript. That's one of the major thing causing your site to be slow. If you get a CDN (Content Delivery Network) it will help you immensely. It won't solve every issue but it will help a whole lot. There's one called Cloudflare. Here's a link to them. https://www.cloudflare.com/plans/. It doesn't matter what your budget is they can work with you, and it's easy to do. They got a thing called Rocket Loader (it's for speeding up JavaScript), Mobile optimization with Mirage and Image optimization with Polish. They have many other things as well that can speed up your site and protect it too. That all depends on your budget. There's other CDN's out there that are pretty good as well. The beauty of Cloudflare is, you can use it if you're a novice or a pro. Or, whether your a large or small shop. I don't have time to explain how it all works. Hopefully you can trust me on this one. They've got videos that can explain it to you. Also, you should implement everything you can from GTmetrix and Google PageSpeed. Those two and Cloudflare will be some of the best things to ever happen to your site. Bill Link to comment Share on other sites More sharing options...
ecommunlimited Posted September 30, 2016 Share Posted September 30, 2016 If your running Apache 2 these will help immensely in your root .htacces. Other forms of Apache are similar. Set the mod_expires per your need. <IfModule mod_deflate.c># Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/atom+xml AddOutputFilterByType DEFLATE application/font-woff AddOutputFilterByType DEFLATE application/font-woff2 AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/json AddOutputFilterByType DEFLATE application/ld+json AddOutputFilterByType DEFLATE application/manifest+json AddOutputFilterByType DEFLATE application/pdf AddOutputFilterByType DEFLATE application/rdf+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/schema+json AddOutputFilterByType DEFLATE application/vnd.geo+json AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/x-font/eot AddOutputFilterByType DEFLATE application/x-font/otf AddOutputFilterByType DEFLATE application/x-font/ttf AddOutputFilterByType DEFLATE application/x-font/woff AddOutputFilterByType DEFLATE application/x-httpd-php AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-web-app-manifest+json AddOutputFilterByType DEFLATE font/eot AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE font/woff AddOutputFilterByType DEFLATE image/bmp AddOutputFilterByType DEFLATE image/gif AddOutputFilterByType DEFLATE image/jpg AddOutputFilterByType DEFLATE image/jpeg AddOutputFilterByType DEFLATE image/png AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/webp AddOutputFilterByType DEFLATE image/x-ico AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE image/x-generic AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/eot AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/pdf AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/richtext AddOutputFilterByType DEFLATE text/tff AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/xsd AddOutputFilterByType DEFLATE text/xsl AddOutputFilterByType DEFLATE text/x-generic<IfModule mod_headers.c> <FilesMatch "\.(js|css|xml|eot|flv|gif|gz|htm|html|ico|jpg|jpeg|otf|png|pdf|php|swf|text|ttf|woff|woff2)$"> Header append Vary: Accept-Encoding </FilesMatch></IfModule> <IfModule mod_expires.c> <FilesMatch "\.(pdf|flv)$"> Header set Cache-Control "public, max-age=2629746" </FilesMatch> <FilesMatch "\.(bmp|cur|gif|ico|jpg|jpeg|png|svgz|swf|webp)$"> Header set Cache-Control "public, max-age=2629746" </FilesMatch> <FilesMatch "\.(css|js)$"> Header set Cache-Control "proxy-revalidate, max-age=31556926" </FilesMatch> <FilesMatch "\.(html|htm|php|txt|xml)$"> Header set Cache-Control "proxy-revalidate, max-age=600" </FilesMatch> <FilesMatch "\.(woff|woff2|ttf|eot)$"> Header set Cache-Control "public, max-age=2629746" </FilesMatch></IfModule> Bill Link to comment Share on other sites More sharing options...
ecommunlimited Posted October 1, 2016 Share Posted October 1, 2016 @@milerwan you stated: 'If I minore the number of products displayed for all boxes the speed rate grows...". Some scrolling mods have a speed rate setting. Look in the documentation for the install and operation of your addon. There may be something in there to tell you how to slow it down. In regards to your question about "How can I optimize the "best seller scroll" display?" there's several thing you can do. All of what I'm about to tell you can work for far more than just your Best Seller box.You can minify any high resource usage blocks of js, css or html code that are in there. You can minify the whole files too.You can use this javascript minifier.http://dean.edwards.name/packer/You can use this css minifier. They have far more options than just css.http://cssminifier.com/You can use this html minifier.https://kangax.github.io/html-minifier/All of these work very well.You can minify your whole site too. An absolutely beautiful server side minifier for your whole site is Chemo Compress. It works with any version of osC. It takes about 60 seconds to install. And it works wonderful.http://addons.oscommerce.com/info/8928You do not have to have any coding experience to use anything I mentioned above. The default setting work just fine for ordinary use. There's some stuff out there that other consider to be better. Although they take more knowledge to make them work in your favor, more time to learn how to operate them and more time to implement.I highly recommend Chemo CompressBill Link to comment Share on other sites More sharing options...
milerwan Posted October 1, 2016 Author Share Posted October 1, 2016 @@milerwan you stated: 'If I minore the number of products displayed for all boxes the speed rate grows...". Some scrolling mods have a speed rate setting. Look in the documentation for the install and operation of your addon. There may be something in there to tell you how to slow it down. In regards to your question about "How can I optimize the "best seller scroll" display?" there's several thing you can do. All of what I'm about to tell you can work for far more than just your Best Seller box. I mean data speed rate (sure there are settings into the carousel module to improve speed of product/image scrolling). @@ecommunlimited Very interesting links you offer me, thank you. Does the load acceleration will be concretely significant on an oscommerce script ? When you use minifer, I guess you have to put aside the original files in case of change. Need to keep a full backup of the website out or in the server, isn't it ? Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
ecommunlimited Posted October 1, 2016 Share Posted October 1, 2016 @@milerwan Yes, minification can increase that rate of the data transfer. Minification removes unrequired charectors and white spaces in the data. If there's less charectors and white spaces, then it takes the servers less time to read and transfer the data. So that's how it can increace the rate of the data being transfered.Although, you must know this about minification. If you chose to minify a file you have to be aware of the fact that some files have mixed content in them. There can be a mix of js, css and html in a file. Each one of those are to be minified differently. Using js as an example, a charector that may be requied for js, may or may not be requied for html or css. If you remove or alter something that is required for one, you can break another. Or you can break your whole site.The only time I minify a whole file all at one time is if it has only one type of code in it. If it has mixed types of code in it, I minify each block of code seperately. First I minified many files and after I did that I minified my whole site. If you really want to increase the speed of your site you should use the things I suggested ealier like using a CDN, use the code (or something similar) for the root .htaccess file and minify as much as you can. You should also compress your images as well as sprite images where you can. You should also decrease the amount of your js and css files. You can combine most of your js into one file and combine most of your css into one file.Yes, you should always make a complete backup before you make changes to your files or folders. You should backup your database as well. A really great backup will save you if you ever screw up or if the code is poorly written. You can also rename a file an original file and create a new one with the old name. An example of this is: original file named whatever.php renamed to whatever.php.orig then create a new file and name it whatever.php. You then copy the code from whatever.php.orig and paste it into the new whatever.php.You can also create a temp folder called temp (or some other name you chose) and move the original whatever.php file to the new temp folder. You can copy whatever.php to a temp folder as well. Bill Link to comment Share on other sites More sharing options...
milerwan Posted October 4, 2016 Author Share Posted October 4, 2016 Attentive to your remarks about the visual gene caused by carousels, I slowed down considerably the speed of scrolling of products.The result seems to be less aggressive for eyes. >_< Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
auzStar Posted October 5, 2016 Share Posted October 5, 2016 @@milerwan Attentive to your remarks about the visual gene caused by carousels, I slowed down considerably the speed of scrolling of products.The result seems to be less aggressive for eyes. >_< You could go one step further and turn off auto-play for some carousels. Not necessary to have them all scrolling. The scroll indicators will still be visible and if a customer wants to scroll through carousels they can. cheers My Add-onsAdvanced Cache Control Tool for osCommerce 2.3.x (non-bootstrap) Download SupportAjax Product Listing for osC 2.3.4 (bootstrap) Download SupportCategory New Products Carousel for osC 2.3.4 (bootstrap) Download SupportCategory Popular Products Carousel for osC 2.3.4 (bootstrap) Download SupportCustomer Testimonials for osCommerce 2.3.4 (bootstrap and non-bootstrap) Download SupportFront Page New Products Carousel for osC 2.3.4 (bootstrap) Download SupportIndex Nested - Product Listing for osC 2.3.4 (bootstrap) Download SupportMatch Categories in Search Results for osCommerce versions 2.3.x (non-bootstrap) Download SupportModular Category Page for osC 2.3.4 (bootstrap) Download SupportNEW Australia Post Shipping Modules for osCommerce 2.3.x (non-bootstrap) Download SupportNEW Equal Height Module for osC 2.3.4 (bootstrap) Download SupportProducts Low Stock Report for osC 2.3.x (bootstrap and non-bootstrap) Download SupportTwitter Typeahead Autocomplete Search for osCommerce 2.3.4 (bootstrap and non-bootstrap) Download SupportUpcoming Products Modules for osC 2.3.4 (bootstrap) Download Support Assisted Add-onsScroll Boxes for osCommerce 2.3.x (bootstrap and non-bootstrap) Download Support Bootstrap Add-ons created by other membersosCommerce Bootstrap Addons and Code Link to comment Share on other sites More sharing options...
ecommunlimited Posted October 5, 2016 Share Posted October 5, 2016 By slowing the scrolling rate down, and whatever else you've done, you brought your page load scores down from 4.9 to about 3.3 seconds. If you do as auzStar suggested they'll come down even more. Everyone here can see you're trying to improve, you get a pat on the back for that @@milerwan. Link to comment Share on other sites More sharing options...
milerwan Posted October 5, 2016 Author Share Posted October 5, 2016 By slowing the scrolling rate down, and whatever else you've done, you brought your page load scores down from 4.9 to about 3.3 seconds. If you do as auzStar suggested they'll come down even more. Everyone here can see you're trying to improve, you get a pat on the back for that @@milerwan. You're right, page speed loading is still too hight for some pages (product_info.php for example). When I make a PageSpeed Insights test, it says that there are js scripts that block the page displaying : ext/jquery/jquery-2.2.3.min.js ext/menu_xs/js/modernizr.custom.js ext/menu_xs/js/jquery.dlmenu.js But the call of "jquery/jquery-2.2.3.min.js" is originaly located in template_top.php file as style .css files : <link href="ext/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <!-- font awesome --> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> <link href="custom.css" rel="stylesheet"> <link href="user.css" rel="stylesheet"> <!--[if lt IE 9]> <script src="ext/js/html5shiv.js"></script> <script src="ext/js/respond.min.js"></script> <script src="ext/js/excanvas.min.js"></script> <![endif]--> <script src="ext/jquery/jquery-2.2.3.min.js"></script> Do these calls files must be placed in template_bottom.php file rather than template_top.php file ?!? Osc v2.3.4 BS "custom" PHP 7.3 compatible (710 modified files => o_O') Link to comment Share on other sites More sharing options...
ecommunlimited Posted October 5, 2016 Share Posted October 5, 2016 @@milerwan You're on the right track, I can help you make your site faster. You won't have to go through as much of a leaning curve as I did. Your version of osC is close to mine so a lot of the stuff that worked for me will work for you. I have to go to the store first and then I'll come back and put something together that will help you out. If you do what I suggest your site will speed up very quickly and most of the stuff the testing sites complain about will be a whole lot less. The osC community is about helping one another out as well as many other good things. I'll be back. Bill Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.