본문 바로가기

Responsive Web3

반응형 웹 - 단점 Weak point ๏ 미디어 쿼리의 가장 큰 단점은 성능이다. - 실제 사용되는 이미지보다 더 큰 이미지를 다운 받아야 한다. - 이미지 크기 조정은 단말기의 CPU를 보다 더 많이 사용한다. - 실제로 사용하지 않는 자원(이미지, CSS)을 다운 받아야 할 수 있다. - 불필요한 콘텐츠를 다운 받아야 할 수 있다. - 미디어 쿼리를 지원하지 않는 브라우저의 사용자가 많다. 2012. 11. 20.
반응형 웹 - IE9 버전에서도 작동되게 하기 CSS3 @media 쿼리는 IE6~8 브라우저에서는 지원되지 않는다. 그래서 Javascript로 구현된 respond.js를 이용해서 이 문제를 해결해야한다. https://github.com/scottjehl/Respond 에서 git로 받거나 zipbal이나 tarbal을 받아서 respond.min.js를 코드에 추가한다. respond.js를 추가한 코드를 IE8에서 적용을 해보자. (respond.js는 IE6까지 지원한다.) @media query test 2012. 11. 20.
반응형 웹 - 미디어 쿼리의 구조 반응형 웹디자인에 대해 포스팅을 해보겠습니다. 반응형 웹디자인은 해상도에 따라 레이아웃이 변경되는 구조입니다. 일단 사용전에.. 이것들을 꼭 확인하셔야 합니다. 1. HTML5인지 확인합니다. ==> HTML 4.0 버전에서는 개발하기 힘듭니다. 2. 이 하나라도 있는지 확인합니다. ==> TABLE가 존재할 경우 레이아웃이 깨집니다. 3. 개발 브라우저가 IE만 있을 경우 IE9 이상인지 확인합니다. (설마.. 웹개발자가 IE만 있지는 않겠죠..ㅎㅎ;;) ==> 물론 IE8이하에서도 JS로 해결이 가능합니다만, 그래도 불안정하기 때문이죠. 4. 되도록 스크립트 코드는 부분보다는 끝에 작성합니다. ==> 로딩 속도는 비슷하나, 체감 속도에서 많은 차이가 납니다. 구조는 이렇습니다. (3가지 방법 중 하나.. 2012. 11. 20.