Referer is not quite the same as how it was. In recent years, the default behavior in most cases is for the browser to either send just the origin, or no referer at all.
"Origin" means no path, so the referer might tell me which search engine the user used, but not what search query was done. It's much better than in the old days, where I might even see someone's session ID in the referer.
YouTube got around this in the earlier days since the referer header didn’t sent query strings. Maybe if referer hadn’t existed, YouTube urls would look like /watch/ViDeOID
My web development knowledge is very limited. But isn't this the main method where simple websites (most static generators) used to decide if the user is browsing from a mobile or not and serve a version based on that?
I would appreciate it if someone explain what other things people do to tackle this, or if I'm completely wrong?
Although really they should be using a pointer media query. Lots of sites I see randomly turn into mobile versions on desktop as soon as you resize the window narrow.
The modern solution is to use CSS with media queries. You tell the client how the site is supposed to look on various screen sizes. The client applies the rules without leaking any information about which rules it chose to apply.
The server now needs to respond with the Accept-CH header specifying it wants the client to send the mobile client header by including the "UA-Mobile" value. A compliant client will then send the Sec-CH-UA-Mobile header in its next request with either the value "?0" or "?1".
You have to do a split approach. Last I knew only Chrome-based browsers support the new UA headers. Firefox and Safari only support the User-Agent header which you have to check for the presence of "Mobi".
I agree that user agent is not the best idea but it helps endlessly when you need to find out what browser a non techy person is using - just ask them to go to one of the endless sites that tells you what browser you're using based on the user agent string.