메뉴 바로가기 검색 및 카테고리 바로가기 본문 바로가기

한빛출판네트워크

한빛랩스 - 지식에 가능성을 머지하다 / 강의 콘텐츠 무료로 수강하시고 피드백을 남겨주세요. ▶︎

인터랙티브 웹디자인북: 웹디자이너를 위한 HTML5+CSS3+jQuery 사용설명서

한빛미디어

집필서

절판

  • 저자 : 최성일
  • 출간 : 2015-04-27
  • 페이지 : 472 쪽
  • ISBN : 9788968481895
  • eISBN : 9788968489242
  • 물류코드 :2189
  • 초급 초중급 중급 중고급 고급
5점 (2명)
좋아요 : 42

필수 구문 40개와 9개의 실전 예제로 완성하는 인터랙티브 웹 만들기
이 책에서는 웹 디자인에 필요한3Step만 따라가면 인터랙티브 웹 예제 9개를 완성할 수 있다. HTML5, CSS3, jQuery 문법 중 실무에서 자주 쓰이는 구문 40개로 기초를 다진 후에, 9개의 실전 예제를 단계별로 따라하면서 자연스레 실무감각을 익힐 수 있다. 이제 복잡한 설명 없이 일단 이 책에 맞춰 실전부터 배우면서 인터랙티브 웹 사이트를 만들어보자.

 

