[아이폰] 아이폰 X에 최적화 된 웹사이트를 만드는 법

[리버모륨]

ㅋㅋ...

출처 : https://webkit.org/blog/7929/designing-websites-for-iphone-x/

[Plenty]

...?!

[플라네튠 교회직원]

이럴거면 베젤리스가 무슨 의미야

[루리웹-833313094]

쿡의 잡 저격

[masa]

아이폰 X-2 가 나올 수 있을지조차 의심된다

[제트]

아 하긴 가로 볼 땐 의외로 많이 거슬리겠구나....

[제이C]

저게 뭐얔ㅋㅋㅋㅋ 저 빨강색까지 다 쓰게끔 해줘야짘ㅋㅋㅋㅋㅋㅋ
그리고 아래 홈버튼제스처막대는 그냥 반투명으로 나타나게 하고 중앙부분만 드레그 하면 홈으로 가게끔 하면 될것을..
뭔 동해서해남해냐;;

[크로스경사]

[이브레스]

프리 사이즈 모르는 건가
아이폰 x에 맞출바에 그냥 프리 사이즈가 나음
아이폰 x는 애플에서 알아서 해결 해야지 웹 개발자들이 해야할 일은 아님

[KRP-0]

지금 이걸 웹킷이라고 올린건가...?

[Kesper]

실화냐?

[유리고양]

딱 저사진만 보셔서 오해가 많은 것 같은데, 아이폰X에 맞춰서 설정되지 않은 웹사이트는 사파리가 알아서 좌우 조여서 표시해주고 바깥쪽 영역은 배경처리를 해줍니다... 링크 내용은 어떻게 바깥쪽 영역을 활용하면서도 사용자 경험을 해치지 않을 배치를 하는가에 대한 내용이에요.

[대추아가씨]

어차피 다들 내용엔 별로 관심없어서

[MattHard]

음... 링크 내용은 정확히 말해 세로모드일때 좌우랑 하단 홈스크린 인디케이터를 피해 웹의 컨텐츠를 배치할수 있도록 iOS11 웹킷에 추가한 기능을 설명하는 내용입니다.
링크의 예시를 보면 별다른 처리가 없을 경우 님 말씀처럼 좌우는 자동으로 비워주지만 하단의 인디케이터는 그냥 겹쳐버리죠. 좌우도 웹사이트의 head나 body의 백그라운드 컬러 css를 따라간다고는 하지만 그런식으로 배경색을 지정하지 않은 사이트도 좀 많아서 완벽한 방법은 아니구요.
결국 좌우아래쪽 영역과 조화롭게 컨텐츠를 구성하려면 전용 코드를 사이트에 추가해야한다는 내용인데.... 웹개발자입장에서 그리 반갑지는 않을듯하네요.

[세피넬리아]

이미 저런걸 신경써야 하는 시점에서 삽질이라는게 문제.

[내용증명]

..

[내용증명]

[노무현과문재인]

세로가 긴걸 가로보기 해놓고 까는건가...

[프로필UP]

ㅋㅋㅋ 진심 이번 X는 노답이다. 아무 생각없이 만든듯. 베젤리스가 무슨 의미가 있니. 내년엔 디자인 바뀔듯.

[무적 보노]

아이폰x는 저 탈모디자인 하나로 구입하지 말아야할 이유가 충족되네요.
남들은 베젤을 없애려고 하고 있는 상황에서 무슨 생각으로 저렇게 만든건지..

[루리웹-725545785]

원래 안 사실 분인거 압니다.

[csharp]

아이폰3gs 부터 다 만족하고 써왔는데 이번 x는 정말 극혐이네요. 기존 아이폰 스타일로 홈버튼 유지하고 출시하는게 더 좋은데

뭔 안드로이드 마냥 그지같은건 다 따라하고. 아이폰8이 더 낫구만. 웹페이지를 무슨 아이폰x에 최적화시켜서 만들어. 웃기는 소리지.