Hey,
I’ve built a basic website for a Village hall on a laptop running a 2256x1504 resolution.
It consists of a simple image and logo header, with a floating menu to navigate the various pages.
I’m getting several reports that the website is distorting. Given the demographic who use the village hall, i’m assuming that its a screen resolution issue and that my customers who are having an issue are running low screen res.
I’ve also tested this myself and can also replicate the same issue.
Is there any way of getting the website to optimise for various screen resolutions?
I’m currently using the basic Wix editor, no bells of whistles.
Would there be much benefit of me lowering my screen resolution and modifying the website so that its legible for a medium screen res?
My logic is that it’ll be slightly more legible for my low res users, and the ones with high res might just have to zoom in slightly?
Open to any suggestions.
Cheers
Wix editor is hard to optimize for custom breakpoints. You need to align items in the mid or not put outside of the grid line that’s shown in left and right. But if you have time to rebuild it in Wix Studio and you can ask which breakpoint your customers are using, it’ll be better for all different breakpoints.
1 Like
Hello @user3322 , To optimize your Wix site for mobile resolution issues and customize it for responsive breakpoints, you can use custom CSS and media queries. You can try to make Mobile-Friendly Text and Image Adjustments, like the example mentioned below -
// Add this code inside your page code (onReady function)
$w.onReady(function () {
// Adjust font size based on viewport size
if (wixWindow.formFactor === 'Mobile') {
$w('#headline').style.fontSize = '24px';
} else if (wixWindow.formFactor === 'Desktop') {
$w('#headline').style.fontSize = '36px';
}
// Adjust image size for mobile
if (wixWindow.formFactor === 'Mobile') {
$w('#image').style.width = '100%';
} else {
$w('#image').style.width = '80%';
}
});
Alternatively, if you do not want to invest too much time in doing the image optimization, I recommend trying Image Optimizer Pro- a Wix app that automatically compresses all media( Images and videos) with a single click for instant performance boosts. It compresses images up to 80% & converts to WebP for lightning-fast loading without losing quality. Helps in achieving better user experience and SEO rankings. It comes with a free plan as well for users. It also comes with comprehensive Reporting Analytics for issues are solved or not.