Submit Search
Upload
대단한 기술없이 반응형웹 UI 만들기
•
47 likes
•
37,799 views
지수 윤
Follow
반응형웹 UI 를 적용할 수 있는 기초적인 방법들.
Read less
Read more
Technology
Report
Share
Report
Share
1 of 20
Download now
Download to read offline
Recommended
모바일환경과 개발방향
모바일환경과 개발방향
Wendyst Communication
반응형웹디자인 25개 사이트 분석
반응형웹디자인 25개 사이트 분석
leeseungje
반응형 웹 디자인
반응형 웹 디자인
준극 김
2016웹트렌드와 반응형웹
2016웹트렌드와 반응형웹
Kim Ji-Man
기획자를 위한 최신 모바일웹 트랜드와 반응형 웹 화면 설계
기획자를 위한 최신 모바일웹 트랜드와 반응형 웹 화면 설계
Amy Young Ah Kim
반응형, 적응형 웹, 그 다음은? (지훈 Ux pd)
반응형, 적응형 웹, 그 다음은? (지훈 Ux pd)
Saltlux zinyus
5주 모바일웹과 반응형웹
5주 모바일웹과 반응형웹
지수 윤
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
KTH
Recommended
모바일환경과 개발방향
모바일환경과 개발방향
Wendyst Communication
반응형웹디자인 25개 사이트 분석
반응형웹디자인 25개 사이트 분석
leeseungje
반응형 웹 디자인
반응형 웹 디자인
준극 김
2016웹트렌드와 반응형웹
2016웹트렌드와 반응형웹
Kim Ji-Man
기획자를 위한 최신 모바일웹 트랜드와 반응형 웹 화면 설계
기획자를 위한 최신 모바일웹 트랜드와 반응형 웹 화면 설계
Amy Young Ah Kim
반응형, 적응형 웹, 그 다음은? (지훈 Ux pd)
반응형, 적응형 웹, 그 다음은? (지훈 Ux pd)
Saltlux zinyus
5주 모바일웹과 반응형웹
5주 모바일웹과 반응형웹
지수 윤
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
H3 2011 반응형 웹디자인, 진짜 할 만 한가?
KTH
투어팁스모바일웹 제작가이드
투어팁스모바일웹 제작가이드
병수 김
반응형 웹 기술 이해 V.2
반응형 웹 기술 이해 V.2
Lee Ji Eun
응답하라 반응형웹 - 1. 반응형 웹이란
응답하라 반응형웹 - 1. 반응형 웹이란
redribbon1307
2013 app design trends
2013 app design trends
Amy Young Ah Kim
반응형 웹 디자인은 만능인가? - 신현석
반응형 웹 디자인은 만능인가? - 신현석
Daum DNA
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
ChangGyum Kim
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
ChangGyum Kim
CSS Layout
CSS Layout
지수 윤
모바일웹Ui개발 저자세미나 0부
모바일웹Ui개발 저자세미나 0부
NAVER D2
04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법
Lab Snc
Responsive web
Responsive web
sanghwa Lee
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
Jonathan Jeon
1주 WEB UI Overview
1주 WEB UI Overview
지수 윤
크로스브라우징
크로스브라우징
지수 윤
마크업개발자가 UX를 알아야 하는 이유
마크업개발자가 UX를 알아야 하는 이유
Woo Sanghun
FT직군의 현재와 미래 - 홍윤표
FT직군의 현재와 미래 - 홍윤표
Daum DNA
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
웹데브모바일
HTML5 & Hybrid App Trends
HTML5 & Hybrid App Trends
욱래 김
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
clearboth
U&i insight2012스터디설명회
U&i insight2012스터디설명회
Amy Young Ah Kim
[WEB UI ADVANCED] Mobile WEB 개발하기
[WEB UI ADVANCED] Mobile WEB 개발하기
Jae Woo Woo
[2012널리세미나] 태블릿PC를 위한 마크업
[2012널리세미나] 태블릿PC를 위한 마크업
Nts Nuli
More Related Content
What's hot
투어팁스모바일웹 제작가이드
투어팁스모바일웹 제작가이드
병수 김
반응형 웹 기술 이해 V.2
반응형 웹 기술 이해 V.2
Lee Ji Eun
응답하라 반응형웹 - 1. 반응형 웹이란
응답하라 반응형웹 - 1. 반응형 웹이란
redribbon1307
2013 app design trends
2013 app design trends
Amy Young Ah Kim
반응형 웹 디자인은 만능인가? - 신현석
반응형 웹 디자인은 만능인가? - 신현석
Daum DNA
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
ChangGyum Kim
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
ChangGyum Kim
CSS Layout
CSS Layout
지수 윤
모바일웹Ui개발 저자세미나 0부
모바일웹Ui개발 저자세미나 0부
NAVER D2
04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법
Lab Snc
Responsive web
Responsive web
sanghwa Lee
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
Jonathan Jeon
1주 WEB UI Overview
1주 WEB UI Overview
지수 윤
크로스브라우징
크로스브라우징
지수 윤
마크업개발자가 UX를 알아야 하는 이유
마크업개발자가 UX를 알아야 하는 이유
Woo Sanghun
FT직군의 현재와 미래 - 홍윤표
FT직군의 현재와 미래 - 홍윤표
Daum DNA
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
웹데브모바일
HTML5 & Hybrid App Trends
HTML5 & Hybrid App Trends
욱래 김
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
clearboth
U&i insight2012스터디설명회
U&i insight2012스터디설명회
Amy Young Ah Kim
What's hot
(20)
투어팁스모바일웹 제작가이드
투어팁스모바일웹 제작가이드
반응형 웹 기술 이해 V.2
반응형 웹 기술 이해 V.2
응답하라 반응형웹 - 1. 반응형 웹이란
응답하라 반응형웹 - 1. 반응형 웹이란
2013 app design trends
2013 app design trends
반응형 웹 디자인은 만능인가? - 신현석
반응형 웹 디자인은 만능인가? - 신현석
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
[HCI2010]UI패턴기반 UI설계/개발자동화사례발표
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
[HCI2011]모바일웹 UI패턴 및 UI플랫폼_김창겸,문승현_배포용
CSS Layout
CSS Layout
모바일웹Ui개발 저자세미나 0부
모바일웹Ui개발 저자세미나 0부
04.발표 반응형웹에서접근성확보방법
04.발표 반응형웹에서접근성확보방법
Responsive web
Responsive web
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
차세대 웹 환경에서의 UI/UX 기술 표준화 동향
1주 WEB UI Overview
1주 WEB UI Overview
크로스브라우징
크로스브라우징
마크업개발자가 UX를 알아야 하는 이유
마크업개발자가 UX를 알아야 하는 이유
FT직군의 현재와 미래 - 홍윤표
FT직군의 현재와 미래 - 홍윤표
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
웹데브모바일 3월 세미나 자료 : 실무중심의모바일 ui&ux설계디자인 김영아
HTML5 & Hybrid App Trends
HTML5 & Hybrid App Trends
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
평범한 에이전시 팀장의 일반적인 퍼블리싱 이야기
U&i insight2012스터디설명회
U&i insight2012스터디설명회
Similar to 대단한 기술없이 반응형웹 UI 만들기
[WEB UI ADVANCED] Mobile WEB 개발하기
[WEB UI ADVANCED] Mobile WEB 개발하기
Jae Woo Woo
[2012널리세미나] 태블릿PC를 위한 마크업
[2012널리세미나] 태블릿PC를 위한 마크업
Nts Nuli
Ux 한글번역 멘플
Ux 한글번역 멘플
이창훈
iOS Human_Interface_Guidlines_#1_SYS4U
iOS Human_Interface_Guidlines_#1_SYS4U
sys4u
허니컴 태블릿 디자인
허니컴 태블릿 디자인
Sang-min Lee
웹표준화,대한민국 의식개선프로젝트-03 웹표준,접근성이란?
웹표준화,대한민국 의식개선프로젝트-03 웹표준,접근성이란?
yamoo9
2011년 1월 Webdevmobile 세미나
2011년 1월 Webdevmobile 세미나
korea_simgoon
어흥~!이번발표
어흥~!이번발표
korea_simgoon
Webdevmobile 2011 01
Webdevmobile 2011 01
korea_simgoon
[124] 하이브리드 앱 개발기 김한솔
[124] 하이브리드 앱 개발기 김한솔
NAVER D2
현대고등학교 PHP 강의 - 6차시 (설리번 프로젝트)
현대고등학교 PHP 강의 - 6차시 (설리번 프로젝트)
Ukjae Jeong
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표
Minho Lee
실 사례로 보는 고객 디지털 경험 지키기
실 사례로 보는 고객 디지털 경험 지키기
IMQA
Windows 10 in the classroom
Windows 10 in the classroom
기현 김
[발표자료]안드로메다에서 온 디자이너이야기 5차 next_web_지훈_20130221
[발표자료]안드로메다에서 온 디자이너이야기 5차 next_web_지훈_20130221
KTH, 케이티하이텔
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
KTH, 케이티하이텔
Architect
Architect
vc15jung
2011년 UX 분석과 2012년 UX 통찰
2011년 UX 분석과 2012년 UX 통찰
Billy Choi
Ia
Ia
yangyoo
제 5회 DGMIT UI&UX 컨퍼런스: 2015 웹디자인 트렌드
제 5회 DGMIT UI&UX 컨퍼런스: 2015 웹디자인 트렌드
dgmit2009
Similar to 대단한 기술없이 반응형웹 UI 만들기
(20)
[WEB UI ADVANCED] Mobile WEB 개발하기
[WEB UI ADVANCED] Mobile WEB 개발하기
[2012널리세미나] 태블릿PC를 위한 마크업
[2012널리세미나] 태블릿PC를 위한 마크업
Ux 한글번역 멘플
Ux 한글번역 멘플
iOS Human_Interface_Guidlines_#1_SYS4U
iOS Human_Interface_Guidlines_#1_SYS4U
허니컴 태블릿 디자인
허니컴 태블릿 디자인
웹표준화,대한민국 의식개선프로젝트-03 웹표준,접근성이란?
웹표준화,대한민국 의식개선프로젝트-03 웹표준,접근성이란?
2011년 1월 Webdevmobile 세미나
2011년 1월 Webdevmobile 세미나
어흥~!이번발표
어흥~!이번발표
Webdevmobile 2011 01
Webdevmobile 2011 01
[124] 하이브리드 앱 개발기 김한솔
[124] 하이브리드 앱 개발기 김한솔
현대고등학교 PHP 강의 - 6차시 (설리번 프로젝트)
현대고등학교 PHP 강의 - 6차시 (설리번 프로젝트)
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표
220806 UX/UI 해외 인기 아티클 6기 : 3주차 발표
실 사례로 보는 고객 디지털 경험 지키기
실 사례로 보는 고객 디지털 경험 지키기
Windows 10 in the classroom
Windows 10 in the classroom
[발표자료]안드로메다에서 온 디자이너이야기 5차 next_web_지훈_20130221
[발표자료]안드로메다에서 온 디자이너이야기 5차 next_web_지훈_20130221
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
H3 2011 반응형 웹디자인,진짜 할 만 한가?_Fi팀_신현석
Architect
Architect
2011년 UX 분석과 2012년 UX 통찰
2011년 UX 분석과 2012년 UX 통찰
Ia
Ia
제 5회 DGMIT UI&UX 컨퍼런스: 2015 웹디자인 트렌드
제 5회 DGMIT UI&UX 컨퍼런스: 2015 웹디자인 트렌드
More from 지수 윤
HTML,CSS Next
HTML,CSS Next
지수 윤
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
지수 윤
Clean Front-End Development
Clean Front-End Development
지수 윤
개발자를 알아보자.
개발자를 알아보자.
지수 윤
재사용UI 컴포넌트설계
재사용UI 컴포넌트설계
지수 윤
Front-End 개발의 괜찮은 선택 ES6 & React
Front-End 개발의 괜찮은 선택 ES6 & React
지수 윤
WEB Front-End 개발과정 살펴보기
WEB Front-End 개발과정 살펴보기
지수 윤
재사용가능한 서비스코드제작
재사용가능한 서비스코드제작
지수 윤
WEBUI Advanced중간시험
WEBUI Advanced중간시험
지수 윤
비동기와 이벤트큐 수업자료
비동기와 이벤트큐 수업자료
지수 윤
JavaScript OOP Pattern
JavaScript OOP Pattern
지수 윤
JS특징(scope,this,closure)
JS특징(scope,this,closure)
지수 윤
JavaScript Debugging (수업자료)
JavaScript Debugging (수업자료)
지수 윤
JavaScript Debugging (동영상강의자료)
JavaScript Debugging (동영상강의자료)
지수 윤
더 나은 SW프로젝트를 위해
더 나은 SW프로젝트를 위해
지수 윤
9주 DOM & Event Advanced
9주 DOM & Event Advanced
지수 윤
7주 JavaScript Part2
7주 JavaScript Part2
지수 윤
7주 JavaScript Part1
7주 JavaScript Part1
지수 윤
6주 javaScript 시작하며
6주 javaScript 시작하며
지수 윤
10주 ajax
10주 ajax
지수 윤
More from 지수 윤
(20)
HTML,CSS Next
HTML,CSS Next
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
코드스쿼드 마스터즈세미나 - UI개발자가돼보자
Clean Front-End Development
Clean Front-End Development
개발자를 알아보자.
개발자를 알아보자.
재사용UI 컴포넌트설계
재사용UI 컴포넌트설계
Front-End 개발의 괜찮은 선택 ES6 & React
Front-End 개발의 괜찮은 선택 ES6 & React
WEB Front-End 개발과정 살펴보기
WEB Front-End 개발과정 살펴보기
재사용가능한 서비스코드제작
재사용가능한 서비스코드제작
WEBUI Advanced중간시험
WEBUI Advanced중간시험
비동기와 이벤트큐 수업자료
비동기와 이벤트큐 수업자료
JavaScript OOP Pattern
JavaScript OOP Pattern
JS특징(scope,this,closure)
JS특징(scope,this,closure)
JavaScript Debugging (수업자료)
JavaScript Debugging (수업자료)
JavaScript Debugging (동영상강의자료)
JavaScript Debugging (동영상강의자료)
더 나은 SW프로젝트를 위해
더 나은 SW프로젝트를 위해
9주 DOM & Event Advanced
9주 DOM & Event Advanced
7주 JavaScript Part2
7주 JavaScript Part2
7주 JavaScript Part1
7주 JavaScript Part1
6주 javaScript 시작하며
6주 javaScript 시작하며
10주 ajax
10주 ajax
대단한 기술없이 반응형웹 UI 만들기
1.
대단한
2.
기술없이,
3.
반응형
4.
웹
5.
UI
6.
만들기
7.
! 윤지수
8.
at
9.
NEXT
10.
반응형
11.
웹?
12.
13.
“오~
14.
자동으로
15.
막
16.
변화가
17.
되는
18.
UI
19.
!?”
20.
! 그런데
21.
사실,
22.
모든
23.
device에서
24.
잘
25.
보이게
26.
하는
27.
UI를
28.
만드는
29.
건
30.
쉬운
31.
일은
32.
아니다.
33.
! 심지어
34.
복잡한
35.
웹사이트는
36.
사이즈별
37.
다른
38.
웹UI
39.
페이지가
40.
존재…⋯
41.
당신이
42.
할
43.
수
44.
있다면
45.
그렇게
46.
하는
47.
것이
48.
사용자에게
49.
가장
50.
최적화된
51.
화면을
52.
제공할
53.
수
54.
있겠다.
55.
!
56.
! 하지만
57.
복잡하지
58.
않은
59.
UI라면
60.
?
61.
62.
간단한
63.
설정만으로
64.
충분히
65.
반응형
66.
웹을
67.
만들
68.
수
69.
있다는
70.
사실!
71.
72.
! (신기루
73.
같은
74.
이야기는
75.
아니니까
76.
방심하지
77.
말자
78.
@.@
79.
)
80.
81.
먼저
82.
결론,
83.
3가지만
84.
기억하기. %
85.
,
86.
conent=device-width
87.
,
88.
media-query
89.
90.
1.
91.
‘%’
92.
데탑
93.
브라우저에서의
94.
화면
95.
적용하고자
96.
하는
97.
UI가
98.
99.
고정형(px
100.
로
101.
규정한
102.
페이지)이
103.
아니라면
104.
?
105.
106.
다양하게
107.
반응하게
108.
하는
109.
건
110.
쉽다.
111.
가로폭
112.
관련
113.
속성들을
114.
115.
%
116.
단위로
117.
조정만
118.
해도
119.
기기별로
120.
훌륭하게
121.
반응함.
122.
! (width,
123.
margin-left,
124.
margin-right,
125.
padding-left…⋯.) header div#title{! width
: 90%;! margin-left: 5%;! margin-right:5%;! margin-top: 20px;! margin-bottom: 20px;! position: relative;! height : 250px;! border-radius: 0.8em;! border: 1px solid rgb(214, 214, 214);! box-shadow: 2px 2px 4px #ECECEC;! color : #1a1a1a;! }!
126.
2.
127.
device-width
128.
만약,
129.
130.
데탑
131.
웹
132.
페이지를
133.
만든
134.
후
135.
별다른
136.
설정
137.
안하고
138.
139.
모바일브라우저에서
140.
딱
141.
보면,
142.
! 어이없게
143.
나름
144.
볼만하다(?)
145.
! 모바일브라우저가
146.
작은
147.
데탑이라고
148.
가정하고
149.
150.
알아서
151.
수정하여
152.
렌더링
153.
해준다.
154.
155.
PC버전을
156.
줌아웃
157.
한
158.
것
159.
같기도
160.
하고..
161.
마치
162.
작은
163.
모형PC에서
164.
보는
165.
것과
166.
같다.
167.
모바일웹에서
168.
기본적으로
169.
이렇게
170.
보여지는
171.
이유는
172.
?
173.
모바일
174.
사파리
175.
브라우저는
176.
자동으로
177.
980픽셀
178.
크기에
179.
맞춰
180.
렌더링을
181.
한
182.
후
183.
디바이스의
184.
뷰포트(보이는
185.
영역)에
186.
맞게
187.
줌아웃한다.
188.
하지만,
189.
좀더
190.
모바일스럽게
191.
할
192.
수
193.
없을까?
194.
! ! 현재는
195.
그럭저럭
196.
보이긴
197.
하는데,,
198.
글자도
199.
좀
200.
작고
201.
가독성이
202.
떨어진다.
203.
!
204.
‘device-width’
205.
를
206.
적용해보자.
207.
meta name=viewport content=width=device-width 그런데,
208.
글자가
209.
지멋대로
210.
커지고
211.
레이아웃도
212.
좀
213.
엉망이다.
214.
215.
device가
216.
모바일에
217.
최적화되게
218.
조정하지
219.
않는
220.
거
221.
같다.
222.
! 이제
223.
스타일
224.
조정을
225.
내가
226.
직접할
227.
수
228.
있다.(해야한다) #
229.
@viewport
230.
사실
231.
viewport
232.
meta
233.
태그는
234.
정식표준으로
235.
인정받지
236.
못하고
237.
있으며,
238.
@viewport라는
239.
것이
240.
앞으로의
241.
표준으로
242.
자리
243.
잡을
244.
예정이다.
245.
http://dev.w3.org/csswg/css-device-adapt/#the-atviewport-rule
246.
! 모바일에
247.
어울리게,
248.
어떻게
249.
스타일
250.
조정을
251.
해야
252.
할까?
253.
! ! 음..아..상식적으로다가
254.
쉽게
255.
생각해보면,,
256.
‘특정
257.
해상도인
258.
경우에는
259.
다른
260.
스타일
261.
적용을
262.
할
263.
수
264.
있으면
265.
좋겠다’
266.
!
267.
3.
268.
media-query
269.
media-query
270.
라는
271.
것을
272.
적용하면
273.
특정
274.
해상도
275.
조건인
276.
경우에만
277.
동작하는
278.
CSS
279.
를
280.
적용할
281.
수
282.
있다
283.
!
284.
@media screen and
(max-width:1100px) {! ! ! div#wrap {! ! ! font-size: 13px;! ! }! ! } ‘if’
285.
문과
286.
같다고
287.
생각하면
288.
되겠다
289.
290.
‘media-query’를
291.
적용 ! @media screen and
(max-width:401px) { div#wrap { width:100%; 1border :2px solid blue; } ! ! ! ! nav#top { height: 40px; } nav#top a { font-size: 1em; } header div#title{ margin-top: 10px; margin-bottom: 10px; height : 100px; } 특정
292.
해상도를
293.
기준으로
294.
295.
font크기와
296.
297.
높이값
298.
관련
299.
속성을
300.
변경했다 #title h2 { font-size:
1.0em; } …… } ! ! @media screen and (min-width:402px) and (max-width:990px) { div#wrap { 1border :2px solid red; } ! ! } #title h1 { font-size: 2.6em; } header div#titlea { height : 150px; }
301.
3 media-query는
302.
크게
303.
Mobile Tablet 가지만
304.
분기해도
305.
훌륭. Desktop
306.
iOS_iphone-4S iOS_iphone-5S-7.0 win8.1_opera_12.16 android Samsung Galaxy-Nexus_4.0 android
Samsung Galaxy-Note_2.3 win7_ie_11 win8_ie_10 win XP chrome_25
307.
결론. 폭관련
308.
속성을
309.
‘%’
310.
단위로
311.
적용해서
312.
유동적으로
313.
변경되게
314.
한다
315.
device-width값을
316.
설정해서
317.
모바일
318.
스타일을
319.
컨트롤
320.
가능하게
321.
한다
322.
media-query
323.
로
324.
원하는
325.
해상도별
326.
스타일
327.
조정을
328.
한다
329.
330.
참고했어요,
331.
https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/ http://i-skool.co.uk/mobile-development/web-design-for-mobiles-and-tablets-viewport-sizes/
Download now