Apple Shares Tips on 'Designing Websites for iPhone X'

POST

MAIL

Posted September 23, 2017 at 1:27am by iClarified

Apple has posted several tips for developers to help them design websites that look good on the iPhone X.

Your website can make use of a few similar new pieces of WebKit API introduced in iOS 11 to take full advantage of the edge-to-edge nature of the display.

The first new feature is an extension to the existing viewport meta tag called viewport-fit, which provides control over the insetting behavior. viewport-fit is available in iOS 11.

After adopting viewport-fit=cover, the next step is to selectively apply padding to elements that contain important content, in order to ensure that they are not obscured by the shape of the screen. To achieve this, WebKit in iOS 11 includes a new CSS function, constant(), and a set of four pre-defined constants, safe-area-inset-left, safe-area-inset-right, safe-area-inset-top, and safe-area-inset-bottom. When combined, these allow style declarations to reference the current size of the safe area insets on each side.

To deal with a safe area inset of 0px when the iPhone is held vertically, Apple suggests using brand-new CSS functions min() and max() which will be available in a future Safari Technology Preview release.

example: padding-left: max(12px, constant(safe-area-inset-left));

in portrait orientation, constant(safe-area-inset-left) resolves to 0px, so the max() function resolves to 12px. In landscape, when constant(safe-area-inset-left) is larger due to the sensor housing, the max() function will resolve to that size instead, ensuring that the important content within is always visible.

More details at the link below...

Read More

Apple Shares Tips on 'Designing Websites for iPhone X'

Follow iClarified

MyOpinionCounts - September 26, 2017 at 6:47am

The notch was and is a terrible idea, plain and simple. It’s an engineering failure to implement new functionality in a way that respects the basic principals of good design. So engineering failed and now expects software to provide a stupid “patch” to make the phone usable. This goes against one of Apples core principles of providing visual and functional harmony between hardware and software. The iPhone X notch is an embarrassment and Apple’s top priority should now be to get rid of it. This is what happens when you “chase” instead of “lead” in this industry. Other companies forcing Apple to ship half baked ideas just to keep pace with the competition who are innovating at the pace of market demands instead of following slowly behind the pack as Apple has done in recent years.

Reply · Like

Me - September 23, 2017 at 9:28pm

I dislike lots of things that Apple does and how it does them. Still it's ways better than anything out there. The Notch and round bezels actually are hate-cute things for me. And since I'm not even considering 8/8 they can have my money today.

Jake Allen - September 23, 2017 at 1:55pm

You said, to yourself as you looked in the mirror.

Duster - September 26, 2017 at 6:00pm

Apple fan boy. Do you have eyes? A am a graphic designer and i think this knot is standing in the way.

Brianswilt - September 23, 2017 at 5:57am

Small business owners all during the globe are struggling with a decision. Should they buy website traffic to boost their business, or would it only give those numbers and not results? To put things simply, if someone decides to buy website traffic without working using a SEO Company beforehand, it's not not for you to give them the finest outcome. You will find there's reason why a decent number of visitors are so cheap, inside this device . because they are virtually useless if not applied smoothly. We can buy website traffic from medium of pop-up ads. Whenever a customer opens a window in a site that we have obtained traffic from, a pop-up window when it comes to our website opens up and using this method people might visit our website and increase the traffic. This can make it settle down ! content quite possibly syndicated by other websites and is actually a why it is vital that get interesting headlines for customers. Another important point in the game to raise website traffic is linking with regard to your site. You build your site's reputation and authority as more sites connect to you. Also, the better the sites linking to you and which link to, the better your ranking. Are usually several programs and Seo services you make use of to increase website traffic with backlinks, but you can build them yourself also. I conscious you have often heard about banner advertising and I understand you are usually planning that I'm talking of this. But this underground secret source is much cheaper and way better and targeted than banner ads. I need not explain a person how untargeted and how costly banner ad campaigns are since i have tested it all the time. There are far numerous free methods to get online traffic for web page or net. All you must do is to think about intended for and quickly implement numerous ways of having absolutely free visitors. The issues with that is that they will turn out to be the costly visitors you will get because you will have a lot of trouble identifying how create profit these people. pay per click vs adwords