In the fast-paced world of e-commerce, User Experience (UX) reigns supreme. A seamless, intuitive, and enjoyable online shopping experience is no longer a luxury; it’s a necessity. For Magento 2 store owners, neglecting UX can be a fatal mistake, directly impacting conversion rates and ultimately, the bottom line. As we move into 2025 and 2026, customer expectations will continue to rise, making it even more crucial to address common UX pitfalls. This comprehensive guide will delve into the most critical Magento 2 UX mistakes that could be sabotaging your success and provide actionable solutions to turn things around.

1. Ignoring Mobile-First Design

In 2025-2026, mobile commerce, or m-commerce, will continue its dominance. A significant portion of online shoppers will be browsing and purchasing directly from their smartphones and tablets. Ignoring mobile-first design principles in your Magento 2 store is akin to turning away a massive segment of potential customers. A clunky, unresponsive, or difficult-to-navigate mobile experience will lead to frustration, abandonment, and lost sales.

The Problem: Unresponsive Design and Poor Mobile Navigation

Many Magento 2 stores still suffer from unresponsive designs that fail to adapt seamlessly to different screen sizes. This results in:

• Tiny, unreadable text: Users have to pinch and zoom constantly, creating a tedious experience.
• Misaligned elements: Buttons, images, and text boxes overlap or are cut off, making it difficult to interact with the site.
• Slow loading times: Mobile users are particularly sensitive to slow loading times, as they are often on limited data plans.
• Difficult navigation: Menus are often collapsed or hidden, making it hard for users to find what they’re looking for.

The Solution: Embrace Responsive Design and Optimize for Touch

The key is to prioritize responsive design, ensuring that your Magento 2 store automatically adjusts to any screen size. This involves:

• Using a responsive Magento 2 theme: Choose a theme that is specifically designed for mobile devices.
• Implementing fluid grids and flexible images: This allows content to resize dynamically based on the screen size.
• Optimizing images for mobile: Reduce image file sizes to improve loading times on mobile devices.
• Simplifying navigation: Implement a clear and intuitive mobile navigation menu, such as a hamburger menu or a bottom navigation bar.
• Designing for touch: Ensure that buttons and links are large enough and spaced appropriately for easy tapping on touchscreens.
• Testing on various devices: Regularly test your store on different mobile devices and screen sizes to ensure a consistent user experience.

Furthermore, consider implementing Accelerated Mobile Pages (AMP) for key pages like product pages and blog posts. AMP provides a stripped-down, lightning-fast mobile experience that can significantly improve loading times and boost your search engine rankings.

2. Complicated and Lengthy Checkout Process

The checkout process is the final hurdle in the customer journey. A complicated, lengthy, or confusing checkout can lead to cart abandonment and lost sales. In 2025-2026, customers will expect a streamlined and frictionless checkout experience.

The Problem: Too Many Steps, Required Fields, and Account Creation

Common checkout UX mistakes include:

• Excessive steps: Requiring users to navigate through multiple pages to complete their purchase.
• Too many required fields: Asking for unnecessary information, such as phone numbers or company names.
• Forced account creation: Requiring users to create an account before they can complete their purchase.
• Lack of guest checkout option: Not allowing users to checkout without creating an account.
• Confusing error messages: Providing unclear or unhelpful error messages when users make mistakes.
• Lack of trust signals: Not displaying security badges or trust seals to reassure users about the safety of their payment information.
• Hidden or unexpected shipping costs: Surprising users with high shipping costs at the end of the checkout process.

The Solution: Simplify and Streamline the Checkout Experience

To optimize your Magento 2 checkout process, focus on simplification and streamlining:

• Reduce the number of steps: Aim for a one-page checkout or a minimal multi-page checkout with clear progress indicators.
• Minimize required fields: Only ask for essential information needed to process the order.
• Offer a guest checkout option: Allow users to complete their purchase without creating an account.
• Provide clear and helpful error messages: Guide users on how to correct their mistakes.
• Display trust signals: Show security badges and trust seals to build confidence.
• Be transparent about shipping costs: Display shipping costs early in the checkout process.
• Offer multiple payment options: Provide a variety of payment options, such as credit cards, PayPal, and Apple Pay.
• Implement address auto-completion: Use address auto-completion to speed up the checkout process.
• Optimize for mobile: Ensure that the checkout process is fully responsive and optimized for mobile devices.

