How to load another html file with small screen resolutions?

Question

HTML

There is a desktop version site, it is necessary that at a screen resolution of, say, 500px, another html document is loaded. With styles, everything is clear, they can be combined and much more, but what to do with html?

Answer 1

Either a JS script is fired first on the page, which decides which html to load, or the server part generates the required html depending on the client's screen resolution.

Answer 2

Let's say this:

<script>
    if (window.innerWidth <= 500) {
        location.href = '/mobile.php';
    }
</script>

If the width of the window is equal to or less than 500 pixels, then there will be a redirect to the page/mobile.php