기초 동영상 강의 제공, 저자 커뮤니티 운영, 출간 후에도 확실한 애프터 서비스!
저자가 직접 운영하는 블로그(http://blog.naver.com/hadaboni80)에서 ‘웹디자이너를 위한 기초 웹표준 실무 코딩’과 ‘HTML5, CSS3, jQuery 필수 구문 정리 40’ 동영상 강의를 제공한다. 또한 책에 관한 질문을 비롯해 웹에 관한 최신 트렌드 정보를 제공, 이 책을 학습한 이후에도 지속적으로 웹 분야를 학습할 수 있도록 지속적인 A/S를 지원한다.

▶ 강의, 예제소스 제공 http://www.hadaboni.net

 

【어떤 독자를 위한 책인가?】

  • 신입/초급 웹 디자이너 - 기본적인 HTML, CSS를 활용해 간단한 수준의 코딩은 가능하며 모바일 웹, 반응형 웹 등 모션 디자인을 적용하고 싶은 웹 디자이너  
  • 신입/초급 웹 퍼블리셔 - 일반적인 웹사이트 제작이 가능하며 간단한 기능의 플러그인이나 기존 소스 활용은 가능하나 고차원적인 모션 구현에 어려움을 느끼는 웹 퍼블리셔

 

 

▼ 인터랙티브 웹디자인북 소개영상

최성일 저자

최성일

서울 성균관대학교 예술학부에서 써피스디자인을 전공하고 웹 디자이너와 웹 퍼블리셔 그리고 프론트엔드 개발자를 거쳐 현재는 디자이너를 위한 인터랙티브 웹 제작의 실무교육 및 최신 웹 트랜드에 관한 특강을 진행하고 있다. 저자가 그러했듯이 비전공자라 하더라도 누구나 쉽게 크리에이티브한 웹 모션을 구현할 수 있다고 믿으며, 블로그(http://blog.naver.com/hadaboni80)를 통해 웹 디자인 실무에 관한 무료 동영상 튜토리얼을 제공하고 디자이너를 위한 HTML5, CSS3, jQuery 커뮤니티를 운영하고 있다.


【주요 프로젝트】

  • 대한주택보증 영문
  • 교육과정 평가원
  • 안산 예술의전당
  • 한국의 집
  • 쌍용자동차
  • 외교부 독도

 

CHAPTER 1. 왜 인터랙티브 웹인가?
  1.1 새로운 변화의 바람, HTML5 
  1.2 HTML5의 상용화는 과연 언제? 
  1.3 넘을 수 없는 4차원의 벽, JavaScript 
  1.4 JavaScript vs jQuery 
  1.5 작업환경 설정하기 
  1.6 예제 작업을 위한 템플릿 폴더 구조 및 파일 만들기 


CHAPTER 2. HTML5, CSS3, jQuery 필수 구문 정리
  SECTION 1 HTML5의 새로운 태그 
  SECTION 2 〈video〉 태그 
  SECTION 3 nth-child( ) 
  SECTION 4 text-shadow, box-shadow 
  SECTION 5 border-radius 
  SECTION 6 gradient 
  SECTION 7 background-size 
  SECTION 8 box-sizing 
  SECTION 9 transform(2d 변형) 
  SECTION 10 transform(3d 변형) 
  SECTION 11 transition 
  SECTION 12 animation 
  SECTION 13 mediaquery 
  SECTION 14 구글 웹 폰트 
  SECTION 15 웹 폰트 아이콘 
  SECTION 16 jQuery 선택자 
  SECTION 17 .css( ) 
  SECTION 18 .attr( ) 
  SECTION 19 jQuery 탐색 구문 
  SECTION 20 이벤트 연결하기 
  SECTION 21 .animate( ) 
  SECTION 22 변수 
  SECTION 23 문자열, 숫자 
  SECTION 24 연산자 
  SECTION 25 조건문(if문) 
  SECTION 26 반복문(for문) 
  SECTION 27 $(this) 
  SECTION 28 .index( ) 
  SECTION 29 .width( ), .height( ) 
  SECTION 30 .hide( ), .show( ), .fadeout( ), .fadeIn( ) 
  SECTION 31 .addClass( ), .removeClass( ) 
  SECTION 32 .text( ) 
  SECTION 33 .html( ) 
  SECTION 34 e.pageX, e.pageY 
  SECTION 35 .scrollTop( ) 
  SECTION 36 .offset( ).top 
  SECTION 37 .load( ), .play( ), .pause( ) 
  SECTION 38 new Date( ) 
  SECTION 39 setInterval( ) 
  SECTION 40 mousewheel.js 


CHAPTER 3. 실전 예제 작업하기
  SECTION 1배경 동영상을 활용한 웹 페이지 
    1.1 예제 둘러보기 
    1.2 Step by Step 
    1.3 DESIGNER's INTERVIEW 
  SECTION 2화면의 폭에 따라 변화는 웹 레이아웃(반응형 웹) 
    2.1 예제 둘러보기 
    2.2 Step by Step 
    2.3 DESIGNER's INTERVIEW 
  SECTION 3입체적으로 회전하는 웹 레이아웃 
    3.1 예제 둘러보기 
    3.2 Step by Step 
    3.3 DESIGNER's INTERVIEW 
  SECTION 4마우스 오버 시, 동영상이 재생되는 콘텐츠 박스 
    4.1 예제 둘러보기 
    4.2 Step by Step 
    4.3 DESIGNER's INTERVIEW 
  SECTION 5마우스 움직임에 따라 제어되는 이미지 시퀀스 
    5.1 예제 둘러보기 
    5.2 Step by Step 
    5.3 DESIGNER's INTERVIEW 
  SECTION 6시간에 따라 달라지는 웹 디자인 
    6.1 예제 둘러보기 
    6.2 Step by Step 
    6.3 DESIGNER's INTERVIEW 
  SECTION 7마우스 휠의 움직임에 따라 스크롤되는 웹 페이지 
    7.1 예제 둘러보기 
    7.2 Step by Step 
    7.3 DESIGNER's INTERVIEW 
SECTION 8가로로 스크롤되는 갤러리 페이지 
    8.1 예제 둘러보기 
    8.2 Step by Step 
    8.3 DESIGNER's INTERVIEW 
SECTION 9 z축으로 스크롤되는 웹 페이지 
    9.1 예제 둘러보기 
    9.2 Step by Step 
    9.3 DESIGNER's INTERVIEW 

쓸모없는 HTML/CSS/JS 사전 도서들만 돌아다니다가

 

실무중심의 반응형 웹디자인 개발 도서를 만났습니다.

 

바로 실전 예제 작업하기로 넘어가서 코드 짜시다가 모르는게 나오면 앞부분 HTML/CSS/JS 부분을 슬쩍 보시면 됩니다.

 

필자의 세심함이 느껴지는 책입니다.

직업은 편집디자이너이나 웹에 관심이 많은 나로서 한빛미디어의 인터랙티브 웹디자인북은 참 많은 도움이 되었다.
그 중 일부를 리뷰하고자 한다.
우선 표지는 눈에 잘 띄는 맑고 투명한 노란색인데.. 집중력이 흐트려질때쯤.. 책을 아무곳이나 두기 마련인데..
색상때문인지 눈에 자꾸 띄어 계속 쳐다보게 된다. 이것이 컬러의 힘인가..하하^^;;
깔끔한 텍스트 정리와 눈에띄는 컬러로 인해 기분까지 상쾌해지는 기분이다.

이 책은 문체가 대화체로 구성되어있다. 보통 프로그램서적은 순서만 딱딱하게 설명하는 경우가 많았는데..
대화체로 구성되어있어서 눈앞에 선생님이 있고 수업을 듣고있는 수강생의 기분을 느끼게 해준다.
거기에 부수적은 부가 설명까지 완벽하니 읽기에도 이해하기에도 술술~~
여지껏 웹을 배움에 있어 스크립트가 가장 큰 걸림돌이었는데 스크립트 구분을 하나하나 뜯어서 설명해 주어 이해가 참 쉬웠다.

공부가 살짝 지겨워질때쯤 중간중간 인터뷰가 나온다. 실제 현장에서 근무하는 디자이너들 프로그래머들의 이야기가 주를 이루는데..읽다보면.. 아 이런 분야도 있구나. 이렇게 공부를 해야되는구나.. 이쪽일의 비전은 이렇구나.. 라며 하나하나 느낄수있다.

편집쪽에 있다보니 웹쪽은 분위기가 어떨까 궁금하기도 했는데 이런 자투리 코너가 있다는건 나에게 사막의 오아시스랄까?
그런 기쁨을 맛보게 해주었다. 살짝 아쉬운점이 있다면... 본문과 인터뷰가 디자인이 비슷해서 눈에 잘 띄지 않는다는거.
중간에 배치해서 쉬는 텀에 읽을수있게 해준것은 좋았으나 인터뷰만 보고싶은 사람에게는 찾기가 좀 힘든 디자인은 아니었나 싶다.

본문중 CSS와 자바스크립트를 같이 작업해야되는 경우에는 분류를 확실히 해놓아 눈에 잘 띄게 디자인을 잡아놔서 헷갈리고 그런거는 없었다. 하나하나 실습해 가면서 아.. 이런 원리로 진행되는구나.. 라는걸 깨달을수있었다. 또한 구문옆에 설명글을 써놔서
이 버튼을 클릭하면 이렇게 변수가 들어가는구나.. 라는걸 한눈에 파악할수있었다. 보통 코딩만 해주고 알아서 해석하라.. 식이 많았는데 이 도서는 차근차근 설명해주어 초보자들에게 가장 적합한 도서가 아닌가 싶다.

한가지 개인적인 입장에서 살짝 아쉬운점은 숫자중 0에 점이 찍혀있는 폰트여서 글을 읽을때 숫자가 먼저 안보이고 점이 강조되어 보여 가끔 헷갈린다는 것인데.. 그건 개인적인 입장이니 패스~~

모든구문에 하나하나 친절하게 부가설명이 있어 한글만 읽어도 구문이 이해가 쏙쏙!!

또 하나의 장점은 공부하다가 이해가 안되는 구문은 동영상 강의까지 제공해주고 있었다.

이 책을 한마디로 정의하자면 친절하다 못해 너~~~무 친절한 책!! 스크립트를 처음 접해보는 친구라면 강추하고싶은 책이다.

결제하기
• 문화비 소득공제 가능
• 배송료 : 2,000원배송료란?

배송료 안내

  • 20,000원 이상 구매시 도서 배송 무료
  • 브론즈, 실버, 골드회원 무료배송
닫기

리뷰쓰기

닫기
* 상품명 :
인터랙티브 웹디자인북: 웹디자이너를 위한 HTML5+CSS3+jQuery 사용설명서
* 제목 :
* 별점평가
* 내용 :

* 리뷰 작성시 유의사항

글이나 이미지/사진 저작권 등 다른 사람의 권리를 침해하거나 명예를 훼손하는 게시물은 이용약관 및 관련법률에 의해 제재를 받을 수 있습니다.

1. 특히 뉴스/언론사 기사를 전문 또는 부분적으로 '허락없이' 갖고 와서는 안됩니다 (출처를 밝히는 경우에도 안됨).
2. 저작권자의 허락을 받지 않은 콘텐츠의 무단 사용은 저작권자의 권리를 침해하는 행위로, 이에 대한 법적 책임을 지게 될 수 있습니다.

오탈자 등록

닫기
* 도서명 :
인터랙티브 웹디자인북: 웹디자이너를 위한 HTML5+CSS3+jQuery 사용설명서
* 구분 :
* 상품 버전
종이책 PDF ePub
* 페이지 :
* 위치정보 :
* 내용 :

도서 인증

닫기
도서명*
인터랙티브 웹디자인북: 웹디자이너를 위한 HTML5+CSS3+jQuery 사용설명서
구입처*
구입일*
부가기호*
부가기호 안내

* 온라인 또는 오프라인 서점에서 구입한 도서를 인증하면 마일리지 500점을 드립니다.

* 도서인증은 일 3권, 월 10권, 년 50권으로 제한되며 절판도서, eBook 등 일부 도서는 인증이 제한됩니다.

* 구입하지 않고, 허위로 도서 인증을 한 것으로 판단되면 웹사이트 이용이 제한될 수 있습니다.

닫기

해당 상품을 장바구니에 담았습니다.이미 장바구니에 추가된 상품입니다.
장바구니로 이동하시겠습니까?

자료실

최근 본 상품1