Consider using Magento 2 extensions that offer streamlined checkout experiences, such as one-step checkout extensions or progress bar extensions. These extensions can significantly improve conversion rates by making the checkout process faster and easier.

3. Poor Site Search Functionality

For many users, the site search is the primary means of finding products on your Magento 2 store. A poor site search experience can lead to frustration, abandonment, and lost sales. In 2025-2026, customers will expect a fast, accurate, and intelligent site search that helps them find exactly what they’re looking for.

The Problem: Inaccurate Results, Slow Speed, and Lack of Features

Common site search UX mistakes include:

• Inaccurate search results: Returning irrelevant or incorrect results for common search queries.
• Slow search speed: Taking too long to display search results.
• Lack of autocomplete suggestions: Not providing autocomplete suggestions as users type their search queries.
• No search filters: Not allowing users to filter search results by price, category, or other attributes.
• Poor handling of typos and misspellings: Not correcting typos or misspellings in search queries.
• No support for synonyms: Not recognizing synonyms for common search terms.
• Lack of visual search: Not offering the ability to search using images.

The Solution: Implement a Powerful and Intelligent Site Search

To improve your Magento 2 site search functionality, focus on accuracy, speed, and intelligence:

• Use a dedicated search extension: Consider using a dedicated search extension that offers advanced features like autocomplete, faceted search, and typo correction.
• Optimize your product data: Ensure that your product data is accurate, complete, and well-organized.
• Implement autocomplete suggestions: Provide autocomplete suggestions as users type their search queries.
• Offer search filters: Allow users to filter search results by price, category, and other attributes.
• Use stemming and lemmatization: Implement stemming and lemmatization to improve search accuracy.
• Support synonyms: Add synonyms for common search terms.
• Implement visual search: Offer the ability to search using images.
• Monitor search queries: Track search queries to identify common search terms and areas for improvement.
• Optimize search speed: Optimize your search index and server configuration to improve search speed.

Consider using AI-powered search solutions that can learn from user behavior and provide more relevant search results over time. These solutions can significantly improve the user experience and boost conversion rates.

4. Neglecting Product Page Optimization

The product page is where the magic happens. It’s where potential customers learn about your products and decide whether or not to make a purchase. Neglecting product page optimization can be a major UX mistake that leads to lost sales. In 2025-2026, customers will expect detailed, engaging, and persuasive product pages that provide all the information they need to make an informed decision.

The Problem: Poor Product Descriptions, Low-Quality Images, and Lack of Social Proof

Common product page UX mistakes include:

• Poor product descriptions: Writing vague, uninformative, or poorly written product descriptions.
• Low-quality images: Using blurry, pixelated, or small product images.
• Lack of multiple images: Not providing multiple images of the product from different angles.
• No product videos: Not using product videos to showcase the product in action.
• Lack of customer reviews: Not displaying customer reviews or ratings.
• Hidden or unclear pricing: Not displaying the product price prominently or clearly.
• Difficult-to-find add to cart button: Making it difficult for users to find the add to cart button.
• Lack of related products: Not suggesting related products or upsells.
• Slow loading times: Having slow loading times on product pages.

The Solution: Create Engaging and Persuasive Product Pages

To optimize your Magento 2 product pages, focus on providing detailed information, high-quality visuals, and social proof:

• Write compelling product descriptions: Focus on the benefits of the product and use persuasive language.
• Use high-quality images: Use professional-quality images that showcase the product from different angles.
• Include product videos: Create product videos that demonstrate the product in action.
• Display customer reviews and ratings: Encourage customers to leave reviews and display them prominently on the product page.
• Highlight key features and benefits: Use bullet points or icons to highlight the key features and benefits of the product.
• Display the price prominently: Make sure the price is clearly visible and easy to find.
• Make the add to cart button prominent: Use a large, colorful add to cart button that stands out from the rest of the page.
• Suggest related products and upsells: Recommend related products or upsells to increase the average order value.
• Optimize for mobile: Ensure that the product page is fully responsive and optimized for mobile devices.
• Improve loading times: Optimize images and code to improve loading times.

Consider using A/B testing to experiment with different product page layouts and content to see what works best for your audience. For businesses looking to optimize their platform, professional Magento optimization services can significantly improve site speed and overall performance.

