[모음글] 반응형웹

왼쪽이 적응형 오른쪽이 반응형..

엄밀히 말하면, media query 사용해서 PC용 스마트패드용 스마트폰용 이렇게 3개의 스타일 만들어서 사용하는 것이 적응형.

반응형은, 3가지 스타일 만들어 놓는 것이 아니라 화면 사이즈에 맞게 항상 변하는 넘.

모바일 기기도 PC 라고 보는 견해와 아니라는 견해가 있지만, 암튼..

스크린 크기에 따라 화면 레이아웃이 변형되도록 작업하는 것이 반응형웹의 취지인듯..

한 번 작성해서 여러 스크린을 커버한다는 실용적인 기법.

1. 플랫폼/플러그인/프레임웍

트위터 bootstrap 반응형웹 레이아웃

http://helloworld.naver.com/helloworld/67876

Masonry 반응형웹 라이브러리, MIT 라이센스

http://masonry.desandro.com/docs/intro.html

http://www.haeyounglee.com/tutorials/javascript/pinterest-layout-jquery-superfish

jQuery Masonry

http://sir.co.kr/bbs/board.php?bo_table=g4_plugin&wr_id=14563

Foundation 반응형웹 라이브러리, MIT 라이센스

http://foundation.zurb.com/

화면 크기에 맞춰 이미지 리사이징하는 플러그인

http://jquerypicture.com/ 

2. 개념글

화면 크기에 맞춰 UI 가 변경.

http://blog.naver.com/kipfa/70133197348

반응형 웹 고민할 문제..

http://helloworld.naver.com/helloworld/81480

- 웹브라우저 하위 호환성

- 성능 (CSS, JS)

- 네비게이션

- 개발편의

UX 트렌드

http://userexperience.tistory.com/297

반응형 웹 기획론

http://www.slideshare.net/YoungAhKim/ss-11348360

모바일 퍼스트, 반응형웹

http://study.gnuboard.org/wiki/read/studygroup/rwd/Mobile-First-and-RWD

반응형 웹 컨퍼런스

http://hankim.me/80164979380

http://spoqa.github.com/2012/08/16/make-a-responsive-web.html

3. 잘 만들어진 웹사이트

http://www.bostonglobe.com

http://www.amwayon.co.kr

http://www.boston.com

http://mediaquaries.es

http://www.sony.com

http://www.neovada.com

http://www.zazzle.com/3200tigers

http://blog.jidolstar.com/829

4. 기타

javascript 로 반응형 웹 지원

http://github.com/ten1seven/jRespond

1분만에 반응형 웹사이트 만들어준다고..

http://www.1stwebdesigner.com/css/responsive-website-tutorial/

반응형웹 25개 웹사이트 분석했다네요. 결론은, IE6.x 를 버릴 수 있을까..?

http://www.slideshare.net/leeseungje/25-14080430

http://blog.saltfactory.net/199, CSS3 1/2

http://blog.saltfactory.net/200, CSS3 2/2

*. 반응형 웹 기획론

http://sanghyuns.com/wp/rwd%EB%B0%98%EC%9D%91%ED%98%95%EC%9B%B9-%ED%95%B4%EC%83%81%EB%8F%84/

요즘 모바일 해상도 환경

http://www.slideshare.net/YoungAhKim/ss-11348360

예시 화면 샘플들..

http://mediaqueri.es/

.css

http://v.daum.net/link/32274065

http://stuffandnonsense.co.uk/content/dl/2010/09/30/hardboiledmediaqueries.0.9.css