그동안 대부분의 웹사이트는 특정기기만을 위한 웹디자인을 할 필요성이 없었습니다 하지만 아이폰X는 다릅니다
당신이 웹페이지에서 아무런 대응을 하지 않을시 가로화면에선 이렇게 될것이거든요
그래서 Webkit에서 아이폰X를 위한 새로운 가이드라인을 제시하였습니다
링크의 내용을 충실히 따르면 당신의 웹페이지는 아이폰X에 최적화된 모습을 갖추게 될것입니다 심지어 가로화면에서도요
인터넷 / 소프트웨어
:
윈도우즈, 리눅스, 기타 운영체제, 각종 어플리케이션, 프로그램, 소프트웨어, 인터넷, 인터넷 서비스에 대한 이야기, 소식, 테스트, 정보를 올리는 게시판입니다.
소식
2017.09.23 23:27
아이폰X에서 당신의 웹사이트가 좋게 보이는 방법
| 참고/링크 | https://webkit.org/blog/7929/designing-w...-iphone-x/ |
|---|
-
이 얼마나 고맙고 관대한 처사인지.. -
끔찍하네요 정말. 저러면 베젤리스 할 의미가 있는지.... -
기글하드웨어는 아이폰 X에 최적화된 화면을 제공하지 않는다고 공식적으로 알려드립니다.... -
Kylver
2017.09.24 00:00
왜죠!!! -
비★밀이요.
-
어차피 적용할 부분도 없지 않나요? full-width nav바가 있는 것도 아니고, botton-fixed nav바가 있는 것도 아니고, 배경에 그림이 들어가거나 하는 것도 아니니... 그냥 viewport-fit=auto로 놔두면 되지 싶네요. -
?
공★식이요.
-
한국인의 절반을 무시하시는 처사!? -
구웨웩!! -
?
쿨피스엔조이님 축하합니다.
팡팡!에 당첨되어 5포인트를 보너스로 받으셨습니다. -
이거슨 낄피셜!! -
좋아요 +1 -
에라이 이젠 아주 웹사이트 보고 아이폰에 맞추라고 하네 염X...
정말 애플 제품만이 받을 수 있는 수준의 쉴드로군요. -
아이폰 X만이라고 하기엔 무리가 있는 게, 디스플레이의 형태나 (예: 원형 디스플레이 등...) UI의 형태 등 (예: 전체화면 컨텐츠에 오버레이되는 컨트롤 등...) 에 따라 safe area를 지정해줄 수 있는 specification이 웹킷에 추가되는 것입니다. 지금이야 아이폰 X밖에 없기야 하지만, 그리고 앞으로 디스플레이의 형태나 UI가 어떤 방향으로 발전할지는 저도 잘 모르겠지만 의미 있는 개선이라고 봅니다.
예를 들어, 엣지 커브드 디스플레이의 엣지 부분 등 자동으로 기기에서 정해주는 영역만큼 padding을 준다던가 할 수 있게 됩니다. 지금까지 엣지 스크린을 사용한 제품이 나온지 좀 된 것 같은데, 오히려 Webkit 개발의 선두에 있는 애플이 아이폰 X를 냈기에 이런 개선도 일어날 수 있지 않았는가 싶네요. -
오 이런식으로 볼 수도 있는거군요 -
?
필립님 축하합니다.
팡팡!에 당첨되어 10포인트를 보너스로 받으셨습니다. -
웹디자인을 직접 한 지는 좀 되었지만, 지금도 꽤나 관심있게 지켜보고 있습니다. 단순히 "몇 포인트 비워놓으면 됩니다" 나 OS 네비게이션 등으로 때우기 보다는 훨씬 더 나은 방법이기도 하고, 사실상 웹킷이 de facto standard가 된 상황에서 다른 기기에서도 활용성이 높아질 부분이지 싶네요.
-
?
마커스님 축하합니다.
팡팡!에 당첨되어 5포인트를 보너스로 받으셨습니다. -
?
엣지 커브드 디스플레이를 고려했다면 3 면이 아니라 4 면 모두 padding 를 줄 수 있는 형태로 가야 할텐데요.
지금 위 글에 나온거만 봐서는 3 면 패딩뿐인거 같은데.. -
4면 다 있습니다. css에서 constant() 로 User Agent에서 정하는 각종 상수를 호출할 수 있으며, 위 패딩의 경우 safe-area-inset-top 으로 사용.
https://github.com/w3c/csswg-drafts/issues/1693 를 참고하시면 더 도움이 될 것 같네요. -
아이폰 X니까 X같은 디자인이 필요한거죠! -
?
x같은 발상이네요
-
호무라
2017.09.24 10:51
저래도 어~썸, 슷꼬이, 용기다 저러니 원.. -
정말 굉장히 갱장하고 괭장하네요. -
?
디스플레이에서 베젤이 없어졌으니 대신 페이지에서 귀여운 베젤을 드리겠습니다
-
앗... 너무 부럽다... -
?
X같은 발상! X같은 디자인!
-
?
안해도 별로 상관없는거같은데...
-
뭐 어차피 아이폰 X 보기 좋으라고 하는 가이드라인이고 딱히 안 해도 보는 데 문제가 없긴 하죠. 정말 신경쓰는 사람들이나 바꿀 듯. -
Kylver
2017.09.24 23:43
저도 이게 맞다고 생각되네요. 궂이 맞출필요는 없죠.
-
아니 저 빨간부분까지 다 표시되게끔 해줘야지;;
저러면 보기만 이쁘지 실용성은 ...아이구 -
정말 X같군요! 좋은건가? -
근데 어차피 가로로 웹사이트 보는거보다 세로로보는게 많으니 안해도 상관없을것같네요 -
?
디자이너란 작자들이 강요하는 꼬라지를 보면 이 인간들이 두 발을 땅에 디디고 사는 인간인지 궁금해집니다.
작성된지 4주일이 지난 글에는 새 코멘트를 달 수 없습니다.
-
Read More
윈도우 11, 7z와 tar 압축 추가
윈도우 11 인사이더 프리뷰 빌드 25992에서 7z와 tar 압축이 가능해졌습니다. 또 압축 해제 성능도 개선됐습니다. 그리고 스냅 레이아웃에 추천 배치 기능이 추가됐습니다. -
Read MoreNo Image
왓츠앱, 광고 표시?
왓츠앱이 광고를 표시한다는 소문이 있는데요. 왓츠앱의 사장은 채팅에 광고를 표시하진 않지만 채널을 비롯해 앱의 다른 구역에 광고를 표시하는 건 검토 중이라고 밝혔습니다. 다들 카카오톡이랑 비슷비슷하게 가는구만요. 왓츠앱은 한... -
Read More
챗GPT의 서비스 중단, DDoS 공격 의심
챗GPT 서비스가 현재 월활하지 않습니다. 트래픽이 비정상적으로 늘어난 것이 원인인데, 오픈AI는 DDoS 공격을 받았을 것으로 추측하고 있습니다. -
Read MoreNo Image
가상화폐 채굴 GPU를 AI 연산에 활용하는 분산 컴퓨팅
Io.net이 DePIN이라는 분산 컴퓨팅 네트워크를 운용합니다. 전세계에 흩어진 GPU를 모아 AI 연산을 수행하는 것입니다. 여기에 사용하는 그래픽카드는 대부분이 가상화폐 채굴장에서 쓰다가 지금은 놀고 있는 것으로서, 대기 명단에는 107... -
Read MoreNo Image
애플, iOS/macOS의 버그 수정을 위해 새 버전 개발을 일시 중단
애플이 iOS와 macOS의 새 버전 개발을 일시 중단하고, 현재 남아있는 버그 수정에 집중했다고 합니다. 다만 일시 중단이라고 해봤자 이번 1주일 동안만 중단하는 것입니다. -
Read More
삼성전자, ‘삼성 AI 포럼’서 자체 개발 생성형 AI ‘삼성 가우스’ 공개
이번 포럼에서는 삼성리서치에서 개발한 생성형 AI 모델 ‘삼성 가우스(Samsung Gauss)’가 처음으로 공개되어 많은 관심을 받았다. 삼성전자는 ‘삼성 가우스’를 활용해 회사 내 업무 혁신을 추진하고 나아가 사람... -
Read More
챗GPT의 커스텀 버전, 128K 컨텍스트 버전, 유튜브의 AI 기능
오픈AI가 커스텀 챗GPT인 GPTs를 발표했습니다. 챗GPT 플러스와 엔터프라이즈 버전 사용자 대상으로 테스트를 진행 중입니다. https://openai.com/blog/introducing-gpts GPTs는 특정 용도에 맞춰 자신만의 챗GPT를 만들 수 있는 도구입... -
Read MoreNo Image
제 공유기로 7Zip 벤치마크를 돌려보고 싶은데 도저히 어떻게 해야할 지 감이 안 옵니다.
일단 제가 쓰는 공유기는 OpenWrt가 깔린 구글 온허브입니다. IPQ806x 기반이라 ARM a15 코어를 사용하기 때문에 MIPS를 사용하는 다른 공유기들보단 빌드가 쉬울 거라고는 생각되는데 리눅스를 전혀 모르다 보니 어떻게 해야할 지 감이 ... -
Read More
윈도우11 띄워쓰기 버그 해결 (반자-전자 넓은 띄워쓰기 좁게)
그나저나 이런 팁 글은 말머리 설정할때 일반이랑 분석 중 어떤게 더 적합하려나요? 윈도우11을 쓰다보면 위에 이미지 처럼 띄워쓰기가 2배로 넓어지는 버그가 있습니다. 한글 입력기에서 띄워쓰기 설정이 무언가 버그에 의해 반자... -
Read More
한컴오피스 뷰어 2024 광고프로그램 넣었다가 걸림.
https://hummingbird.tistory.com/6935 기업에서도 쓰는 프로그램에.. 광고 프로그램을...?? 한컴 드디어 베짱인가요..? 광고 프로그램이나 이런거 설치시 동의해야하는 항목이나 약관도 없엇따고 하네요. * 우선 10월 30일자로... -
Read MoreNo Image
디스코드, 파일 링크 유지 기간을 하루로 단축
디스코드가 자사 CDN을 악용해 악성코드가 배포되는 걸 막기 위해, 파일 공유 링크를 24시간 동안만 유지하기로 정책을 바꿉니다. 또 CDN에서 파일 호스팅이 계속 되지 않도록 막아 나갑니다. -
Read More
X, 방치된 계정의 판매 시작
X 내부의 @Handle Team이라는 곳에서 사용하지 않고 방치된 계정의 ID를 판매하고 있습니다. 정확한 조건은 다를 수 있지만 일단은 5만 달러의 수수료를 요구하고 있다네요. X의 운영 정책에서는 방치되어 비활성화된 계정은 해제해주지 ... -
Read More
xAI, 대화형 AI인 Grok를 발표
일론 머스크의 AI 회사인 xAI가 대화형 AI인 Grok를 발표했습니다. 330억개의 변수를 써서 훈련시킨 독자적인 대규모 언어 모델인 Grok-0에서 추론과 코딩 능력을 강화한 Grok-1을 사용합니다. HumanEval 같은 벤ㅊ치마크에서는 GPT-3.5... -
Read More
동행복권 홈페이지 외부 해킹 공격..개인정보 유출 가능성
동행복권이 해킹당한듯 합니다. 뭐 비밀번호 초기화하는 로직 같은데서 서버단 데이터 검증코드를 제대로 안 만든건지.. 저도 털렸네요.. 동행복권 홈페이지에서 복권 사셨던분들은 https://www.dhlottery.co.kr/customer.do?... -
Read MoreNo Image
CPU-Z, CPU 벤치마크에 부적절하다?
CPU-Z에 내장된 벤치마크가 CPU의 실제 성능을 구분하는데 부적절하다는 주장이 나왔습니다. 이 벤치마크는 CPU 캐시와 분기 예측을 테스트하지 않기에, 성능에 많은 영향을 주는 캐시의 성능에 벤치마크에 반영되지 못한다는 주장입니다....
고토_히토리
가네샤
카토메구미
