Forum Moderators: phranque

Message Too Old, No Replies

redirecting website based on screen size

Got a website html

         

bwnbwn

3:12 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I manage 1 website it's small 10 products its html so I have a www version and a m. version.
I redirect by browser size from www to m. so desktop laptops and iPad s get www phones get m.
My question is because the site has gained so much new traction I am seeing links in m. and www. being posted in social media.
If a desktop lands on mobile the navigation to products is harder but it can be done just harder
Should I have the same redirect set in the m. version to redirect to www based on browser size?

lucy24

4:23 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Some sites have a little popup that says something like “This site is also available in a desktop version” with an option to be redirected or not. It will require a tiny bit of scipting and you have to check a cookie.

bwnbwn

7:35 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Lucy thought about that I hate pop ups with a passion.
Would you redirect? I have images on m. version a desktop can find the products just have to scroll down a little

lucy24

8:52 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



If it were me, yeah, I’d just redirect without asking. The only problem I envision is if someone's got accessibility issues and they deliberately chose to view the mobile version on their full-size device.

JorgeV

9:28 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member Top Contributors Of The Month



Hello,

You can add a piece of javascript, which tests the screen size ( window.screen.height;
window.screen.width ) and redirect to the appropriate version.

However, I think that you should invest in making a single site, with responsive design.

bwnbwn

10:40 pm on Jul 30, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Jorge V thanks but this way works really good. I have been with them 18 years about 8 years ago they decided to hire someone to do that. No problem I was working full time and just did their site because owner is a good friend.
At that time the site had 1st page keyword places for many terms. This is a specific not high traffic type of product. Tried to help new webmaster do the change with as little damage as possible. Well long story he chose not to and the site tanked bad. 7 months latter they asked me to take it back. Sales fell 85% and site rankings we at page 50.
I went back to my old site it has taken me 7 years to get it back to 1st and 2nd page listings. Did away with ad words and now at 20k a month in sales.
I don't think so on your suggestion. :)

Lucy I will test the redirect on m. to www as I have different statcounter accounts and can see how it works.

explorador

10:24 pm on Aug 24, 2020 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



If a desktop lands on mobile the navigation to products is harder but it can be done just harder
Should I have the same redirect set in the m. version to redirect to www based on browser size?

Not exactly the literal answer to the original question, but I do understand your scenario and there are ways to address this.

Yes I read you are not interested on responsive design, but wait. Responsive done right might be a nice solution for a one-site with multiple looks on different devices depending on how you want it to be.

- You could set up a responsive design Desktop + Mobile that adapts to the final device.
- Or build something more complex like FULLY different CSS for each version. Don't underestimate this, while many responsive designs work great on both worlds, there is a lot of markup being loaded that won't be used, and the selective resolution methods will still consume at least a bit of resources.

- Or something: two fully different websites, mobile and desktop as you describe originally. Here you have 2 options, as simple or as complex as you want it to be:

1. You could achieve it with Javascript as mentioned above by JorgeV, detect the screen size and then redirect the user to the version you want to present on the browser.
2. Redirect the user based on the User Agent + Operative System (without Javascript, pure server detection). This way you can identify iPhones, Android Phones, even tablets. The specific list can be as long and diverse as you want it to be, you can research about it and build that list yourself, or use some of the already identified combos on the web.

In the past I developed a CMS that would present the user one of two specific versions of the site, one fully mobile, ULTRA FAST and optimized for small screens, while the other would be for desktop and some tweaking in responsive mode for in-the-middle devices. That was amazingly faster than any other responsive design I created for my websites, later added extra functionality auto resizing pictures, and even optimization for Opera Mini (common among small and low powered devices). Javascript powered the shopping carts, same code for both versions.

It's doable, not super easy but possible if you can code, otherwise it's about searching or building it. Later moved away from this as in my case the amount of low powered devices wasn't that high and there was no need for such ultra optimizations. Besides... it also means two separate websites with different links for the same content, this introduces new challenges for SEO IMHO.