부트스트랩(bootstrap)에 대해서..



웹사이트 제작을 하시거나, 관심이 있으신 분들은 한번쯤 들어 봤던 부트스트랩(Bootstrap)에 대해 들어 보셨을 겁니다. 

기존의 웹사이트를 제작 하시기에 예전에는 html, css 를 통해 직접 날코딩을 해야 합니다. 


트위터 에서 개발된 부트스트랩(bootstrap)은 번거로운 html, css 의 날코딩을 줄여주기 위해 태어 났습니다. 

일종의 웹제작을 쉽게 할 수 있도록 만들어진 프레임 워크 하고 보시면 됩니다. 



부트스트랩의 장점


- 다양한 라이브러리를 포함하여, 사용하기 위한 아이템의 소스를 가져다 쓰면 됩니다.

- 모바일 기준의 UI 프레임워크로 만들어져, 다양한 플랫폼에 최적화 된 사이트를 만들기 쉽습니다.

- 반응형 웹 사이트에 대해 모르는 사람들도 반응형 웹을 만들 수 있을 만큼 사용하기 쉽습니다.


위 내용 처럼 부트스트랩(bootstrap)을 쉽게 사용 할 수 있는것이 포인트 입니다. 

그렇지만, html, css 를 아예 모르면 아무리 쉽게 접근 할 수 있다고 해도, 웹 제작에 대한 기본은 알아야 가능 합니다. 



부트스트랩에서 모바일에 최적화 되도록 하는 코드가 있는데, 이를 뷰포트 메타태그 (viewport) 라고 합니다. 

사용 방법은 아래 코드와 같습니다. 


<meta name="viewport" content="width-device-width, initial-scale=1, maximum-scale=1, user-scalable=no">


위 코드와 미디어쿼리를 사용 하면, 모바일웹에 최적화 된 사이트를 제작 할 수 있습니다. 


부트스트랩을 사용한 사이트들도 많이 있습니다. 






(이미지 출저 : shapebootstrap.net 테마 디자인)


기본의 프레임워크를 사용해서 위 사이트테마들 처럼 디자인을 할 수 있답니다.




저작자 표시
신고

'웹관련 IT > 부트스트랩' 카테고리의 다른 글

부트스트랩(bootstrap)에 대해서..  (0) 2016.12.14

Comments 0