5. Ignoring Website Accessibility

Website accessibility is not just a legal requirement; it’s also a moral imperative. Ignoring website accessibility means excluding a significant portion of the population from your online store, including people with disabilities, elderly users, and users with temporary impairments. In 2025-2026, customers will expect websites to be accessible to everyone, regardless of their abilities.

The Problem: Lack of Alt Text, Poor Color Contrast, and Keyboard Navigation Issues

Common website accessibility UX mistakes include:

• Lack of alt text for images: Not providing alternative text descriptions for images, making them inaccessible to visually impaired users.
• Poor color contrast: Using color combinations that are difficult to see for users with low vision or color blindness.
• Keyboard navigation issues: Making it difficult or impossible to navigate the website using a keyboard alone.
• Lack of captions for videos: Not providing captions for videos, making them inaccessible to hearing-impaired users.
• Inadequate form labels: Not providing clear and descriptive labels for form fields.
• Small font sizes: Using font sizes that are too small to read easily.
• Lack of ARIA attributes: Not using ARIA attributes to provide additional information to assistive technologies.

The Solution: Implement Web Content Accessibility Guidelines (WCAG)

To improve your Magento 2 website accessibility, follow the Web Content Accessibility Guidelines (WCAG):

• Provide alt text for all images: Use descriptive and informative alt text for all images.
• Ensure sufficient color contrast: Use color combinations that provide sufficient contrast between text and background.
• Make the website navigable by keyboard: Ensure that all elements of the website can be accessed and interacted with using a keyboard alone.
• Provide captions for videos: Provide accurate and synchronized captions for all videos.
• Use clear and descriptive form labels: Use clear and descriptive labels for all form fields.
• Use appropriate font sizes: Use font sizes that are large enough to read easily.
• Use ARIA attributes: Use ARIA attributes to provide additional information to assistive technologies.
• Test with assistive technologies: Regularly test your website with assistive technologies, such as screen readers, to identify and fix accessibility issues.

Consider using accessibility auditing tools to identify accessibility issues on your website. These tools can help you ensure that your website meets WCAG standards and is accessible to everyone.

6. Slow Website Loading Speed

In the age of instant gratification, website loading speed is critical. A slow-loading website can frustrate users, leading to abandonment and lost sales. In 2025-2026, customers will expect websites to load quickly and seamlessly. Studies have shown that even a one-second delay in page load time can significantly impact conversion rates.

The Problem: Unoptimized Images, Excessive HTTP Requests, and Poor Server Performance

Common causes of slow website loading speed include:

• Unoptimized images: Using large, uncompressed images that take too long to load.
• Excessive HTTP requests: Having too many HTTP requests due to too many files (CSS, JavaScript, images) on the page.
• Poor server performance: Using a slow or unreliable web server.
• Uncached content: Not caching static content, such as images and CSS files.
• Render-blocking JavaScript and CSS: Having JavaScript and CSS files that block the rendering of the page.
• Lack of a Content Delivery Network (CDN): Not using a CDN to distribute content to users from geographically closer servers.
• Database issues: Having a slow or unoptimized database.

The Solution: Optimize Website Performance and Leverage Caching

To improve your Magento 2 website loading speed, focus on optimizing images, reducing HTTP requests, and improving server performance:

• Optimize images: Compress images and use appropriate image formats (e.g., WebP).
• Reduce HTTP requests: Combine CSS and JavaScript files, and use CSS sprites.
• Improve server performance: Use a fast and reliable web server, and optimize your server configuration.
• Enable caching: Enable browser caching and server-side caching.
• Minify JavaScript and CSS: Minify JavaScript and CSS files to reduce their size.
• Use a Content Delivery Network (CDN): Use a CDN to distribute content to users from geographically closer servers.
• Optimize your database: Optimize your database queries and indexes.
• Defer loading of non-critical resources: Defer loading of non-critical resources, such as JavaScript files, until after the page has loaded.
• Use lazy loading for images: Use lazy loading to load images only when they are visible in the viewport.

Consider using performance monitoring tools to identify performance bottlenecks on your website. These tools can help you pinpoint areas for improvement and track your progress over time.

7. Confusing Navigation and Information Architecture

