39 replies to this topic

[bruyndoncx]

Hello all,

Our new version for the webshop is almost finished.

The webshop is an upgraded MS2 installation with contributions and custom code.

This last revision has focused on making the website more responsive, in particular getting a megamenu that fits within the allotted space (major issue on current live shopsite).
Furthermore trying to get a reasonable browsing experience on different (tablet) devices.

Mobile phones can use the site I think, but it is not optimized (yet) for mobile use (all data is still transferred, no responsive images or sliders, no lazy loading ...)

The BETA webshop is at   http://www.keukenlust.be/beta/

this is the real database, just another customer frontend ! Please dont order unless you want it delivered

I would very much appreciate it if you could have a look with small and big screens and let me know what works and even better what doesn't work properly.
I have windows machines, but no mac, samsung galaxy or ipad / iphone here.

If you want more information or pieces of code. Feel free to ask, I'll do my best to share what I can or point you to where things have developed from ...

Thanks
Carine
www.keukenlust.be/beta/

[kymation]

It's an interesting design. It adjusts reasonably well to every desktop size I tried, up to 3840 x 1080.

Some of the text is being cut off, likely due to a fixed height in pixels and a font picked from my installed list (Firefox on Linux). Screenshot here. That happens in the Browse other products in this category box on the product pages as well. I suggest you set the box heights in points instead.

Your free shipping banner is showing &eur; as text, but the prices show the correct symbol. Possibly a charset issue?

Is the Brands menu really more important than any other way of finding products? It does overwhelm the page. It took me a bit to find the main menu in the top bar.

The products I looked at were all lacking a description. Is that something that you haven't done yet? It's pretty much an essential.

I really like the Browse other products box on the products page. I would add the capability to select products from other categories as well, which allows you to do some cross-selling.

I like the look of it. It makes me want to go shopping, so it does seem to be effective. Good work.

Regards
Jim

[burt]

.js off - not good.  Add a message - I like the style that Magento use, I shamelessly ripped theirs.

Other than that, I'm interested to see where this goes.   Nice work.

[bruyndoncx]

kymation, on 02 May 2012 - 01:34 AM, said:

It's an interesting design. It adjusts reasonably well to every desktop size I tried, up to 3840 x 1080.

I've put a maxium width in the design for screens over 1600px, setting it back to 1280 as I felt that to be a good widescreen view.
With a 3840 screen, does it annoy you that it doesn't use the full width, or do you typically have 2 (or more?) windows side by side ?

Quote

Some of the text is being cut off, likely due to a fixed height in pixels and a font picked from my installed list (Firefox on Linux). Screenshot here. That happens in the Browse other products in this category box on the product pages as well. I suggest you set the box heights in points instead.

I'm not sure it that is going to fix it, it happens when the manufacturers name and products name is all rather long, or has long words in it making the products name wrap and it all taking up more lines than fit in the box. The size of the products box (the green on hover) is fixed to mimic products in a row, when it is not fixed, float left can have strange results. Possibly some tuning is possible to that for a given row, the height is set to the maximum needed for that particular row. The issue is mostly with the % off text, which I plan to superimpose on the image, like the bottom right corner. If that is done, the cutting off, becomes a minor issue. Yes, the issue is consistent throughout, it uses the same function call (wonder why hpdl never considered that), the product listings on products_new, specials and index, category, products_filter are also all the same module used. (I'm not sure, perhaps this is now also done in 2.3.1, wasn't in MS2 at least)

Quote

Your free shipping banner is showing &eur; as text, but the prices show the correct symbol. Possibly a charset issue?

typo of my late night update, should have read ampersand euro, forgot the o

Quote

Is the Brands menu really more important than any other way of finding products? It does overwhelm the page. It took me a bit to find the main menu in the top bar.

We sell practically all major branded products, so for our shop it is important, but your point about the top menu is also valid, somehow it doesn't stand out, while on the old site it is more clear.
I think if the top has more of a tabbed interface look, and the category labels in caps, it would probably be better.
I'm looking to integrate a kind of show/hide manufacturers menu so it's easily accessible, but not in your face all the time.
I also want it for google and stuff.

[bruyndoncx]

kymation, on 02 May 2012 - 01:34 AM, said:

The products I looked at were all lacking a description. Is that something that you haven't done yet? It's pretty much an essential.

you are correct, our store is a physical one with a webshop since it is in a rural area with not that many inhabitants.
stats wise, we only have descriptions for about 10% of the active products, order wise, Over 80% of products ordered are without description. As we mostly sell branded products often the people know the products already, and reorder or complete their collection. We tend to use the brand and their reference model/type for the product to reassure the customer it is the same product.
We do have specifications for pots&pans, which is our core business, so that kinda compensates a little, also important ranges are setup with product families, where I added a language depended description in order not to copy the same stuff for each product. (manufacturers, and categories also have room for descriptions).
Evidently we have lots of room for improvement by populating all the available descriptions and specifications (and not to forget images ...)

Quote

I really like the Browse other products box on the products page. I would add the capability to select products from other categories as well, which allows you to do some cross-selling.

Not sure I understand completely, not sure if you can just pick any other category to show.
For product families, all products in the same family are listed in that area too, so that is possibly cross category, eg like for some alessi designers?

Quote

I like the look of it. It makes me want to go shopping, so it does seem to be effective. Good work.

thank you

[bruyndoncx]

burt, on 02 May 2012 - 08:24 AM, said:

.js off - not good.  Add a message - I like the style that Magento use, I shamelessly ripped theirs.

Ah yes, need to doublecheck, added to the list. So I'll just rip yours ?

Quote

