Jump to content

Creating a Product Gallery


SaranacLake

Recommended Posts

Hello.  I am rolling my first-ever e-commerce site, and could use some help on designing a product gallery.

My site will be selling books and guides, and similar to what you might see on Amazon or Barnes & Noble, I want to create a product gallery which displays all products for a given category.

For simplicity, let's say that I am only selling paper books, and that is what I want to display - so for the purposes of this conversation, no need to filter on product type.

When a user clicks on the product catalog, I was thinking of simply displaying all products (e.g. eBooks) in  gallery containing thumbnails in a grid arrangement.  The user would click on the thumbnail - which would be the cover of the book - and then be taken to a product page which would have all of the details, including: a larger thumbnail of the book, book title, description, price, author, etc.

I suppose I could have a test title and description below each thumbnail?

Anyways, I am a little uncertain of how all of this would work from a technical standpoint?!

I guess I was thinking that each thumbnail would have a link behind it, which would then load my "product_details.php" page AND pass along something like a "ProductID" in the URL, so that my product_details.php" script could query my database and pull up the book's details.

How does that sound?

I look forward to hearing what you PHP gurus have to say!!  🙂

 

 

Link to comment
Share on other sites

2 hours ago, SaranacLake said:

I suppose I could have a test title and description below each thumbnail?

Is that what you want to do?

2 hours ago, SaranacLake said:

I guess I was thinking that each thumbnail would have a link behind it, which would then load my "product_details.php" page AND pass along something like a "ProductID" in the URL, so that my product_details.php" script could query my database and pull up the book's details.

How does that sound?

Sounds right.

Link to comment
Share on other sites

8 hours ago, requinix said:

Is that what you want to do?

Sounds right.

Well, what would you expect as a customer?

If I just have a thumbnail which is an image of an eBook, then there wouldn't be any text for search engines to crawl and I suppose it would create accessibility issues if you couldn't see the image, right?

For whatever reason, I have never felt comfortable with $_GET requests.

Would there be a way to do what I described but submit the request eBook as a $_POST instead?

Also, from what I described above, what other design considerations would you make?  (Like I said, I have never built an e-commerce site before from scratch, so all of this feels foreign to me!!)

Thanks.

Link to comment
Share on other sites

5 minutes ago, Barand said:

You would only be sending a product id number, not your bank details.

True, but I guess I have felt more comfortable with $_POST since - as far as I know - it cannot be seen by the user or fiddled with.  (Of course I always sanitize incoming requests either way?!)

Do you have any thoughts - as a designer or a as an end-user - of what you would expect to see from what I described above?

I'm thinking that just having a thumbnail probably isn't very "accessible", so maybe I have to "frame" the thumbnail in a <div> and add some readable text?

Also, would it be intuitive enough to an end user with a gallery of thumbnails for them to know that they have to click on the book they want, and then presumably they will dive deeper and get more product details?  (I think most e-commerce sites have larger descriptive text when you shop a product catalog, however since I am building this to offer a "FREE eBook" with the purchase of a description, and thus it is a free add-on, I think the experience should be more steamlined, if you follow my thinking?)

Anyways, I'm curious to hear what you and others have to say!  🙂

 

Link to comment
Share on other sites

4 hours ago, SaranacLake said:

Do you have any thoughts - as a designer or a as an end-user - of what you would expect to see from what I described above?

User doesn't care. They don't look at URLs when they're just browsing around, and if they want to share the page they'll either use a share button or copy/paste what's up there. In fact that copying and pasting is a huge reason why ideas like putting session IDs into the URL (PHP's session.use_cookies/use_only_cookies) are strongly discouraged.

That said, try to keep it simple. example.com/product.php?id=123 (or /products/123) is fine. Attempting to obfuscate it because you're scared, like example.com/product.php?product_id=uw433hyg5kishev6nyliser6nbyioq2gv49n68of325ob8nq534tb8, is not fine. People don't like things they can't understand: "123" is a number and people are okay with numbers, "B00005N5PF" is some sort of cryptic ID but it's okay too because it's short and easy to understand, but "uw433hyg5kishev6nyliser6nbyioq2gv49n68of325ob8nq534tb8" is a code and codes are for hackers. CoDeS aRe FoR hAcKeRs

4 hours ago, SaranacLake said:

I'm thinking that just having a thumbnail probably isn't very "accessible", so maybe I have to "frame" the thumbnail in a <div> and add some readable text?

Probably, yeah.

4 hours ago, SaranacLake said:

Also, would it be intuitive enough to an end user with a gallery of thumbnails for them to know that they have to click on the book they want, and then presumably they will dive deeper and get more product details?

Lots of stuff on the internet already works like that. People are used to it.

  • Like 1
Link to comment
Share on other sites

5 minutes ago, requinix said:

User doesn't care. They don't look at URLs when they're just browsing around, and if they want to share the page they'll either use a share button or copy/paste what's up there. In fact that copying and pasting is a huge reason why ideas like putting session IDs into the URL (PHP's session.use_cookies/use_only_cookies) are strongly discouraged.

I built most of my site a loooong time ago, and have forgotten a lot.  Can you please refresh my memory of how a sessionID would end up in the URL?

My site doesn't use cookies, and everything is done using the sessionID.  As I recall, I guess the only cookie I use is to store the sessionID which I believe was the safest at the time I did things.  But maybe things have changed and I certainly want things to be *secure* to protect my customers!

 

5 minutes ago, requinix said:

That said, try to keep it simple. example.com/product.php?id=123 (or /products/123) is fine. Attempting to obfuscate it because you're scared, like example.com/product.php?product_id=uw433hyg5kishev6nyliser6nbyioq2gv49n68of325ob8nq534tb8, is not fine. People don't like things they can't understand: "123" is a number and people are okay with numbers, "B00005N5PF" is some sort of cryptic ID but it's okay too because it's short and easy to understand, but "uw433hyg5kishev6nyliser6nbyioq2gv49n68of325ob8nq534tb8" is a code and codes are for hackers. CoDeS aRe FoR hAcKeRs

Yeah, last month I think I came up with a fairly simple SKU that is under 8 characters - a combination of letters and characters like eb501 for eBook 501.

 

5 minutes ago, requinix said:

Probably, yeah.

Lots of stuff on the internet already works like that. People are used to it.

So to tie this together...  I can build a gallery of free eBooks using "thumbnails", but those would be more than just images - maybe they would be a <div> wrapped around an image of the book cover with supporting text.  I would use an SQL query to grab whichever eBooks I am offering for free, and then use PHP to loop through that recordset and dynamically build the HTML to display things in a grid gallery, right?

And behind each <div> / image would be a hyperlink like www . mysite . com/products/eb5001 and when the user clicks on the hyperlinked <div> they would be taken to that page, at which point my PHP would grab the $_GET variable (e.g. eb5001) and then use that to query MySQL to get all of the related product details (e.g. Book Title, Description, Original Price, Images, etc.), right?

And then on that product details page I would have an "Add to Cart" button to allow them to select it.

How does that sound?

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.