A well-designed navigation system is essential for helping users find what they’re looking for on your Magento 2 store. A confusing or poorly organized navigation system can lead to frustration, abandonment, and lost sales. In 2025-2026, customers will expect websites to have clear, intuitive, and easy-to-use navigation.

The Problem: Overly Complex Menus, Hidden Navigation, and Inconsistent Labeling

Common navigation UX mistakes include:

• Overly complex menus: Having too many menu items or nested submenus.
• Hidden navigation: Hiding navigation behind hamburger menus or other obscure icons.
• Inconsistent labeling: Using inconsistent or unclear labels for menu items and links.
• Lack of a search bar: Not providing a search bar for users to quickly find what they’re looking for.
• Poor breadcrumb navigation: Not providing breadcrumb navigation to help users understand their location on the website.
• Lack of a sitemap: Not providing a sitemap for search engines and users to easily navigate the website.
• Inconsistent footer navigation: Having inconsistent or incomplete footer navigation.

The Solution: Simplify Navigation and Improve Information Architecture

To improve your Magento 2 website navigation, focus on simplifying menus, making navigation visible, and using consistent labeling:

• Simplify menus: Reduce the number of menu items and nested submenus.
• Make navigation visible: Ensure that navigation is always visible and easy to access.
• Use consistent labeling: Use consistent and clear labels for menu items and links.
• Provide a search bar: Include a prominent search bar on every page of the website.
• Implement breadcrumb navigation: Implement breadcrumb navigation to help users understand their location on the website.
• Provide a sitemap: Provide a sitemap for search engines and users to easily navigate the website.
• Optimize footer navigation: Include important links in the footer navigation, such as contact information, privacy policy, and terms of service.
• Use clear visual hierarchy: Use clear visual hierarchy to guide users through the website.

Consider conducting user testing to get feedback on your website navigation. User testing can help you identify areas where users are struggling to find information and make improvements to your navigation system.

8. Ignoring User Feedback and Analytics

Your users are your best source of information about the UX of your Magento 2 store. Ignoring user feedback and analytics is a major mistake that can prevent you from identifying and fixing UX issues. In 2025-2026, successful e-commerce businesses will be data-driven and customer-centric, constantly monitoring user feedback and analytics to improve the user experience.

The Problem: Lack of Feedback Mechanisms and Failure to Analyze Data

Common mistakes related to user feedback and analytics include:

• Lack of feedback mechanisms: Not providing ways for users to provide feedback, such as surveys, feedback forms, or live chat.
• Failure to analyze data: Collecting data but not analyzing it to identify UX issues.
• Ignoring user reviews: Not paying attention to user reviews on product pages or third-party review sites.
• Not conducting user testing: Not conducting user testing to get direct feedback from users.
• Lack of A/B testing: Not using A/B testing to experiment with different UX designs and see what works best.
• Not tracking key metrics: Not tracking key metrics, such as conversion rates, bounce rates, and time on site.

The Solution: Implement Feedback Mechanisms and Analyze Data Regularly

To improve your Magento 2 website UX, focus on collecting user feedback and analyzing data regularly:

• Implement feedback mechanisms: Provide ways for users to provide feedback, such as surveys, feedback forms, or live chat.
• Analyze data regularly: Analyze data from Google Analytics and other sources to identify UX issues.
• Pay attention to user reviews: Monitor user reviews on product pages and third-party review sites.
• Conduct user testing: Conduct user testing to get direct feedback from users.
• Use A/B testing: Use A/B testing to experiment with different UX designs and see what works best.
• Track key metrics: Track key metrics, such as conversion rates, bounce rates, and time on site.
• Use heatmaps and session recordings: Use heatmaps and session recordings to see how users are interacting with your website.

Consider using customer relationship management (CRM) software to manage user feedback and track customer interactions. CRM software can help you identify patterns and trends in user behavior and provide personalized support to your customers.

9. Ignoring Personalization and Customization

In 2025-2026, customers will expect personalized and customized experiences that cater to their individual needs and preferences. Ignoring personalization and customization can make your Magento 2 store feel generic and impersonal, leading to lower engagement and conversion rates.

The Problem: Generic Content, Lack of Recommendations, and No Personalized Offers

Common mistakes related to personalization and customization include:

