정보가 많은 웹 애플리케이션을 개발 중입니다. 이는 화면에서 사용 가능한 모든 픽셀이 UI를 피하는 데 많은 도움이된다는 것을 의미합니다. 너무 복잡해 보이고 관련 데이터를 표시 할 수 없습니다.
일반적인화면 해상도가 무엇인지 궁금합니다. 몇 년 전에는 1024 × 768, 하지만 요즘에는 훨씬 더 높은 수준이어야합니다. 저는 개발자로서 제가 사용하는 것에 의존 할 수 없으며 일반 Joe 사용자보다 더 큰 화면과 해상도를 가지고있을 것입니다.
그러면 어디에서 찾을 수 있습니까? 웹앱에 대한 현재 권장 해결 방법은 무엇입니까?
댓글
- 웹 마스터 사이트에서이 질문보기- webmasters.stackexchange.com/questions/2494/…
- ‘를 사용해서는 안됩니다. 결정을 안내하는 화면 해상도, 브라우저 창의 크기를 알아야합니다. 특히 모니터가 사람들이 브라우저를 전체 화면으로 볼 것이라고 가정 할 수는 없습니다 . 너무 커서 대부분의 사이트를 읽을 수 없습니다.
- 또한 고정 너비와 유동 레이아웃에 관한이 질문 을 참조하세요.
- 정적 매개 변수처럼 화면 해상도 측면에서 생각하면 시대 착오적으로 들립니다. @MonicaCellio는 요점이 맞았습니다. 애플리케이션에 대한 부동산 할당은 동적이며 사용자의 손에 달려 있습니다.
- 참고 : 반응 형 디자인이 증가함에 따라 많은 사람들이 애플리케이션을 고려하는 것도 중요하다는 사실을 깨닫게되었습니다. 좋은 최대 열 너비와 텍스트의 가독성은 종종 글꼴 크기에 특정한 콘텐츠 너비 (예 : 단색 텍스트 너비의 경우 35-40em )에 접근함으로써 보장 될 수 있습니다.
답변
전 세계 어디에 있는지에 따라 다릅니다. 전 세계 1366×768 가 여전히 가장 일반적이지만 1920×1080 는 실제로 테이크 업이 증가하는 유일한 해상도입니다 (아마도 이것이 최신 노트북의 표준 와이드 스크린 인 것처럼 보이므로).
StatCounter.com 웹 사이트에서 이에 대한 추가 정보를 얻을 수 있습니다.
어떻게 , 특정 해상도가 다른 해상도보다 더 일반적이기 때문에 실제로 사용자가 자신의 브라우저를 사용하는 폭을 고려하지 않습니다. 창. 안타깝게도이 통계에 대해 알려진 측정 값이 거의 없습니다 (Google 애널리틱스에서이 통계를 제공했지만 지원을 중단했습니다).
댓글
- 또한 이러한 종류의 데이터에 대한 전 세계 평균은 사용자 기반의 평균과 동일하지 않을 수 있습니다. 실제 사용자를 샘플링 할 때까지 ‘ 그들이 ‘ 무엇을 사용하고 있는지 모릅니다. 따라서 가장 좋은 방법은 레이아웃을 여러 (그리고 다양한) 해상도에서 작동하도록 디자인하는 것입니다.
- Android 및 iOS 스마트 폰 및 태블릿 간의 화면 해상도 분포에 대한 데이터는 해결 ‘ 섹션에서 opensignalmaps.com/reports/fragmentation.php 끝쪽 . 여기에서 편리하게도 화면 해상도는 노트북 및 데스크톱보다 스마트 폰 및 태블릿의 뷰포트 / 브라우저 창 크기에 더 가깝습니다. Android의 경우 불편하게도 플랫폼 ‘의 단편화는 화면 해상도의 광범위한 분포에 매우 뚜렷하게 반영됩니다. 이것은 아마도 모바일 장치에 대한 유동적 인 레이아웃을 만드는 것이 좋습니다.
- 업데이트와 마찬가지로 1366x768은이 답변이 게시 된 이후 1024x768을 상당히 추월했습니다.
- @DangerZone Good point . 슬프게도 StatCounter는 ‘ ‘ 현재 ‘에 대한 링크를 제공하지 않습니다. 날짜 범위 (따라서 수년 동안이 답변에 대한 여러 편집!) 나는 최신 통계로 답변을 수정했습니다. ‘ 1 년 정도면 똑같이해야 할 것 같아요!
답변
노트북과 데스크톱은 더 이상 웹을 사용할 수있는 유일한 기기가 아닙니다. iPad의 해상도는 1024x768이고 iPhone 4의 해상도는 가로 모드에서 사용한다고 가정 할 때 960x640입니다.
댓글
- Afaik the iPhone 4는 이전 480 * 320 해상도를 사용하는 것처럼 페이지를 렌더링합니다. 제 4 페이지의 크기는 ‘ 3GS의 절반이 아닙니다. 추가 해상도는 글꼴 / 이미지 렌더링에만 사용됩니다. ‘ m에 도달했습니다.
- 절대적으로 유효한 지점입니다. 960 pixsel 화면 너비는 데스크톱 화면 크기가 커져도 관련성을 유지합니다. 많은 핸드 헬드 장치에서도이 크기를 표시 할 수 있기 때문입니다.웹 사이트가 매우 넓을 때 (1600+) 읽을 수 없다는 사실은 말할 것도 없습니다.
Answer
최소 화면 해상도 선택은 제외 할 사용자 수에 따라 결정됩니다.
특정 사용자에 대한 해결 데이터 기록이없는 경우 한 가지 옵션은 공개, 글로벌 사용 통계 를 지침으로 사용하는 것입니다. 이러한 글로벌 데이터 소스 중 하나를 사용하여 데스크톱 화면 너비 상태를 한 눈에 전달하는 데 도움이되는 다음 그래프를 만들었습니다.
답변
“지금은 훨씬 더 높은 수준이어야합니다.”
여기에있는 모든 답변은 무시되는 것 같습니다. 모바일 세상 전체.
물론 데스크톱 화면이 점점 커지고 있습니다. 그러나 모두가 모바일 장치를 사용하고 있습니다. 이제 웹의 많은 부분이 휴대폰과 태블릿에서 액세스되고 있습니다.
적응 형 디자인은 실제로 취해야 할 길입니다.
댓글
- 예. 이것이 핵심입니다. 오늘날 많은 사람들이 휴대폰과 태블릿에서 웹 사이트에 액세스하고 있기 때문에 유동적 인 웹 디자인은 매우 중요합니다. 해결 추세는 확장이 아니라 단편화입니다.
답변
무엇이든 사용할 수 있습니다. “?
자바 스크립트를 사용하면 브라우저 창 크기를 확인하고 스타일 시트를 변경할 수 있습니다. 예를 들어 그래픽이 풍부하고 960 픽셀 열이있는 큰 이미지 배경이있는 경우 배경 이미지 1024-768을 실행하는 사용자에게는 필요하지 않으므로로드 할 필요가 없습니다. 또한 화면상의 공간을 최대한 활용하도록 글꼴 크기를 수정할 수도 있습니다.
답변
가장 많이 사용되는 해상도 2011 년에는 1280x800입니다. 인터넷 사용자의 18.09 %가이를 사용합니다.
다음은 2011 년의 상위 10 가지 해결책입니다. http://www.superiorwebsys.com/blog/93/Most_Common_Screen_Resolutions_in_2011/
댓글
- 참조 용으로 +1하지만 1024x768이 뒤쳐져 있고 두 가지 상위 해상도 중 더 낮습니다. 약간 낮은 비율에도 불구하고 더 높은 고려도.
- 1024는 잠시 동안 + 새 휴대 기기가 나올 것입니다. 따라서 신축성있는 디자인을 계획하고 있지 않다면이 해상도에 맞는 사이트를 디자인하는 것이 좋습니다.
답변
나는 웹 앱을 디자인 할 때 전체 화면 해상도를 기준으로주의해야한다는 Jon의 의견에 동의합니다. 그는 또한 768의 와이드 스크린 변형이 요즘 매우 흔하다고 말하는 경우에도 옳습니다.
최근에 저는 화면 해상도 정책을 낮추는 몇 가지 좋은 이유를 경험했습니다. 이제 TV와 멀티미디어 노트북은 HD 표준을 해상도로 사용합니다. 즉, 여러 사용자가 1280 × 720 를 해상도로 사용할 수있는 좋은 기회입니다. 768을 높이로 타겟팅하는 것은 많은 사용자에게 다소 어려울 수 있습니다.
답변
정적 레이아웃을 사용하여 책상 / 노트북 화면을 안전하게 사용하려면 최소 1024x768입니다. 하지만 더 나은 옵션은 유동적 인 (유연한) 레이아웃을 디자인하는 것입니다.
답변
Microsoft는 최근에 Windows 7 사용자를위한이 영역의 원격 측정 데이터 :
(적어도 업그레이드주기에있는 사용자의 경우) 4 : 3 대신 16 : 9 및 16:10 화면을 실행하는 수많은 사용자가 있음을 알 수 있습니다 (여러 사용자는 1366x로 실행 됨). 768).
댓글
- 내부적으로도 Microsoft가 모바일 환경을 무시하고있는 것 같습니다.;)
답변
예, 유연한 레이아웃을 고려해보세요. 사용 가능한 모든 픽셀을 사용하려는 경우 전체 화면을 가리는 것이 최선의 해결책입니다. 자바 스크립트를 사용해야합니다. ALA의 반응 형 웹 디자인 을 살펴보고 를 살펴 봐야합니다. 예 . 언제 이 예제를보고 브라우저 크기를 조정하고 콘텐츠가 어떻게 반응하는지 확인하십시오. 이렇게하면 웹 사이트가 데스크톱, 노트북, 휴대 전화 태블릿 등 모든 화면에서 멋지게 보일 수 있습니다.
댓글
- 이동할 때주의하세요. 사용 가능한 모든 픽셀을 사용하면 독자가 텍스트를 읽기가 더 어려워 질 수 있습니다.
답변
나는 1280 X 1024를 목표로 삼았는데, 레이아웃은 모바일 제약이 요인 인 경우 적응할 수있을 것입니다.
그렇지 않으면 일반적으로 분석을 따르고 가장 높은 해상도를 염두에 두려고합니다. 주어진 사이트.
답변
고려할 사항 :
- 이 앱은 누구를위한 것입니까? 내부적 인면 (예 : 기업 환경)이라면 IT에 문의하여 직원 화면이 어떤 해상도로 설정되어 있는지 확인하십시오. 특히 앱에서 가장 많이 작업 할 직원을 살펴보십시오.
- 그렇다면 ” 공개용 앱에서는 사용자의 해결 방법에 대한 데이터가 무엇인지 생각해보십시오. 재 설계하는 경우 현재 사이트의 분석을 확인하고 사용자가 실행중인 해결 방법을 파악하십시오. 여기에서 패턴을 발견 할 수 있지만 (즉, 사람들은 파워 유저이기 때문에 해상도가 매우 높은 경향이 있습니다.) “모든 곳에있을 가능성이 있습니다.
- 당신이 속한 데이터에 대해 생각해보십시오. 제시. “그리드가 많으면 유동적 인 레이아웃이 가장 좋습니다. 그러면 사용자가 필요한 데이터를 더 많이 표시하도록 화면을 늘릴 수 있습니다.
1024 용으로 디자인하는 것이 안전한 방법입니다. 그러나 결정을 내리기 전에 사용자에 대해 자세히 알아 보려고하지 않으면 게으르다.
답변
1024 * 768 는 여전히 상식으로 유지되어야합니다. 그렇지 않으면 실제로 청중에 따라 다릅니다. 예를 들어 디자이너를위한 웹 사이트 또는 앱의 경우 1680 * 1050과 같은 훨씬 더 높은 해상도로 최적화해야합니다.
테스트하거나 원하는 청중에게 요청해야합니다. 하지만 1024 * 768은 여전히 필수입니다!
이상적인 세상에서는 다양한 해상도와 장치에 대해 서로 다른 (CSS) 스타일이있을 것입니다. 🙂
댓글
- ” 예를 들어 디자이너를위한 웹 사이트 나 앱을 만드는 경우 1680 * 1050과 같은 훨씬 더 높은 해상도에 최적화됩니다. ” 대부분의 ‘ 디자이너 ‘는 iPhone을 사용합니다. .
- @ DA01-따라서 장치마다 다른 CSS가 있습니다.
- 도움이되지만 주로 ‘에 최적화 된 ‘. 이상적으로는 ‘ 모든 기기에 ‘ 최적화합니다.
답변
일반 프로젝터 해상도 :
- XGA = 1024 x 768 픽셀
- WXGA = 1280 x 800 픽셀
- HD = 1920 x 1080 픽셀
- 4K = 4096 x 2160 해상도
댓글
- 이 부분에 대해 자세히 설명해 주시겠습니까? 프로젝터 해상도 란 무엇을 의미합니까?
- 예 : PT-EX600U LCD 프로젝터를 컴퓨터에 연결하면 화면 해상도가 1028 x 768 픽셀로 변경됩니다.