By offering precise control over image dimensions, users can effectively optimize how their websites and funnels appear on both desktop and mobile devices, ensuring responsive designs that enhance user experience and boost SEO results.
What Are Image Dimensions Settings?
With image dimension settings, you can independently customize image sizes for mobile and desktop views. This lets you define specific height and width values for mobile layouts, ensuring visuals remain crisp and consistent on all devices.
It also supports multiple units for measurement, including pixels (px), relative units (rem, em), and percentages (%), for greater design flexibility.
Why Are Image Dimension Settings Important?
Enhanced Responsiveness: Ensure images adapt seamlessly to different screen sizes, improving user experience.
Improved SEO Performance: Optimizing image sizes for mobile and desktop views can boost your CLS (Cumulative Layout Shift) and PageSpeed scores, key factors for SEO rankings.
Design Flexibility: Customize image dimensions using different units to match your specific design needs.
How to Use Image Dimensions Settings
Step 1: Open the Funnel or Website Builder
Navigate to your Funnel or Website Builder in the HighLevel dashboard.
Select the page containing the image you wish to edit.
Step 2: Access Image Settings
Click on the image to open its settings panel.
Toggle to Mobile View or Desktop View using the preview toggle.
Step 3: Adjust Image Dimensions
In the image settings panel, locate the Height and Width fields.
Enter the desired values for the image dimensions.
Select your preferred unit of measurement:
px for fixed pixel dimensions.
rem or em for scalable dimensions relative to font size.
% for relative dimensions based on container size.
Step 4: Save and Preview
Save your changes and preview your design in both mobile and desktop views to ensure responsiveness.
Frequently Asked Questions
Q: What happens if I don’t set specific dimensions for mobile views?
If you don’t specify mobile dimensions, the image will use the desktop dimensions by default, which may not be optimized for smaller screens.
Q: How do I choose the best unit for image dimensions?
Use px for precise, fixed dimensions.
Use rem or em for scalable designs relative to text size.
Use % for dimensions that scale with the size of the image’s container.
Q: Can I use different units for height and width?
Yes, you can mix and match units for height and width. For example, set the height in pixels (px) and the width in percentages (%) based on your design needs.
Q: Will this feature affect my existing images?
No, existing images will retain their current dimensions unless you modify them. You can adjust the dimensions for individual images as needed.
Q: Can I test CLS and PageSpeed improvements after making changes?
Yes, tools like Google PageSpeed Insights and Lighthouse can help you measure CLS and PageSpeed scores to evaluate the impact of your optimizations.
Q: Is this feature available for all HighLevel users?
Yes, this feature is available across all HighLevel accounts with access to the Funnel or Website Builder.