• Generic content: Providing the same content to all users, regardless of their interests or preferences.
• Lack of recommendations: Not providing personalized product recommendations based on user browsing history or purchase history.
• No personalized offers: Not offering personalized discounts or promotions based on user behavior.
• Ignoring user segmentation: Not segmenting users based on demographics, interests, or purchase history.
• Lack of personalized email marketing: Sending generic email marketing messages to all users.
• Not using dynamic content: Not using dynamic content to personalize the website experience.

The Solution: Implement Personalization and Customization Strategies

To improve your Magento 2 website UX, focus on implementing personalization and customization strategies:

• Personalize content: Provide personalized content based on user interests and preferences.
• Offer personalized product recommendations: Provide personalized product recommendations based on user browsing history or purchase history.
• Offer personalized discounts and promotions: Offer personalized discounts or promotions based on user behavior.
• Segment users: Segment users based on demographics, interests, or purchase history.
• Use personalized email marketing: Send personalized email marketing messages to different user segments.
• Use dynamic content: Use dynamic content to personalize the website experience.
• Implement a loyalty program: Implement a loyalty program to reward repeat customers.
• Use AI-powered personalization: Use AI-powered personalization tools to automate and optimize personalization efforts.

Consider using personalization platforms that integrate with Magento 2. These platforms can help you collect user data, segment users, and deliver personalized experiences across your website and marketing channels.

10. Not Optimizing for Voice Search

Voice search is rapidly growing in popularity, with more and more users using voice assistants like Siri, Alexa, and Google Assistant to search for products and information online. Not optimizing for voice search can make you miss out on a significant segment of potential customers. In 2025-2026, voice search optimization will be a critical component of any successful e-commerce strategy.

The Problem: Focusing Only on Text-Based Search and Ignoring Conversational Queries

Common mistakes related to voice search optimization include:

• Focusing only on text-based search: Not optimizing content for conversational search queries.
• Ignoring long-tail keywords: Not targeting long-tail keywords that are commonly used in voice searches.
• Not optimizing for local search: Not optimizing for local search queries, such as “near me” searches.
• Lack of structured data: Not using structured data to help search engines understand the content of your website.
• Slow website loading speed: Having slow website loading speed, which can negatively impact voice search rankings.
• Not providing concise answers: Not providing concise answers to common questions.

The Solution: Optimize for Conversational Queries and Long-Tail Keywords

To improve your Magento 2 website for voice search, focus on optimizing for conversational queries and long-tail keywords:

• Optimize for conversational search queries: Create content that answers common questions in a natural and conversational way.
• Target long-tail keywords: Target long-tail keywords that are commonly used in voice searches.
• Optimize for local search: Optimize for local search queries, such as “near me” searches.
• Use structured data: Use structured data to help search engines understand the content of your website.
• Improve website loading speed: Optimize your website loading speed to improve voice search rankings.
• Provide concise answers: Provide concise answers to common questions.
• Use schema markup: Use schema markup to provide additional information to search engines about your products and services.
• Create a FAQ page: Create a FAQ page that answers common questions about your products and services.

Consider using voice search optimization tools to identify opportunities to improve your website’s visibility in voice search results. These tools can help you track your voice search rankings and identify areas for improvement.

11. Not Utilizing High-Quality Visuals

In the visually-driven world of e-commerce, high-quality visuals are essential for capturing attention and driving sales. Neglecting the power of visuals can be a significant UX mistake that can negatively impact conversion rates. In 2025-2026, customers will expect visually appealing and engaging websites that showcase products in the best possible light.

The Problem: Low-Resolution Images, Lack of Product Videos, and Poor Visual Hierarchy

Common mistakes related to visuals include:

• Low-resolution images: Using low-resolution images that appear blurry or pixelated.
• Lack of product videos: Not using product videos to showcase products in action.
• Poor visual hierarchy: Not using visual cues to guide users through the website.
• Inconsistent branding: Using inconsistent branding elements, such as colors and fonts.
• Cluttered design: Having a cluttered design that makes it difficult for users to focus on the products.
• Not using infographics: Not using infographics to present complex information in a visually appealing way.
• Ignoring mobile optimization: Not optimizing images and videos for mobile devices.

The Solution: Invest in High-Quality Photography and Visual Design

To improve your Magento 2 website UX, focus on investing in high-quality photography and visual design:

