이미 소장하고 있다면 판매해 보세요.
- 해외배송 가능?
- 문화비소득공제 가능
상세 이미지
책소개
목차
|
첫째마당 반응형 웹을 위한 기본 기술들
01 반응형 웹 기본 개념 이해하기 01-1 반응형 웹이란? 반응형 웹이 세상에 나온 이유 반응형 웹이란? 01-2 왜 반응형 웹으로 만들어야 하나? 유지보수가 간편하다! 마케팅에 유리하다! 검색 엔진 최적화가 가능하다! 미래 지향적 기술이다! 01-3 사례로 알아보는 반응형 웹 세계가 주목하는 반응형 웹! 해외의 반응형 웹 사례 국내의 반응형 웹 사례 01-4 반응형 웹 학습과 제작을 위한 준비 작업 웹 브라우저 준비하기 코드 편집기 준비하기 예제 파일 준비하기 호스팅 서버 준비하기 FTP 프로그램 준비하기 01-5 반응형 웹 제작을 위한 핵심 기술 맛보기 픽셀은 한계가 있다! - 가변 그리드 |코딩해 보세요!| 고정 크기의 박스를 가변 크기의 박스로 변환하기 미디어 쿼리와 뷰포트 |코딩해 보세요!| 뷰포트 비교하기 |코딩해 보세요!| 미디어 쿼리 사용하기 떠오르고 있는 기술 - 플렉서블 박스 [도전★ Quiz!] 02 px을 %로 바꾸기 - 가변 그리드 02-1 본격적으로 가변 그리드 배우기 가변 그리드 공식 이해하기 |코딩해 보세요!| 서로 다른 크기의 박스를 가변 크기로 변환하기 02-2 가변 마진과 가변 패딩 이해하기 간격을 자유자재로! 가변 마진 설정하기 |코딩해 보세요!| 고정 마진을 가변 마진으로 변환하기 가변 패딩을 적용하는 두 가지 방법 고정 크기의 마진과 패딩을 위해 calc 함수 이용하기 |코딩해 보세요!| 가변 패딩 직접 적용하기 02-3 폰트도 자유자재로! 가변 폰트 이용하기 글자를 가변적이게 만들어주는 가변 폰트 em 단위의 상속 문제를 해결해주는 rem 단위 진정한 가변 폰트 - vw, vh, vmin, vmax 단위 02-4 멀티미디어 요소 가변적으로 만들기 - 가변 이미지와 가변 동영상 비율에 상관없이 가변적인 멀티미디어 요소 만들기 [도전★ Quiz!] 03 미디어 쿼리와 뷰포트 03-1 화면의 크기나 환경에 따라 웹사이트를 변경하는 기술, 미디어 쿼리 미디어 쿼리의 기본 문법 미디어 쿼리를 적용하려면? - 링크 방식 미디어 쿼리 사용 시 주의사항 |코딩해 보세요!| 미디어 쿼리 사용해 웹사이트 구조 변경하기 03-2 화면의 보이는 영역을 다루는 기술, 뷰포트 뷰포트 영역 확인하기 [도전★ Quiz!] 04 새로운 웹 기술, 플렉서블 박스 04-1 플렉서블 박스 기본 개념 이해하기 플렉서블 박스의 기본 개념 04-2 플렉서블 박스 기술 익히기 플렉서블 박스로 작동시키기 위한 기본 설정 플렉스 아이템의 배치 방향 설정하기 플렉스 아이템을 여러 줄로 배치하기 플렉스 아이템의 배치 방향과 여러 줄 배치를 한 번에 설정하기 주축 방향으로 다양하게 플렉스 아이템 배치하기 교차축 방향으로 다양하게 플렉스 아이템 배치하기 교차축 방향으로 플렉스 아이템을 개별적으로 배치하기 여러 줄인 플렉스 아이템을 교차축 방향으로 다양하게 배치하기 플렉스 아이템의 배치 순서 바꾸기 플렉스 아이템의 크기 늘이고 줄이기 |코딩해 보세요!| 플렉서블 박스 이용해 목업 웹사이트 만들기 [도전★ Quiz!] 둘째마당 실전! 반응형 웹사이트 만들기 05 반응형 웹사이트 준비 작업하기 05-1 웹사이트 구조 다지기 1단계: 웹사이트 구조 살펴보기 2단계: 폴더와 기본 파일 구성하기 3단계: 기본 구조와 기본 스타일 작업하기 06 메인 페이지 작업하기 06-1 메인 페이지 구조 작업하기 1. 인포메이션 영역의 구조 작업하기 2. 헤더 영역의 구조 작업하기 3. 슬라이더 영역의 구조 작업하기 4. 최근 글 영역, 인기 글 영역의 구조 작업하기 5. 갤러리 영역의 구조 작업하기 6. 인기 검색어 영역의 구조 작업하기 7. 배너 영역의 구조 작업하기 8. 소셜 네트워크 영역의 구조 작업하기 9. 푸터 영역의 구조 작업하기 06-2 메인 페이지 반응형 웹 작업하기 1. 인포메이션 영역의 반응형 웹 작업하기 2. 헤더 영역의 반응형 웹 작업하기 3. 슬라이더 영역의 반응형 웹 작업하기 4. 최근 글 영역, 인기 글 영역의 반응형 웹 작업하기 5. 갤러리 영역의 반응형 웹 작업하기 6. 인기 검색어 영역의 반응형 웹 작업하기 7. 배너 영역의 반응형 웹 작업하기 8. 소셜 네트워크 영역의 반응형 웹 작업하기 9. 푸터 영역의 반응형 웹 작업하기 07 서브 페이지 작업하기 07-1 서브 페이지 구조 작업하기 1. 기본 구조 작업하기 2. 소개 페이지의 구조 작업하기 3. 갤러리 페이지의 구조 작업하기 4. 게시판 페이지의 구조 작업하기 07-2 서브 페이지 반응형 웹 작업하기 1. 기본 스타일 작성하기 2. 소개 페이지의 반응형 웹 작업하기 3. 갤러리 페이지의 반응형 웹 작업하기 4. 게시판 페이지의 반응형 웹 작업하기 08 마무리 작업하기 08-1 CSS 파일로 분리하기 스타일 코드를 CSS 파일로 분리하기 08-2 자바스크립트 이용해 메뉴 영역 작업하기 메뉴가 나타나거나 감춰지는 토글 버튼 만들기 [스페셜] 실무자들이 꼭 알아야 할 반응형 웹 문제해결 노하우 01 반응형 웹사이트 테스트하기 02 하위 브라우저에 대응하기 03 플렉서블 박스를 지원하지 않는 브라우저에 대응하기 04 고해상도 기기 이미지 대응하기 05 서버 측 반응형 웹 접근 방법 [도전★ Quiz!] |
저자 소개
저자 : 김운아
저자는 서비스 기획, 웹 디자인, 개발까지 1인 3역을 해내는 멀티플레이형 웹 퍼블리셔이자 현재 파라우치(parauch)의 공동 창업자다. 플래시 초창기 시절부터 웹의 변화 과정을 하나씩 경험하며 UI/UX, 프론트 엔드, 백 엔드까지 웹 전반에 걸쳐 두루 섭렵했다.
이제 그동안의 노하우를 집대성해 더욱 효과적으로 구현할 수 있는 반응형 웹 디자인 방법, 그리고 미래를 이끌어갈 새로운 방향의 반응형 웹 디자인 방법까지 이 책을 통해 명쾌하게 설명하고 있다.
전공이나 경력에 상관없이 누구나 웹 퍼블리셔가 될 수 있다고 자신있게 말하는 저자는 ‘HTML5 + CSS3’ 강의와 수많은 홈페이지 제작 경험을 통해 쌓은 풍부한 감각을 토대로 기획자와 디자이너 그리고 개발자가 가장 효율적으로 웹사이트를 제작할 수 있는 방법을 공유하고 있다.
이제 그동안의 노하우를 집대성해 더욱 효과적으로 구현할 수 있는 반응형 웹 디자인 방법, 그리고 미래를 이끌어갈 새로운 방향의 반응형 웹 디자인 방법까지 이 책을 통해 명쾌하게 설명하고 있다.
전공이나 경력에 상관없이 누구나 웹 퍼블리셔가 될 수 있다고 자신있게 말하는 저자는 ‘HTML5 + CSS3’ 강의와 수많은 홈페이지 제작 경험을 통해 쌓은 풍부한 감각을 토대로 기획자와 디자이너 그리고 개발자가 가장 효율적으로 웹사이트를 제작할 수 있는 방법을 공유하고 있다.
품목정보
- 발행일
- 2014년 07월 10일
- 쪽수, 무게, 크기
- 275쪽 | 589g | 188*257*10mm
- ISBN13
- 9788997390427
출판사 리뷰
|
기획자, 디자이너, 개발자 모든 분야에서 경쟁력을 갖춘 웹 퍼블리셔의 스킬 대공개!
서비스 기획, 웹 디자인, 개발까지 1인 3역을 해내는 멀티플레이형 웹 퍼블리셔인 저자가 가장 효율적으로 웹사이트를 제작할 수 있는 노하우를 이 책에 집대성해 놓았다. 모든 기기와 다양한 화면 크기에 대응할 수 있는 반응형 웹은 HTML5, CSS3와 함께 익혀야 할 웹 퍼블리싱의 필수 기술이다. 이제는 개발자뿐만 아니라 기획자, 디자이너도 반응형 웹 디자인에 대해 알아야 하고 공부해야 한다. 《Do it! 반응형 웹 디자인》은 가변 그리드, 미디어 쿼리와 뷰포트 그리고 플렉서블 박스까지 반응형 웹을 위한 모든 기술을 쉬운 예제를 따라하며 차근차근 하나씩 배울 수 있게 총정리되어 있다. 매우 현실적이면서도 유익한 기술과 이론을 배우고 나면 전공이나 경력에 상관없이 누구나 웹 퍼블리셔가 될 수 있다! 헷갈리기 쉬운 반응형 웹의 기본 개념부터 급부상하고 있는 새로운 웹 기술 플렉서블 박스까지 완벽 해설! 모든 기기에 최적화된 반응형 웹사이트를 더욱 효과적으로 구현할 수 있는 방법뿐만 아니라 미래를 이끌어갈 새로운 방향의 반응형 웹 디자인 방법인 플렉서블 박스 기술까지 명쾌하게 설명하고 있다. 실제 디자인을 반응형 웹으로 변환하는 과정을 익히고 나면 빠르게 변하는 디자인 트랜드에 맞춰 클라이언트에게 감동을 줄 수 있다! 초보자도 쉽게 따라할 수 있는 예제로 실습하고, 실무에 그대로 적용할 수 있는 웹사이트도 직접 완성한다 《Do it! 반응형 웹 디자인》은 업무 효율성은 물론이고, 만들고자 하는 사이트의 완성도도 한층 높일 수 있도록 반드시 익혀야 할 핵심 기술들을 다양한 실무 예제와 함께 소개하고 있다. 뿐만 아니라 소개 페이지, 갤러리 페이지, 게시판 페이지 등 현장에서 바로 적용할 수 있도록 하나의 웹사이트를 완성하는 과정을 자세히 소개하고 있다. 이 책을 마스터하고 나면 웹사이트 기획 단계부터 PC 화면과 태블릿, 모바일 화면까지 미리 예상하고 구체화할 수 있다. 또한 많은 프로젝트를 진행해 본 저자의 노하우를 엿볼 수 있는 스페셜 코너가 있다. 바로 반응형 웹을 제작하는 도중에 발생할 수 있는 문제들을 바로 해결할 수 있도록 ‘실무자들이 꼭 알아야 할 반응형 웹 문제해결 노하우’이다. 저자의 무료 강의 동영상으로 더 쉽게 공부하세요! 각 장에서 중요한 내용들만 쏙쏙 뽑아 설명하는 저자의 무료 동영상 강의를 무료로 공개하고 있다. 특히 아직은 생소한 플렉서블 박스 기술을 쉽게 풀어서 설명한다. 이 동영상은 PC나 스마트폰 어디에서나 이용할 수 있으므로 이동 중이나 예습, 복습할 때 이용하면 효율적이다. www.easyspub.com → [동영상 강의] 게시판 |
