[기획] 반응형 웹기획 참고사이트 8개

안녕하십니까 IT 아웃소싱 플랫폼 프리모아의 Roy 입니다.

기업에서 외주를 맡길 때, 웹사이트를 기획하면 모바일도 당연히 신경써야하는 부분이 되었습니다.

반응형 웹사이트는 웹사이트 개발과 앱 개발을 한꺼번에 진행을 할 수 있어 

최근에 많은 외주개발을 반응형홈페이지 제작으로 의뢰하고 있습니다. 

반응형 웹사이트가 뭐지? 

반응형 웹사이트가 궁금하신분들은 아래 링크의 컨텐츠를 보시면 이해하실 수 있습니다.

요즘 대세 반응형홈페이지가 뭐야? :  http://freemoa-blog.com/616

반응형 웹사이트를 기획하는 기획자분들은 더 좋은 반응형 웹사이트 레퍼런스를 고민하는데요.

프리모아가 반응형 웹기획에 바로 사용할 수 있는 레퍼런스 사이트 8개를 준비하였습니다.

반응형 웹기획 레퍼런스 사이트 

1. AWWWARDS - www.awwwards.com

awwwards는 다양한 형태의 반응형 웹 사이트들을 볼 수 있습니다.

각국의 110여명의 심사위원들이 심사를해서 최고의 디자인을 오늘의 사이트로 선정하는데

심사평도 남겨져있어서 UI나 UX 동작을 기획 참고용으로 사용하시면 될 것 같습니다.

2. Media Queries - mediaqueri.es

Media Queries는 대표적인 스크린 사이즈별로 레이아웃이 어떻게 변화하는지 한눈에 보기 편합니다.

컨텐츠나 메뉴가 많은 웹사이트를 기획할 때 화면 구성별로 어떻게 적용되는지 클릭하시면 해당사이트

로 바로 연결되므로 참고하시면 될 것 같습니다.

3. Golden Grid System - goldengridsystem.com

Golden Grid System은 브라우저의 크기를 조절하면서 그리드가 어떻게 변화하는지 볼 수 있습니다.

Golden Grid System은 또한 오픈소스를 공개하고 있어 Github를 통하여 제약이 없이 자유롭게

사용하실 수 있다는 메리트가 있습니다.

4. CSS Design Awards - www.cssdesignawards.com

CSS Design Awards은 AWWARS와 비슷한 웹표준으로 만든 홈페이지 레퍼런스 사이트입니다.

CSS를 잘 활용하여 디자인적으로나 효율적인 레이아웃으로 구성된 홈페이지를 보시고

웹사이트의 화면구성 기획하는데 도움이 될 것 같습니다.

5. CSS Winner - www.csswinner.com

CSS Winner은 CSS를 활용한 국제 웹 어워드 홈페이지입니다.

웹디자인 트렌드를 파악할 수 있어 웹디자인 기획하시는데 영감을 많이 받으실 수 있습니다.

6. Gridpak - gridpak.com

Gridpak은 반응형웹을 기획하는데 가장 중요한 그리드를 효율적으로 설계하도록 도와줍니다.

사용법은 화살표버튼을 좌우로 드래그한 후 컬럼의 개수를 입력하고 컬럼 내부의 간격을 설정하고

컬럼간 간격을 설정합니다. 그리고 ADD break point 버튼을 클릭하여 브레이크 포인트를 설정하면

하단의 롤러에 브레이크 포인트가 생기는데 다음 화면에 Download your Gridpak 버튼을 클릭하면

파일을 다운받을수 있습니다. 그리드도 미리 구상해보실 수 있어서 도움이 되실 겁니다.

7. Troy - troy.labs.daum.net

Troy는 다음 커뮤니케이션즈에서 제공하는 서비스입니다.

단말이 없어도 반응형 웹 사이트를 디바이스별로 확인할 수 있어서 대표적인 스마트 기기별로

테스트할 수 있는 유용한 사이트입니다.

8. StatCounter - gs.statcounter.com

StatCounter는 반응형 웹을 제작하는데 필요한 각종 데이터를 검색할 수 있습니다.

국가별로 가장 많이 쓰이는 운영체제나 브라우저 크기, 화면 해상도 등의 자료를 통계로 볼 수 있고

반응형 앱을 기획하기전에 이러한 통계 자료를 토대로 제작한다면 정확한 결과물을 얻을 수 있습니다.

더 좋은 반응형 웹기획 참고사이트가 있다면 언제든 댓글로 소개를 해주세요.

바로 본문글에 적용하도록 하겠습니다.

반응형웹기획 의뢰를 외주 맡기려고 하신다면?

반응형웹기획 의뢰를 수주 받으려고 하신다면?

아래 배너를 클릭하여 프리모아를 방문해 주세요.