• Use high-resolution images: Use high-resolution images that are clear and sharp.
• Create product videos: Create product videos that showcase products in action and highlight their key features.
• Use visual hierarchy: Use visual cues, such as headings, subheadings, and bullet points, to guide users through the website.
• Maintain consistent branding: Use consistent branding elements, such as colors and fonts, throughout the website.
• Create a clean and uncluttered design: Create a clean and uncluttered design that makes it easy for users to focus on the products.
• Use infographics: Use infographics to present complex information in a visually appealing way.
• Optimize for mobile: Optimize images and videos for mobile devices to ensure fast loading times and a seamless user experience.
• Use professional photography: Hire a professional photographer to capture high-quality images of your products.

Consider using visual design tools to create engaging and visually appealing graphics for your website. These tools can help you create professional-looking visuals without requiring extensive design skills.

12. Ignoring the Power of Social Proof

Social proof is a psychological phenomenon where people are more likely to take action if they see that others have done the same. Ignoring the power of social proof can be a missed opportunity to build trust and increase conversions on your Magento 2 store. In 2025-2026, customers will increasingly rely on social proof to make purchasing decisions.

The Problem: Lack of Customer Reviews, Testimonials, and Social Media Integration

Common mistakes related to social proof include:

• Lack of customer reviews: Not displaying customer reviews on product pages or other relevant pages.
• Lack of testimonials: Not featuring testimonials from satisfied customers.
• No social media integration: Not integrating social media feeds or social sharing buttons on the website.
• Not displaying trust badges: Not displaying trust badges or security seals to reassure customers about the safety of their transactions.
• Ignoring influencer marketing: Not leveraging the power of influencer marketing to reach a wider audience.
• Not showcasing case studies: Not showcasing case studies that demonstrate the effectiveness of your products or services.

The Solution: Showcase Customer Reviews, Testimonials, and Social Media Activity

To improve your Magento 2 website UX, focus on showcasing customer reviews, testimonials, and social media activity:

• Display customer reviews: Display customer reviews prominently on product pages and other relevant pages.
• Feature testimonials: Feature testimonials from satisfied customers on your homepage and other key pages.
• Integrate social media: Integrate social media feeds and social sharing buttons on the website.
• Display trust badges: Display trust badges or security seals to reassure customers about the safety of their transactions.
• Leverage influencer marketing: Partner with influencers to promote your products or services to their followers.
• Showcase case studies: Showcase case studies that demonstrate the effectiveness of your products or services.
• Use social proof notifications: Use social proof notifications to show real-time activity on your website, such as recent purchases or product views.

Consider using social proof plugins or extensions that integrate with Magento 2. These tools can help you easily display customer reviews, testimonials, and social media activity on your website.

13. Ignoring Cross-Browser and Cross-Device Compatibility

In today’s diverse digital landscape, users access websites from a wide range of browsers and devices. Ignoring cross-browser and cross-device compatibility can lead to a fragmented user experience and lost sales. In 2025-2026, ensuring that your Magento 2 store works seamlessly across all major browsers and devices will be critical for success.

The Problem: Website Rendering Issues on Different Browsers and Devices

Common mistakes related to cross-browser and cross-device compatibility include:

• Website rendering issues: Website rendering issues on different browsers, such as Chrome, Firefox, Safari, and Edge.
• Layout problems on different devices: Layout problems on different devices, such as smartphones, tablets, and desktops.
• Functionality issues on different browsers: Functionality issues on different browsers, such as JavaScript errors or broken links.
• Not testing on different operating systems: Not testing the website on different operating systems, such as Windows, macOS, iOS, and Android.
• Ignoring mobile responsiveness: Not ensuring that the website is fully responsive and adapts to different screen sizes.

The Solution: Test Thoroughly Across Different Browsers and Devices

To improve your Magento 2 website UX, focus on testing thoroughly across different browsers and devices:

• Test on different browsers: Test the website on all major browsers, including Chrome, Firefox, Safari, and Edge.
• Test on different devices: Test the website on different devices, including smartphones, tablets, and desktops.
• Use browser testing tools: Use browser testing tools to automate the testing process and identify compatibility issues.
• Use device emulators: Use device emulators to test the website on different devices without having to physically own them.
• Test on different operating systems: Test the website on different operating systems, such as Windows, macOS, iOS, and Android.
• Ensure mobile responsiveness: Ensure that the website is fully responsive and adapts to different screen sizes.
• Use a responsive