I have a niche type website that we don’t want to conform to typical web layouts, i.e. header and some columns. It’s an e-commerce site that sells specialized products. We’re known as mavericks in the industry itself for the products we present.
The problem is that there is a lot of background info such as credentials in the form of video galleries, photo galleries, testimonials, etc that are used to sell the products. We want people to see those things, but they should always be led to the products and not get too sidetracked.
The design should be classy, and not feel like a walmart, or any other typical e-commerce site. I’m on the Joomla platform and would like to remain there, but I no longer want a site that “looks like Joomla”
Are there any recommendations based on the above? Any particular designer that comes to mind, or type of look for a site? thanks!
So you can see it’s not a new idea. I didn’t know what it was called for a long time until I saw the name on Jeff Croft’s bloggitty. Basically it’s just using AJAX to stop normal attempts to contact the server and does stuff. Anyone without JS just gets the regular contact with the server like you just have without JS. This prevents YOU from needing to build two separate versions of your one site (assuming you wanted those without JS to also be customers, and this means by default anyone without JS will just get ALL the info… so, also the Googles et al).
I can see the SEO benefits and if coded correctly the 508 compliance but is there a better way to have a 1 page site and possibly use AJAX to load the content? Then you get into server requests and such.
If you do decide to go AJAX, go Hijax. Cause I’m assuming you WANT the googles to find all the products (even if there are so many of them that it doesn’t get them all anyway).
The problem is that there is a lot of background info such as credentials in the form of video galleries, photo galleries, testimonials, etc that are used to sell the products. We want people to see those things, but they should always be led to the products and not get too sidetracked.
Can I suggest that you contact a designer/company that specialises in web design that can work out a strategy for you and then choose the technology that would best support it?
It’s all good and fine talking about different ways to build a navigation effect but unless you know what you want to achieve and how you’re going to achieve it, there’s no point in talking about it
Yes, the page would have to load all of the content. If you only want the visitor to see / download content if they want it, it’s easy enough to have separate pages with a menu to those in the sidebar. That’s a neat and traditional way of organizing content. Going for Ajax and co. seems a little extreme to me, and I personally wouldn’t use that for lots of important content.
I love the hide/show idea but how does that affect page load speeds? Wouldn’t you be loading content whether the user sees it or not?
I can see the SEO benefits and if coded correctly the 508 compliance but is there a better way to have a 1 page site and possibly use AJAX to load the content? Then you get into server requests and such.
Well just throwing it out there, for each product you could use :target to show and hide photos / videos / testimonials on demand (so each product has it’s own page but the related “media” can be shuffled by clicking on the link that describes it). All my sites method does is provide a mechanism to show or hide related content while keeping it on the page (good for screen readers and search engines alike), to what extent you use it is entirely up to your needs. Certainly having small unique blocks of content like a testimonial could be embedded in the page with little overhead. And having the photo’s / videos on the page would be the same as using a lightbox.
Alex,
Checked out your website as well. The functionality seemed very ‘jumpy’ to me. Sometimes when clicking on a selection to view it would actually close the entire content div. I’m on a mac with FF 3.6.3
Actually clicking on ‘Website Design’ opened and closed the design div when the expected functionality would have just opened it. Overall just seemed like it lacked in usability and functionality. Maybe just a few bugs lurking around in your code…?
Hi Alex,
I looked at your site. It’s very simple, easy to use of course. But I don’t know how practical it can be for e-commerce? I have about 50 products, 200+ testimonials, 400+ photo gallery, video gallery and other supporting information. It’s a music education e-commerce site. It seems there’s has to be some kind of balance between the product pages and the items I mentioned above. This product genre is somewhat strange because there’s an army of amateurs out there who put out products simply because they can, not because they have the credentials to do so. So we push the credentials very hard to establish legitimacy and so on…
You could also use the CSS3 :target selector to show information only as it’s requested. Granted it’s not as glorious as jQuery tabs but it certainly will do the job without scripting needing to be enabled (cept in IE’s case where a bit of scripting is required). My website makes use of the technique extensively (feel free to examine the code if you like to get some ideas), it’s a single page website so all that information is hidden away until it’s requested by the end user.
Maybe, It’s funny how quirks can occur, I’ll certainly keep an eye out for possible issues (the fact I’m lacking in a mac makes such testing a bit tricky)
Well in the case of screenshot’s of my portfolio, it’s attached directly to the :target pseudo (using background-image), and I can say from testing that alike :hover, the information only loads (the image itself) whenever the screenshot is clicked. Thereby while all the text is loaded in a single shot, the images themselves are held until their needed (quite a nice compromise I think in the way I implemented it like that), perhaps it’s just me but people using AJAX tend to be a bit over reliant on scripting which means if your using it to swap out content, the 8% of people who block or can’t use scripting will suffer poor usability as a result.
rustybuddy, well the CSS used is pretty simple, my code validates, it works perfectly in Win versions of Firefox, Chrome, Opera, Safari, IE… with no issues whatsoever. I suspect the Mac version of Firefox has some rendering issues if it’s not doing the job properly as my code is sound.
