MDStore: a fast gallery and product pages that explain

A marketplace gallery should support both quick discovery and careful evaluation. In MDStore, products and creator pages have different roles. Optimisation starts by deciding what belongs on the card and which details need to remain available on the full product page.

Inventory images before compressing them

For each item, identify the main photograph, details, scale image and possible variants. Record the source, publication rights and product relationship. When files are mixed up, compression can accelerate the gallery without resolving confusion between different objects.

In a hypothetical example, a vase has a front view, a texture photograph and a picture beside an object of known size. The first supports browsing; the others support a decision. Keep originals separate from web exports so repeated processing does not accumulate quality loss.

Choose consistent framing that suits the artwork

Predictable proportions in the list help people compare titles and prices. For paintings, automatic cropping may remove parts of the work. Choose full framing or cropping according to object type, reviewing representative products manually before applying a rule to the entire catalogue.

A consistent background can improve catalogue readability, but product colour should remain credible. Avoid edits that alter texture or conceal relevant defects. Buyers of unique items need to recognise the actual piece, including characteristics described in the product information.

Deliver the right size for each screen

Gallery cards need smaller images than detailed viewing. Generate appropriate sizes and let the browser select the resource it needs. Check file weight and clarity on an ordinary phone rather than only on a work monitor with a fast connection.

Google's image documentation covers responsive images, alternative text and page context. Use those mechanisms for presentation and discovery. A modern format can help, but unsuitable resolution and too many simultaneous downloads remain problems after conversion.

Reserve image space before loading so text and buttons do not jump. Defer items lower on the page while preserving priority for the important opening image. Test missing files: the card should remain understandable and usable, with its product name and action in predictable positions.

Write the card for quick comparison

A card can contain the name, creator, price or status and one decisive characteristic. For custom work, “made to order” is more useful than a vague badge. Sold products should reveal their status before people expect to proceed to checkout.

Titles identify the object; alternative text describes informative images. Avoid keyword lists in either. Accessible implementation treats a purely decorative image differently from a product photograph conveying information that helps someone choose.

Keep filters useful after returning

Choose filters supported by actual data: type, material, technique, dimensions or availability. Show active choices and a clear reset. On phones, the filter panel should close without losing selections and communicate when results have changed.

When people open a product and return, preserve position and filters where practical. Lost context forces them to repeat the search. Test combinations without results and sequential filter changes, including when the result count changes after a unique item is withdrawn.

Give every product a complete page

A full page can explain material, dimensions, technique, availability, delivery and creator. The gallery supplies the entry point; the product page supports the decision. Links should be accessible through ordinary navigation, with essential content readable without a difficult interaction.

Separate useful pages from technical filter combinations. Google's ecommerce URL guide provides guidance for that control. Define a main address for each product and keep internal links consistent when titles or categories change.

A sold unique piece can retain its page with a clear status and related works when the page remains useful. For permanently removed products, decide behaviour around the existence of a genuine replacement. Redirecting to an unrelated object can confuse visitors and break the expectation created by the link.

Test the gallery through a shopping task

Give a participant a concrete objective: find a vase within a particular size range and explain who makes it. Observe what information they seek and where they hesitate. After opening the product, ask them to return and choose an alternative.

• The main image makes the object recognisable.
• Necessary details remain legible without excessive zoom.
• Filters and returning preserve browsing context.
• Price and availability match the full product page.
• Keyboard navigation has a visible focus indicator.

Measure loading across representative pages and connections. Core Web Vitals provide reference points for loading, interaction and stability. Combine technical data with observation: a fast gallery can still be difficult when every object looks alike or important characteristics are missing.

Turn optimisation into a publishing rule

Give creators examples of a main image, a detail shot and a complete description. Explain file limits before upload and provide specific errors. Editorial review should examine information quality rather than merely whether the system can technically accept a file.

Review missing assets, incomplete cards and repeated product questions regularly. Nonessential tracking requires consent, and viewing a product remains different from purchasing it. A gallery maintains quality when each new publication follows clear rules without requiring a special design intervention.