All iPads Landscape or Portrait Mode - what is most common?

[ufgatorvet]

Hello Forum and especially any web/website designers reading -

I am having my small business website redesigned from the ground up and while testing it, there are "scaling" or "responsiveness" formatting errors that I have brought to the attention of the web developers. I am not happy with their response, and even question the accuracy of it. Here is a cut/paste of their explanation:

"iPads, and almost all other tablets, are built to be used primarily in portrait mode. Landscape mode is really designed for videos, movies, gaming, etc. That doesn’t mean people don’t use landscape mode to browse the web, it just isn’t the primary intent of that setting. This is why so many websites or apps don’t rotate at all when using an iPad or tablet.

When we talk about using “responsive design” or optimizing a site for different devices, it isn’t just a setting you turn on or off. You have to add code to each element of the site at all the various screen sizes or “breakpoints.” This is part of our build process. We identify the breakpoints to adjust for and build the site accordingly. Modern design frameworks (like Elementor/WordPress, which we’re using) and developer tools have standard breakpoints built in as reference points which allow us to test and optimize for the most common devices. There are so many other ways (outside of “standard”) that someone could view a website: zoomed in, using a larger text size on their phone, casted onto a large TV screen, or even in landscape mode.

So to summarize, landscape tablet mode is a whole new breakpoint that has be created on a website and then designed for. This is why so many apps specifically have an iPad version and an iPhone version—things need to be coded differently. There isn't an easy coding fix that will change the look across the board without risking the way the site looks on other devices, including small laptops."

I question the accuracy of the statement that most people with iPads use it in portrait mode.

With my magic keyboard, I never use my iPad in portrait mode. In fact, I think the last time I used it in portrait mode was when I was in iBooks (like, years ago). I keep my iPad in "non-rotate" mode in fact, to keep it in landscape. They imply that using a tablet in landscape mode is "not standard". Thoughts?

Does the majority of the world use their iPad in portrait mode when browsing the web?

Any web designers want to let me know their thoughts about this?

It's frustrating to me because the iPad is the most commonly used consumer tablet in the US, and (my opinion) landscape mode is the most common way to use it, yet my site hasn't been designed to work correctly with the most common. Yes, they can fix it, but it is beyond the "scope of the project" and will now cost me more.

Thanks for infusing any sanity into what has been a tedious, terrible, time-consuming and frustrating process. I should have vetted the design company more thoroughly, that's my bad.

 

[sparksd]

Mini 6 & M1 12.9. I only use portrait mode when an app forces it - and then I usually don't like it.

 

[Loge]

I have always used iPads in portrait mode when web browsing. It feel like the natural way for reading. I'm not usually using an external keyboard.

 

[rich06]

Speaking as a web developer (not a designer) a red flag for me is that as (presumably) professional web designers they are using Elementor which is page builder software which can limit what can be done with a site... anyway, having said that a 'responsive design' should render the pages correctly on all devices in all orientations. To me it sounds like they've forgotten to cater for phone/tablets in landscape orientation in their css breakpoints and are trying to make you pay for it...

I'd stick to your guns on this

 

[Mark Stone]

I use an M1 Air, 99% in landscape because of the Magic Keyboard. Look at it this way: if a person uses an iPad in Portrait, and an app calls for landscape, no big deal - but if using the iPad with a keyboard (landscape) and the app calls for portrait, it’s a bit of a pain.

 

[BhaveshUK]

You need a new website designer. They are correct about designing for breakpoints, but it’s something they should have planned for in the design from the get-go.

It sounds to me like they’re taking shortcuts in their design process to maximise their profit, or are going to nickel and dime you for basic things that should be included in the original contract.

Source: I’ve designed websites for clients.

 

[JPack]

Landscape mode 99%.

My monitors are landscape, my notebooks are landscape, my Tesla is landscape, my TV is landscape.

The only time I hold iPad in portrait is if I need to type something very fast with the keyboard.

 

[HDFan]

Stage manager and multi tasking don't work as well in Portrait mode. Seems to me that they are designed for landscape mode.

Agree that landscape mode would require modified coding than portrait if you want it to look nice. Using an iPhone app on an iPad in the 2x mode isn't ideal even just in portrait mode.

 

[Isengardtom]

Usually landscape mode

few exceptions :
- Some games (on Apple Arcade) are portrait mode
- occasionally web browsing can be nicer in portrait mode

 

[Pixels7]

My old iPad (6th gen) I’ve always used in portrait mode, except when watching movies. But since I have an iPad Pro that has stage manager, I’m using it in landscape mode and I’m annoyed by apps who don’t support landscape mode.

Only in Lightroom I sometimes use portrait mode, when my photograph is taken in portrait mode. Otherwise it’s displayed smaller.

And in GoodNotes I sometimes use portrait mode, because my journal is in portrait mode. And then the pages are displayed fully.

I think it’s weird that your webdesigner will charge you more to make your website acting like all websites do these days (look good in landscape and portrait mode and on all most used devices/displays). But I haven't worked in the graphic design world for over 10 years, so maybe I'm wrong.

 

[SalisburySam]

Landscape, 100% on my iPadPro. I’ve installed an app from time to time that only works in portrait. After finding that out, I usually delete the app. One of these was the Tesla app for my car, an app that I frequently use from my iPhone. I deleted it. Then they announced the app would work in landscape mode, I reinstalled, and it works fine.

My iPad is very much used, several hours per day. It is in a Logitech case with keyboard so just never in portrait mode.

My wife uses her iPadAir similarly. Her case does not have a keyboard but she’s in landscape mode exclusively. This is so natural coming from desktops and laptops all of which are landscape-oriented devices. Only the smartphones are used primarily in portrait mode, maybe to be held in the hand as a dumb phone would be?

At any rate, I agree with @BhaveshUK: you need a new developer. If anything, I’d expect portrait mode on an iPad to be the extra-cost option, not landscape. Theirs was a silly, and wrong, response.

 

[Abazigal]

I typically use safari in portrait mode on my iPad, in part for the extra vertical screen space because many websites aren't really optimised for a widescreen anyways. I will occasionally turn it into landscape mode to make certain menubar appear, but will then revert to portrait afterwards.

 

[Mr Todhunter]

I can’t remember the last time I used landscape mode. Must have been 5 years ago, or more. But then again I never watch movies or Youtube on my iPads

 

[FreakinEurekan]

I’m always in Landscape mode on my iPad Pro because of the Magic Keyboard. I expect this is common for others like me that use iPad as a laptop replacement.

I have a tendency to use my iPad mini in landscape too - possibly because it’s familiar from my Pro. I mostly switch to Portrait only when reading a book - and even then only around half the time.

 

[one more]

Landscape mode almost exclusively, as I use Apple’s Smart Folio.

Yes, something dodgy about your website designers, as all modern WordPress themes (which they mention) are optimised and use “responsive layout”, adapting itself just fine to any screen size.

 

[xraydoc]

Portrait mode except for when in my Magic Keyboard case.

 

[CharlesShaw]

Landscape 100%, except for the mini 6 which stays locked in portrait mode.

 

[ufgatorvet]

When I open the site on Safari on my iMac, and slowly manually reduce the the screen size by dragging at the corner, it does not "scale" or "resize" accurately. I brought this to their attention, and here is the reply.

"You mentioned that you found some of these issues when dragging your browser window and noticing when things get "cut off." This isn't a sustainable way to test a website since there are thousands of different "break points" to accommodate. It simply isn't practical to optimize a website for every possible breakpoint, so instead, best practices are to identify the most common screen sizes and optimize for those specific sizes. Desktop and mobile remain the most important to optimize for, whereas tablet traffic makes up about 2 - 3% of all web traffic."

Am I testing their work incorrectly? Being too picky?

I've tried many websites (including MacRumors) and they all seem to handle the process of dragging the window into different sizes.

And ...

"Responsive design is about creating a flexible and fluid layout that can adapt to a wide range of screen sizes and resolutions, rather than focusing on every single breakpoint. This means that the website should look and function well across a broad range of devices, without needing to account for every possible breakpoint. We have thoroughly tested the site and ensured that it is optimized for the most common screen sizes and resolutions."

I don't know anything about web design, should this be my expectation? For a $9K website, maybe I just expected more than technology can deliver in 2023. ?

Thanks for the comments, or just listening!

 

[BhaveshUK]

When I open the site on Safari on my iMac, and slowly manually reduce the the screen size by dragging at the corner, it does not "scale" or "resize" accurately. I brought this to their attention, and here is the reply.

"You mentioned that you found some of these issues when dragging your browser window and noticing when things get "cut off." This isn't a sustainable way to test a website since there are thousands of different "break points" to accommodate. It simply isn't practical to optimize a website for every possible breakpoint, so instead, best practices are to identify the most common screen sizes and optimize for those specific sizes. Desktop and mobile remain the most important to optimize for, whereas tablet traffic makes up about 2 - 3% of all web traffic."

Am I testing their work incorrectly? Being too picky?

I've tried many websites (including MacRumors) and they all seem to handle the process of dragging the window into different sizes.

And ...

"Responsive design is about creating a flexible and fluid layout that can adapt to a wide range of screen sizes and resolutions, rather than focusing on every single breakpoint. This means that the website should look and function well across a broad range of devices, without needing to account for every possible breakpoint. We have thoroughly tested the site and ensured that it is optimized for the most common screen sizes and resolutions."

I don't know anything about web design, should this be my expectation? For a $9K website, maybe I just expected more than technology can deliver in 2023. ?

Thanks for the comments, or just listening!

OP, being frank, I feel you're being taken advantage of as a small business owner without industry knowledge.