Other than that, I'm interested to see where this goes.   Nice work.

I was thinking of starting to use github and upload then you could literally see where it goes
I understand the free version is fully public, but for a small price it is possible to setup a private repo which can be shared.
Do you have experience with it ?

[kymation]

Answering in order (more or less)

1. I normally keep the browser window around 1400 x 1080. This leaves room for the editor window and whatever else I might need at the moment. Other applications that don't relate to what I'm working on right now are kept on other desktops. I only opened your site at full size to see what it would do. It copes well, which is often a problem with floating width sites.

2. Fixed height boxes are a pain. I was thinking that the problem was that my font is larger, but if it's doing the same thing on your screen that's not going to help. Some sort of dynamic resizing may be needed. I don't have any good solutions for this.

3. I would look at putting the manufacturer in the top bar, so the customer could show it or not. The dull color of the top bar makes it fade into the background, especially with the same color in the Manufacturer list to the left. Perhaps moving the manufacturer into the top bar will fix this. I'm not the person to be giving color advice, so...

4. You can use one of the cross-sell (xsell) addons to allow you to select the additional products to show on each product page. This is most useful if you have products that have commonly used accessories or supplies. I put this on a site that sold very few accessories for their products, and their accessory sales (with a product) jumped to over 50%.

Regards
Jim

[burt]

bruyndoncx, on 02 May 2012 - 08:08 PM, said:

Ah yes, need to doublecheck, added to the list. So I'll just rip yours ?

Sure thing!  I'll do a blog tomorrow on it.  Simples.

Quote

I was thinking of starting to use github and upload then you could literally see where it goes
I understand the free version is fully public, but for a small price it is possible to setup a private repo which can be shared.
Do you have experience with it ?

Unfortunately I don't.  I could really do with buying a git book if there is one.

[kymation]

Git has very poor documentation. If you find a resource that does a good job of explaining it, please share.

Regards
Jim

[Harald Ponce de Leon]

kymation, on 02 May 2012 - 09:30 PM, said:

Git has very poor documentation. If you find a resource that does a good job of explaining it, please share.

http://help.github.com/

[foxp2]

bruyndoncx, on 02 May 2012 - 08:08 PM, said:

but for a small price it is possible to setup a private repo which can be shared.

private repositeries are available for free with gitorious.
http://blog.gitorious.org/2012/04/30/private-repositories-generally-available/

[bruyndoncx]

Harald Ponce de Leon, on 02 May 2012 - 09:57 PM, said:

http://help.github.com/

this is a pretty comprehensive set of pages, I went to through the beginnner, intermediate and advanced section but I guess I'll need to play with it a little to really understand it.
I'm trying to get my head around how to then best setup my repository with is an MS2 fork with most but not all 2.3.1 changes applied.
There is also some discussion on submodules, but I think that applies more to e.g. the ext directory with jquery files.
Ultimately I'd like to keep up with the osCommerce2 developments , but I'm not sure how it works if I decide not to implement certain changes in 2.3.1.

[burt]

I'm at just about the same stage as Carine, with Github.

I don't quite understand the following;

say I make a change in admin/categories.php on my fork.
Then Harald makes a change in his admin/categories.php

How do I grab Haralds change and insert to mine, with destroying my already made changes.

[bruyndoncx]

burt, on 02 May 2012 - 08:24 AM, said:

.js off - not good.  Add a message - I like the style that Magento use, I shamelessly ripped theirs.

The site makes use of less to generate css using javascript less.js file, I now included the plain css result inside the noscript tag so that while I finetune things further, at least some reasonable page layout is generated.

Cosmetic no javascript effects:

• header shortcut jquery buttons on top
  
• tabs on customer service pages (not functional, but shows all content on single page - good enough)

Not working without javascript:

• enlarge/reset/reduce font links
  
• the tabs used on the product page  (shows non formatted content, looks out of order)
  
• social buttons (google and facebook not showing) bottom right.

Maybe I can add an unobstrusive message in the header for the users without javascript, I'll check your site

[burt]

Carine - latest post in the blog.

For those who don't know where the blog is, please see my profile page where you will find a link.

[bruyndoncx]

burt, on 07 May 2012 - 09:20 AM, said:

Carine - latest post in the blog.

For those who don't know where the blog is, please see my profile page where you will find a link.

Thanks gary, I already put something up, not nearly as nice though !
I was wondering, shouldnt we have a noscript fallback on the shoppingcart buttons and image gallery standard in osC 2.3.1 ?
I don't use the gallery, but do have the fancybox zoom which degrades nicely withouth javascript.

[burt]

bruyndoncx, on 07 May 2012 - 11:00 AM, said:

I was wondering, shouldnt we have a noscript fallback on the shoppingcart buttons and image gallery standard in osC 2.3.1 ?

Yes, we should.  I'm not too bothered about the buttons as they are OK as links.  The main problem is the gallery as the images are not resized down.

[borisr]

I really like the site and it's design, I think you've done a really good job. What imho is horrible is your logo, and to be more precise, the box with the picture of a pot and a glass on it. Good luck!

[bruyndoncx]

hello again, I've progressed a little bit since may and have just made the site live.

I know for small screen phones it is not yet optimal, but for tablets, netbooks, laptops big and small I expect things to work properly.

Please let me know if you find funny stuff or things not working. I've only done limited testing on IE and Firefox with this update.
If you have a look and no particular feedback, would you still please post the OS and browser you have used ?

Thanks a lot

www.keukenlust.be - please note this is a live site - no bogus orders please ...

[bruyndoncx]

I just added adaptive-images.com scripts, so the load should be a little lighter for big images