웹 사이트의 표준 너비는 픽셀 단위 또는 통계는 어디에 있습니까?
답변
대부분의 개발자가 1024×768을 표준으로 가정하지만 표준은 없습니다.
960grid라는 CSS 그리드 시스템이 있으며 본문 너비를 960px로 가정 한 다음 96 개의 열을 10px로, 80을 12px로 나누십시오.
문제는 일부 지역에서는 PC 화면이 항상 커지고 점점 커지고 있다는 것입니다.
반면, 테크 탑에서는 모바일 장치와 넷북에 작은 화면이 있습니다.
이 현실을 다루는 것은 고통 스러울 수 있습니다. 구조에 CSS 미디어 쿼리가 있습니다. 또는 태그 링크 (rel 핸드 헬드 포함)를 사용하여 모바일 장치에 대체 버전을 제공 할 수 있습니다.
당신을 위해 몇 가지 참조 링크를 따르십시오
- http://www.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/
- http://www.alistapart.com/articles/responsive-web-design/
- http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#rel-alternate
- http://dev.w3.org/csswg/css3-mediaqueries/
답변
웹 사이트의 표준 너비는 픽셀 단위입니까?
0보다 크고 무한대보다 작은 숫자
RWD (Responsive Web Design)의 현재 모범 사례는 너비에 관계없이 모든 장치를 픽셀 단위로 지원하는 것입니다. 일반적으로 미디어 쿼리를 사용하여 다양한 화면 크기 범위에 대해 서로 다른 스타일을 제공합니다. 실제 범위는 디자인이 크기에 따라 일관성이 있고 사이트가 크기에 따라 기능을 유지하는 것보다 중요합니다.
사용자는 그것에 대해 많이 생각하지 않고 다른 화면 크기를 볼 가능성이 높으므로 창을 끌어서 화면 절반에 고정하거나 전화를 기울일 때 놀라움을 최소화하려고합니다.
사용되는 일반적인 너비 범위는 다음과 같습니다.
- 매우 작은 : 0-480
- 작은 : 480-768
- 매체 : 768-1024
- 큰 : 1024-1200
- 초대형 : 1200+
이 범위는 너무 일반적이므로 실제로 표준이라고 말할 수 있습니다. 모든 범위를 사용할 필요는 없습니다. 예를 들어, 사이트는 768 이하의 유체 너비 일 수 있으며 고정 너비이고 768+를 중심으로 할 수 있습니다.
이미 말했듯이, 사용자가 사이트를 보려고 선택한 모든 장치에서 사이트가 작동하는 한 사용하는 숫자는 특히 중요하지 않습니다.
통계는 어디에 있습니까?
이제 까다로운 부분은 실제 데이터입니다. 사이트를 재 설계하는 경우 중요한 데이터는 귀하의 것입니다. 무엇 위키 백과 또는 스택 오버플로, 또는 Google, 또는 – 기타 – 대형 웹 사이트, 즉-힘 목록 – 분석 데이터 말하는 것은 무관하다 당신의 데이터 귀하의 사이트.
통계에 대부분의 사용자가 주로 특정 범위의 장치 너비를 사용하는 것으로 표시되는 경우 해당 사용자에게 먼저 서비스를 제공하는 데 집중해야합니다. 결론적으로, 디자인이 제대로 반응하면 특정 크기에 전혀 집중할 필요가 없습니다.
이전에 분석 기능이 없었던 새로운 웹 사이트 또는 사이트의 경우 모바일 우선 접근 방식 사용을 고려하고 사용자 기반에 올바르게 적응할 수 있도록 분석 기능을 사용해야합니다.
후세를위한 오래된 오래된 RWD 버전
아무도 구글에서 브라우저 크기 를 언급하지 않았다는 것에 놀랐습니다 .
표준에 관해서는 :
시청자의 80 %는 최대 1000px 너비 를 처리 할 수 있지만 1000px 이상 너비를 처리 할 수있는 사용자는 그렇지 않습니다. 와이드 스크린 모니터를 사용하면 많은 사람들이 창을 화면의 절반에 맞 춥니 다. Win7은 drag-n-dock을 지원하므로 더욱 대중화 될 것입니다.
높이에 관해서 : 사용자에 대한 첫 인상은 최대 약 600px까지 페이지 상단에 있습니다. 그러나 대부분의 사용자는 컨텐츠가 “폴드”아래로 떨어지고 스크롤 할 수 있다는 것을 알고 기대합니다.
1000px 이상으로 넓히려면 넷북 및 작은 화면의 사용자가 여전히 내용을 올바르게 볼 수 있도록 유동적 인 레이아웃을 사용하는 것이 좋습니다.
~ 960px는 표준화 된 너비 인 경향이 있지만 실제로는 내용과 스타일에 따라 다릅니다.
답변
작년에 Google 웹 로그 분석을 사용하여 평균 내부 브라우저 너비와 높이 (사용자가 실제로 보는 것) 가 무엇인지 알아보기 위해 약간의 테스트를했습니다 .
답변
다른 사람들이 말했듯이, 이런 유형의 표준은 없습니다. 다음은 웹 사이트를 만들거나 제동 할 수있는 몇 가지 팁입니다.
필자는 항상 백분율 또는 최악의 시나리오 빌드를 사용했습니다. 일반적으로 발생하는 가장 작은 화면 해상도는 800×600이며 심지어 드문 경우입니다. 아래에있는 것은 아마도 모바일 장치에있는 것입니다. 775px 너비는 사용하기에 좋은 매체이거나, 더 큰 화면으로 확장 할 때 웹 사이트가 여전히 매력적이라는 사실을 알고 있다면 단순히 80 %입니다. 가장 일반적인 문제는 텍스트 내용 (1600px 너비로 확장 할 때)이 비어 있고 짧아 보인다는 것입니다. 웹 사이트의 너비가 775px이면 문제가 해결되지만 양쪽에 넓은 공간이 있으면 좋지 않을 수 있습니다.
사용자를 왼쪽이나 오른쪽으로 스크롤하지 마십시오. 측면의 내용을 차단하는 것이 잠재적 인 고객이나 독자를 잃는 가장 빠른 방법입니다.
탐색을 상단 근처 또는 사용자가 스크롤 할 필요가없는 곳에서 탐색하십시오.
그리고 단지 콘텐츠 팁; 높은 그래픽 / 낮은 정보 또는 높은 정보 / 낮은 그래픽이 있습니다. 두 가지를 결합하려고하면 항상 끔찍해 보입니다.
답변
표준은 “가능한 한 너비 / 높이”입니다. 사용자 화면에 따라 다릅니다.
답변
인기있는 화면 해상도가 얼마나되는지 알고 대부분의 사람들이 일반적으로 사용하는 템플릿을 기반으로 템플릿을 기반으로하는 것이 도움이됩니다. 개인적으로 반응 형 디자인을 사용하는 것이 좋습니다. 이렇게하면 사이트가 모든 장치 및 모든 해상도에서 작동하는 방식이 좋습니다.
2013 년 1 월부터.
-
1366×768 25.4 %
-
1920×1080 11.0 %
-
1280×1024 9.7 %
-
1440×900 7.3 %
-
1280×800 8.2 %
-
1680×1050 5.7 %
-
1600×900 5.0 %
-
1920×1200 2.9 %
-
1360×768 2.1 %
-
2560×1440 1.1 %
-
기타 11.6 %
답변
Google 웹 로그 분석은 방문자의 화면 해상도를 기록합니다. 당신은 쉽게의 일반적인 화면 크기 무엇인지 확인하는 사용자 정의 보고서를 생성 할 수 있습니다 귀하의 방문자. 2013 년 5 월 웹 사이트 통계 (최고 15) :
Rank Resolution % of Visits
---- ---------- -----------
1 1366x768 23.0%
2 1920x1080 17.7%
3 1440x900 8.4%
4 1280x1024 8.4%
5 1680x1050 7.1%
6 1280x800 6.9%
7 1600x900 6.0%
8 1920x1200 4.7%
9 1024x768 4.4%
10 2560x1440 2.3%
11 1360x768 2.1%
12 1280x768 1.0%
13 1600x1200 0.7%
14 1280x720 0.7%
15 1152x864 0.5%
통계는 수신되는 트래픽 유형에 따라 사이트마다 다릅니다. 나 자신은 백분율 너비, 1000px min-width및 합리적인 유동 디자인을 선호합니다 max-width.