도서 소개
서비스 기획, 웹 디자인, 개발까지 1인 3역을 해내는 멀티플레이형 웹 퍼블리셔인 저자가 효율적으로 웹사이트를 제작할 수 있는 노하우를 공개한다. 업무 효율성은 물론이고, 만들고자 하는 사이트의 완성도도 한층 높일 수 있도록 반드시 익혀야 할 핵심 기술들을 다양한 실무 예제와 함께 소개하고 있다.
뿐만 아니라 소개 페이지, 갤러리 페이지, 게시판 페이지 등 현장에서 바로 적용할 수 있도록 하나의 웹사이트를 완성하는 과정을 자세히 소개하고 있다. 이 책을 마스터하고 나면 웹사이트 기획 단계부터 PC 화면과 태블릿, 모바일 화면까지 미리 예상하고 구체화할 수 있다.
또한 많은 프로젝트를 진행해 본 저자의 노하우를 엿볼 수 있는 스페셜 코너가 있다. 바로 반응형 웹을 제작하는 도중에 발생할 수 있는 문제들을 바로 해결할 수 있도록 ‘실무자들이 꼭 알아야 할 반응형 웹 문제해결 노하우’이다.
출판사 리뷰
빠르게 변하는 디자인 트렌드에 맞춰 클라이언트에게 감동을 줄 수 있다!
서비스 기획, 웹 디자인, 개발까지 1인 3역을 해내는 멀티플레이형 웹 퍼블리셔인 저자가 가장 효율적으로 웹사이트를 제작할 수 있는 노하우를 이 책에 집대성해 놓았다.
이 책은 업무 효율성은 물론이고, 만들고자 하는 사이트의 완성도도 한층 높일 수 있도록 반드시 익혀야 할 핵심 기술들을 다양한 실무 예제와 함께 소개하고 있다. 뿐만 아니라 소개 페이지, 갤러리 페이지, 게시판 페이지 등 현장에서 바로 적용할 수 있도록 하나의 웹사이트를 완성하는 과정을 자세히 소개하고 있다.
이 책을 마스터하고 나면 웹사이트 기획 단계부터 PC 화면과 태블릿, 모바일 화면까지 미리 예상하고 구체화할 수 있다.
기획자, 디자이너, 개발자 모든 분야에서 경쟁력을 갖춘 웹 퍼블리셔의 스킬 대공개!
서비스 기획, 웹 디자인, 개발까지 1인 3역을 해내는 멀티플레이형 웹 퍼블리셔인 저자가 가장 효율적으로 웹사이트를 제작할 수 있는 노하우를 이 책에 집대성해 놓았다.
모든 기기와 다양한 화면 크기에 대응할 수 있는 반응형 웹은 HTML5, CSS3와 함께 익혀야 할 웹 퍼블리싱의 필수 기술이다. 이제는 개발자뿐만 아니라 기획자, 디자이너도 반응형 웹 디자인에 대해 알아야 하고 공부해야 한다.
《Do it! 반응형 웹 디자인》은 가변 그리드, 미디어 쿼리와 뷰포트 그리고 플렉서블 박스까지 반응형 웹을 위한 모든 기술을 쉬운 예제를 따라하며 차근차근 하나씩 배울 수 있게 총정리되어 있다. 매우 현실적이면서도 유익한 기술과 이론을 배우고 나면 전공이나 경력에 상관없이 누구나 웹 퍼블리셔가 될 수 있다!
헷갈리기 쉬운 반응형 웹의 기본 개념부터
급부상하고 있는 새로운 웹 기술 플렉서블 박스까지 완벽 해설!
모든 기기에 최적화된 반응형 웹사이트를 더욱 효과적으로 구현할 수 있는 방법뿐만 아니라 미래를 이끌어갈 새로운 방향의 반응형 웹 디자인 방법인 플렉서블 박스 기술까지 명쾌하게 설명하고 있다.
실제 디자인을 반응형 웹으로 변환하는 과정을 익히고 나면 빠르게 변하는 디자인 트랜드에 맞춰 클라이언트에게 감동을 줄 수 있다!
초보자도 쉽게 따라할 수 있는 예제로 실습하고,
실무에 그대로 적용할 수 있는 웹사이트도 직접 완성한다
《Do it! 반응형 웹 디자인》은 업무 효율성은 물론이고, 만들고자 하는 사이트의 완성도도 한층 높일 수 있도록 반드시 익혀야 할 핵심 기술들을 다양한 실무 예제와 함께 소개하고 있다. 뿐만 아니라 소개 페이지, 갤러리 페이지, 게시판 페이지 등 현장에서 바로 적용할 수 있도록 하나의 웹사이트를 완성하는 과정을 자세히 소개하고 있다. 이 책을 마스터하고 나면 웹사이트 기획 단계부터 PC 화면과 태블릿, 모바일 화면까지 미리 예상하고 구체화할 수 있다.
또한 많은 프로젝트를 진행해 본 저자의 노하우를 엿볼 수 있는 스페셜 코너가 있다. 바로 반응형 웹을 제작하는 도중에 발생할 수 있는 문제들을 바로 해결할 수 있도록 ‘실무자들이 꼭 알아야 할 반응형 웹 문제해결 노하우’이다.
저자의 무료 강의 동영상으로 더 쉽게 공부하세요!
각 장에서 중요한 내용들만 쏙쏙 뽑아 설명하는 저자의 무료 동영상 강의를 무료로 공개하고 있다. 특히 아직은 생소한 플렉서블 박스 기술을 쉽게 풀어서 설명한다. 이 동영상은 PC나 스마트폰 어디에서나 이용할 수 있으므로 이동 중이나 예습, 복습할 때 이용하면 효율적이다.
www.easyspub.com → [동영상 강의] 게시판
목차
첫째마당 반응형 웹을 위한 기본 기술들
01 반응형 웹 기본 개념 이해하기
01-1 반응형 웹이란?
반응형 웹이 세상에 나온 이유
반응형 웹이란?
01-2 왜 반응형 웹으로 만들어야 하나?
유지보수가 간편하다!
마케팅에 유리하다!
검색 엔진 최적화가 가능하다!
미래 지향적 기술이다!
01-3 사례로 알아보는 반응형 웹
세계가 주목하는 반응형 웹!
해외의 반응형 웹 사례
국내의 반응형 웹 사례
01-4 반응형 웹 학습과 제작을 위한 준비 작업
웹 브라우저 준비하기
코드 편집기 준비하기
예제 파일 준비하기
호스팅 서버 준비하기
FTP 프로그램 준비하기
01-5 반응형 웹 제작을 위한 핵심 기술 맛보기
픽셀은 한계가 있다! - 가변 그리드
|코딩해 보세요!| 고정 크기의 박스를 가변 크기의 박스로 변환하기
미디어 쿼리와 뷰포트
|코딩해 보세요!| 뷰포트 비교하기
|코딩해 보세요!| 미디어 쿼리 사용하기
떠오르고 있는 기술 - 플렉서블 박스
[도전★ Quiz!]
02 px을 %로 바꾸기 - 가변 그리드
02-1 본격적으로 가변 그리드 배우기
가변 그리드 공식 이해하기
|코딩해 보세요!| 서로 다른 크기의 박스를 가변 크기로 변환하기
02-2 가변 마진과 가변 패딩 이해하기
간격을 자유자재로! 가변 마진 설정하기
|코딩해 보세요!| 고정 마진을 가변 마진으로 변환하기
가변 패딩을 적용하는 두 가지 방법
고정 크기의 마진과 패딩을 위해 calc 함수 이용하기
|코딩해 보세요!| 가변 패딩 직접 적용하기
02-3 폰트도 자유자재로!
