Redirect mobile users to a site designed for smartphones

My problem

I just created a website with HTML and CSS. I noticed, that it looks horrible on mobile devices. Convince yourself here.

Possible solution?

I don't have much experience with coding websites and netlify.
As I googled I found a solution called viewport. I tried it but it didn't help much. Acctually it made it worse.

So I think I have to write a new site for mobiles and redirect all mobile users to it.
How do I achieve that?

I am also curious if anyone knows how to make the ".html" vanish. But thats just a random thaught.

I hope I posted everything in the right section etc.
Also, I thank everyone who can help me in advance!

hi @Akorian - making sites that are accessible for mobile devices is actually really important, as it makes things a lot more accessible!

There isn’t a good way to achieve this with redirects, because plenty of well-known ways to do this with CSS exist that are a lot more reliable and take up a lot less server resources (and are less work) thank building duplicate sites.

This isn’t a CSS support forum, so researching this is something you’ll have to primarily do on your own, but this is a well-made series on responsive design that also covers media queries. You can watch it here:

Thank YOU!
This was a bit tedious work I had do do now but the site doesnt look awful anymore!

1 Like

also you learned a really useful skill for life! Good work! :muscle: