Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Designing Websites for iPhone X

webkit.org

Post reply on HN
Print view View original

91–100 of 135 posts

Re: Designing Websites for iPhone X

#91

Post by tapoxi »

amrrs wrote: post #77
pbreit wrote: post #56

Earlier quoted context omitted.

OK, I'll say it: this would not have happened under Steve.

Yes, Because Steve Jobs is akin to Jeff Bezos, can run a company focusing on consumer needs rather than lust for wall street. While Tim Cook's job is running the company from Front while also giving hope the shareholders much of what Ballmer Schmidt did. Maybe this is high time for us to get over this thought, Oh Steve wouldn't have done that. In fact, Steve launched the iPod with a scrolling ball. Steve launched an…

Steve didn't launch Newton, it came out in '93. He did kill it though.

Re: Designing Websites for iPhone X

#92

Post by SiVal »

ynniv wrote: post #46
YooLi wrote: post #8

Out of the box, Safari displays your existing websites beautifully on the edge-to-edge display of the new iPhone X. Content is automatically inset within the display’s safe area so it is not obscured by the rounded corners, or the device’s sensor housing. Default behavior is for you to do nothing to your code and Safari on the X will automatically pad around the inset and rounded corners. This is just if you _want_ t…

Device specific extra pixels were a bad idea. Further modifying web design standards to account for them is making the problem ten times as bad. Where's the CSS declaration that tells Safari to make those pixels black so no one has to care about this? Unplanned sections of background color around your header bar is not "displaying existing websites beautifully".

Whether or not Apple does this, others will. The web platform needs a well-considered generic approach to non-rectangular displays to support a widening array of devices: watches, medical devices, decorative displays, industrial controls, e-paper-type displays wrapped around a pipe, etc. They could have multiple panels of different sizes, have holes in the middle (not just the edge), be extremely curved, or whatever.

I'm fine with learning new, standard techniques for dealing with a broadening range of opportunities, but it's annoying to have to learn and incorporate Apple-only technologies in my web apps. But if the standard platform doesn't have a solution, Apple will solve it themselves.

Re: Designing Websites for iPhone X

#93

Post by alwillis »

mikeash wrote: post #72
johansch wrote: post #68

Earlier quoted context omitted.

A lot of things wouldn't have. Top of my list: a) keeping the macbook air non-retina (for like five years after PC laptops were retina, even after the incremental cost for the feature was very, very close to zero due to industry-wide cost reductions in display/chipset tech) b) shipping the new macbook pro with the touch bar c) shipping the new macbook pro with that keyboard that just breaks down when used outside of…

e) Making product lineups huge and confusing. Once the X becomes available, they'll have eight different models of iPhone you can buy, and that's not even counting different colors or storage options.

Making product lineups huge and confusing. Once the X becomes available, they'll have eight different models of iPhone you can buy, and that's not even counting different colors or storage options.

What iPhone you get is driven by the economics of what you can afford and your personal taste. It's not that complicated.

There are 5 models:

- iPhone SE - iPhone 6s/6s+ - iPhone 7/7+ - iPhone 8/8+ - iPhone X

It seems that Apple can't win even when they do what most people have wanted for a while: more options at more price points.

If you want to be confused, try to pick among Samsung's phones, some of which are only available on certain carriers or in certain countries and running different versions of the Android operating system.

From the SE to the iPhone X, they all run iOS 11.

Re: Designing Websites for iPhone X

#94

Post by alwillis »

chis wrote: post #85
dylan-m wrote: post #19

I was ready to be annoyed by this, and it is a ridiculous design, but the article is a pretty good discussion of CSS's round display extensions. Those have been sort of sitting around gathering dust as far as I can tell, but the idea seems pretty cool and potentially useful. I like that they're proposing a safe area constant, which makes a lot of sense. This is a really great way to see it all actually working and fi…

Yeah it is surprising to see such a hacky design when they literally only had one use case. I also don’t understand why all browsers are adding css properties just to support the new iPhone, but maybe I don’t understand how this committee works.

It's not just for the iPhone X.

There are browsers in refrigerators, e-readers, game consoles, smart TVs, kiosks and who knows what else. There will be lots of devices that can take advantage of these new properties, not just the iPhone X.

Re: Designing Websites for iPhone X

#97

Post by sschueller »

modzu wrote: post #3

just no.

Sad thing is I won't the the option to say no because some customer is going to complain that that his site doesn't work on his iPhone X and that some other websites work fine.

Thanks Apple for yet another item we have to deal with because your "special". /s

Re: Designing Websites for iPhone X

#99

Post by arrty88 »

alwillis wrote: post #75
amelius wrote: post #47

Earlier quoted context omitted.

But in any case you can do that by making your website a little smaller on iphonex screens. That's not the problem! That's one line of CSS. The problem is that now we are expected to design for this non-rectangular screen, taking "advantage" of the little gaps at the sides, and perhaps fill them with little buttons in creative ways. So that's the real problem. This will cost us (developers) extra time. Instead, I thi…

This will cost us (developers) extra time. I just added 'viewport-fit=cover' to my project and boy am I tired! ;-) In the words of Aaron Rogers: relax. The CSS frameworks (Foundation, Bootstrap, etc.) will have this baked in the next time they're updated. Compared to the drama we as web developers have dealt with in the past, this is pretty minor. Apple gives you the CSS you need: @supports(padding: max(0px)) { .post…

How many websites do you manage? How many wordpress installs and custom themes have to be updated?

Re: Designing Websites for iPhone X

#100

Post by alwillis »

SiVal wrote: post #92
ynniv wrote: post #46

Earlier quoted context omitted.

Device specific extra pixels were a bad idea. Further modifying web design standards to account for them is making the problem ten times as bad. Where's the CSS declaration that tells Safari to make those pixels black so no one has to care about this? Unplanned sections of background color around your header bar is not "displaying existing websites beautifully".

Whether or not Apple does this, others will. The web platform needs a well-considered generic approach to non-rectangular displays to support a widening array of devices: watches, medical devices, decorative displays, industrial controls, e-paper-type displays wrapped around a pipe, etc. They could have multiple panels of different sizes, have holes in the middle (not just the edge), be extremely curved, or whatever.…

Apple is using W3C blessed standards:

* https://github.com/w3c/csswg-drafts/issues/1693#issuecomment...

* https://drafts.csswg.org/css-values/#calc-notation

* https://www.w3.org/TR/css-round-display-1/#viewport-fit-desc... (Apple is doing the meta tag version of the @viewport descriptor)

Post reply on HN