반응형 프레임워크 (zurb's foundation)
좀전에 HTMLn/CSSn 게시판에 글을 올렸는데, ( http://sir.co.kr/bbs/board.php?bo_table=pg_html&wr_id=13087 )
부트스트랩 말고 다른 반응형 프레임워크를 사용해보시고 싶으신 분들은 한번 쯤 고려해볼만하다고 생각합니다. :)
요새 자게에서도 몇분이 반응형 웹에 관심이 있으신것 같아서 여기도 (요약해서) 올립니다.
트위터의 부트스트랩은 많이들 아실테고,
zurb의 foundation 이라는 반응형 프레임워크도 있네요. http://foundation.zurb.com/
부트스트랩하고 많이 비슷한데, 몇가지 기능? 이 더 있습니다.
특히 모바일 레이아웃으로 off-canvas (페이스북 앱 처럼 좌/우측에 감춰진 화면에 사이드바, 메뉴 등을 넣고 필요할때 터치스와핑으로 불러내는 방식) 를 제공하기 시작했네요. http://www.zurb.com/playground/off-canvas-layouts
부트스트랩 말고 다른 반응형 프레임워크를 사용해보시고 싶으신 분들은 한번 쯤 고려해볼만하다고 생각합니다. :)
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기
댓글 14개
원래는 zurb를 다른 이유로 들렸다가 운좋게 발견했네요. :)
요준 웹표준 , 모바일 ,크로스 브라우징,반응형 웹 등에 관심이 무지하게 많아졌습니다
저도 포토샵을 배워서 직접 만들어 봐야겠단 생각이 드네요 ㅜㅜ
근데, 반응형 웹에 포토샵은 왜 필요할까요? ^^;
자바스크립을 이용해 구분 적용해야하나요?
당연히 있을거라고 생각해서 '터치 스와핑 방식'이라고 썼다가 지웠습니다. -_-;
기본적으로 특정 버튼/링크를 클릭할때 좌우로 슬라이딩 합니다.
첫번째의 실행 예 링크: http://goo.gl/RCSLb
두번째의 실행 예 링크:: http://goo.gl/XSwjT
기본적으로 화면 크기(와 아마도 user_agent? 이것도 확인안된 내용^^;) 을 기반으로 자동으로, 레이아웃의 일부를 좌우측 감춰진 영역으로 보내고,
정해진 버튼/링크 클릭시 가려진 영역이 등장하는 방식이고요,. ^^
자료 감사합니다. 천천히 한번 뜯어봐야겠네요.
실행을 해야하는데.. 영 몸이 안 움직여서요.. -_-
근데 진짜로 100% responsive 는 넘 어렵고, 시간도 넘 오래 걸리고,
이것 보다는 각 방문자의 스크린 사이즈 (resolution) 를 알아내서, 거기에 맞춰 스마트폰 용 레이아웃 1개, 아이패드 용 1개, 이런식으로 반응하게 하는게 시간절약 + 더 쉬운 것 같습니다.
100% responsive 는 정말 포기, 포기..
서버쪽에서도 스크린 크기별로 일부 준비해야 한다는 접근방법도 있더군요.. ^^
http://www.lukew.com/ff/entry.asp?1392