Hydrogen best practices
To optimize your development experience, Shopify has established a set of best practices that you can refer to when designing and working with Hydrogen custom storefronts.
Best practices
Anchor link to section titled "Best practices"To create an optimal customer experience, and to keep your merchants' stores fast, accessible, and discoverable, you need to consider the following factors:
- Performance: Learn how to make your Hydrogen custom storefront performant.
- Accessibility: Learn how to make your Hydrogen custom storefront accessible and maintainable.
- Testing: Learn how to test your Hydrogen storefront.
- Examples: Explore Hydrogen examples that demonstrate integrations and special use cases.
Guiding principles for Hydrogen development
Anchor link to section titled "Guiding principles for Hydrogen development"In addition to the best practices listed above, you should consider the following guiding principles for Hydrogen development:
| Principle | Description |
|---|---|
| Be purpose-built | Each Hydrogen custom storefront's layout, style, and feature set should be opinionated and optimized for a specific merchant or merchant segment. Your Hydrogen custom storefront should equip merchants with an optimized set of tools to meet their needs, based on what they sell and who they sell to. |
| Offer best-in-class UX | With the growing number of Shopify stores, Hydrogen custom storefronts have the power to lead the industry and to shape ecommerce user experience patterns. Hydrogen custom storefronts should be designed with quality in mind, putting the customer first. |
| Be accessible | To provide the best experience to a wide range of customers, Hydrogen custom storefronts must be built from the ground up with accessibility best practices in mind. |