하나의 콘텐츠를 여러 디바이스에서 동일하게 사용하고 싶은 편리함에 대한 요구는 디스플레이 종류에 따라 화면의 크기를 자동으로 최적화하는 웹페이지 기술인 반응형 웹을 탄생시켰다. 유행의 속도가 빠른 한국은 IT기술의 사용 속도 면에서도 세계 어느 나라보다도 빠른 변화를 경험하고 있으며, 2010년 에단 마코트(Ethan Marcotte)에 의해 소개된 반응형 웹의 기 술은 이미 한국에서 상용화 되고 있다. 하지만 반응형 웹의 제작에 대한 표준화된 가이드나 개발 모델은 아직 미비하며, 제작 면에서도 표준화된 프로세스 보다는 제작자 개개인의 역량에 의존한 개발의 성격이 강한 현실이다. 본 연구에서는 반 응형 웹의 대표적 오픈 플랫폼인 부트스트랩(Bootstrap)의 사례를 기반으로 하여 반응형 웹의 그리드 시스템을 분석하고, 황금비율과 유동형 레이아웃을 중심으로 반응형 웹의 그리드 시스템 모델을 제안하였다. 늘어나는 수요와 중요성에도 불구 하고 관련 연구와 프로세스 표준화 작업이 부족한 반응형 웹의 제작환경에서, 프레임워크인 부트스트랩의 그리드 시스템은 반응형 웹 제작의 프로세스 표준화 작업에 좋은 선행연구 자료가 될 수 있을 것으로 보인다. 또한, 현재 서비스 중인 사이 트인 ‘클라우드 제트(Cloud Z)’에 대한 사례분석은, 부트스트랩을 사용하여 제작되는 반응형 웹 사이트가 현장에서 고객의 요구사항과 어떻게 조율되는지 대한 실제적인 사례라는 점에서 의미 있는 자료로 보여 진다.
The demand for the convenience of using one content equally in multiple devices has created a responsive web, a web page technology that automatically optimizes the screen size according to the display type. Korea is experiencing rapid change in terms of the speed of IT technology usage, and the technology of responsive web introduced by Ethan Marcotte in 2010 has already been commercialized in Korea . However, there is still no standardized guide or development model for the production of responsive webs, and the reality of the development is dependent on the competence of each individual producer rather than the standardization process. In this study, we analyze the grid system of responsive web based on the case of bootstrap, which is the representative open platform of responsive web, and propose a grid system model of responsive web centered on golden ratio and fluid layout. In the production environment of responsive web, which lacks related research and process standardization despite increasing demand and importance, the bootstrap grid system can be a good research material for process standardization of responsive web production see. In addition, the case study of ‘Cloud Z’, which is currently in service, is a practical example of how responsive web produced using bootstrap are coordinated with customer requirements in the field It is seen as meaningful data.