• Platform choice. Before I even consider the actual website design for a client, I ask about their requirements to ascertain which platform is going to work best for their day-to-day needs. Usually, I steer most small business owners away from WordPress (unless they require a specific integration) because it is far too complex for them to manage whilst running a full-time business. Options I'll usually provide a small business as recommendations to consider are SquareSpace, WebFlow and Shopify (E-commerce specific). I recommend WordPress for medium to large businesses that will have the capacity to update plugins, maintain security, etc.

• Pricing of $9k. I recommend small business owners keep their website budget for the initial build smaller. That way we can work together over months or years to continually update the website as we begin to recognise customer usage patterns. If I was designing a small business website on SquareSpace for example, I'd state a price of £500-1500 for our initial build depending on the number of pages which need to be designed, customisation requirements and number of meetings/ touchpoint. We'd work together to push out that initial build, and if you were happy to continue working together, as you require updates to the website, I'd give you a pricing for those changes. WebFlow and Shopify pricing is usually higher as the design requirements on those platforms tend to be a lot higher.

• Responsive design. They are correct that responsive design is about flexible and fluid layouts. When you drag the browser size smaller and smaller, customers expect the website to adapt accordingly. However, only designing for the most popular breakpoints is bad practice, and will leave your customers unsatisfied. With modern design tools, there is very little reason your website should not be fully responsive. Speaking specifically about WordPress, I recommend researching tools such as Oxygen Builder, which will highlight the technology is there to produce gorgeous website designs that are fully responsive.

 

[Gregg2]

I prefer landscape mode, and use it unless
1) A game requires Portrait mode, and I don't like being forced to use it.
2) Responding to an e-mail, because the "keyboard" overlaps the message area.

I use Safari exclusively in landscape.

 

[ufgatorvet]

OP, being frank, I feel you're being taken advantage of as a small business owner without industry knowledge.

• Platform choice. Before I even consider the actual website design for a client, I ask about their requirements to ascertain which platform is going to work best for their day-to-day needs. Usually, I steer most small business owners away from WordPress (unless they require a specific integration) because it is far too complex for them to manage whilst running a full-time business. Options I'll usually provide a small business as recommendations to consider are SquareSpace, WebFlow and Shopify (E-commerce specific). I recommend WordPress for medium to large businesses that will have the capacity to update plugins, maintain security, etc.

• Pricing of $9k. I recommend small business owners keep their website budget for the initial build smaller. That way we can work together over months or years to continually update the website as we begin to recognise customer usage patterns. If I was designing a small business website on SquareSpace for example, I'd state a price of £500-1500 for our initial build depending on the number of pages which need to be designed, customisation requirements and number of meetings/ touchpoint. We'd work together to push out that initial build, and if you were happy to continue working together, as you require updates to the website, I'd give you a pricing for those changes. WebFlow and Shopify pricing is usually higher as the design requirements on those platforms tend to be a lot higher.

• Responsive design. They are correct that responsive design is about flexible and fluid layouts. When you drag the browser size smaller and smaller, customers expect the website to adapt accordingly. However, only designing for the most popular breakpoints is bad practice, and will leave your customers unsatisfied. With modern design tools, there is very little reason your website should not be fully responsive. Speaking specifically about WordPress, I recommend researching tools such as Oxygen Builder, which will highlight the technology is there to produce gorgeous website designs that are fully responsive.

Thank you very much for your thoughts and time.

Here is the latest email reply from the marketing firm:

"We did implement a workaround and hope this helps change what you are seeing on your iPads. Our developer has added a landscape mode breakpoint to to the website and tweaked pages in the areas you called out. This should help things look as normal as possible in landscape mode. This is our absolute best option without manually redesigning every element of the site.

At the end of the day, of course, this is your website and we want you to be satisfied with the finished product. If you would like, we can scope out this additional work and provide you with an estimate and timeline. Please let us know if you would like to explore that."

What do you suppose a "workaround" means? Should this be an acceptable fix? Could this "workaround" fail if future devices have slightly different screen sizes, dimensions or ratios?

I appreciate the collective wisdom of the group.

 

[Pakaku]

Websites can scale to different sizes of regular desktop windows just fine, so there should be no reason that wouldn't be possible on a tablet either. Whoever your website's UI designer is sounds lazy and not willing to actually do their jobs.

 

[H_D]

For a website, most iPadPros fare quite well with the smallest regular Website breakpoint, depending on the design, and the browser usually these days prefers the desktop version. Some site designs require a special landscape breakpoint to deal with things in the design of the site that have not considered a touch-interface (no hover etc) but basically the CPU is powerful enough these days to use desktop on iPads. It might make sense on the mini, but that I think is rrrrrreally used in portrait mostly and can handle the same portrait breakpoint as the Pro iPads. It’s a matter of budget. When it’s tight the landscape phone and tablets are the ones to omit, as the portrait versions are important. Depending on the design iPad portrait can serve well as smartphone landscape as well.

 

[mebehere]

Landscape. Everything should be landscape. Especially videos. I hate portrait videos. Portrait videos would make our favorite movie directors kill themselves.

 

[tarsins]

Always in landscape unless an app forces portrait.