카페24에서 쇼핑몰을 만들 때 스마트 디자인 기능을 이용하면 정형화된 틀이 아닌 쇼핑몰 기능을 마음대로 추가 및 삭제하여 나만의 레이아웃으로 톡톡튀는 화면을 구축할 수 있습니다. 이 책은 카페24의 스마트 디자인 기법을 이용하여 기획 단계부터 시작하여 실제 운영 가능한 3종류 쇼핑몰(기본형, 블로그형, 쇼핑몰 + 홈페이지형)을 하나씩 만들어보면서 스마트 디자인 기능을 자연스럽게 익힐 수 있도록 구성하였습니다.

특징

이 책은 저자가 오랜 기간 카페24 및 직업학교에서 쇼핑몰 강의를 하면서 수강생들에게 받았던 질문들과 그동안 모은 자료들을 바탕으로 보다 고급화하고 차별화된 쇼핑몰 디자인을 구축하기 위해 기획되었습니다.

이 책의 앞부분은 혼자서도 할 수 있는 쇼핑몰 제작의 필요한 필수 프로그램의 설치 및 사용법을 설명하고 직접 따라하면서 배울 수 있도록 기본 기능과 따라하기 실무 예제를 구성하여 활용 능력을 키울 수 있도록 하였습니다.

본격적인 쇼핑몰 제작 따라하기 편에서는 쇼핑몰 레이아웃을 크게 기본형, 블로그형, 다중레이아웃 형으로 나누어서 포토샵의 디자인 작업부터 시작하여 쇼핑몰을 설계하고 코딩해서 제작하는 과정을 담고 있습니다. 또한, 추세에 맞추어 PC 버전의 쇼핑몰 제작과 연결하여 모바일 쇼핑몰도 제작하는 방법을 담았습니다.

후반부에는 구글 맵을 이용한 오시는 길 페이지 만들기와 SNS 로그인 연동, 인스타그램 연동 등을 통해 쇼핑몰을 더욱 풍성하게 만들어주는 방법을 제공합니다.

​

앱코모(http://www.appcomo.com)와 오레인보우(http://orainbow.co.kr) 대표이며, 네이버카페 앱코모(http://cafe.naver.com/appcomo)와 다음카페 한국종자나눔회(http://cafe.daum.net/seedshare) 운영자로 활동하고 있습니다.

카페 24 쇼핑몰 전문강사와 이찬진 컴퓨터교실 은평 지사장으로 컴퓨터 교육사업을 진행하였으며 현재 KTM 직업전문학교 전자상거래 전문강사로 활동하고 있습니다.

MCSE, OCP, CCNA 수료 GTQ 마스터, ITQ 마스터 등 다양한 자격증을 보유하고 있고 저서로는 [cafe24 스마트 디자인으로 인터넷 쇼핑몰 만들기], [cafe24로 실전 모바일 쇼핑몰 만들기], [한권으로 끝내는 쇼핑몰 창업&운영]이 있습니다.

PART1. 카페24 스마트 디자인 제작 기초

Chapter 01. 카페24 스마트 디자인이란?

Chapter 02. 레이아웃이란?

01. 기본형 원 레이아웃

02. 블로그형 원 레이아웃

03. 가로확장형 투 레이아웃

04. 쇼핑몰+홈페이지형 다중 레이아웃

Chapter 03. 제작하기 전 필수 프로그램 설치 및 사용법

01. FTP(파일질라)

02. 알툴바의 캡쳐 기능 이용하기

03. 폰트 설치 방법

04. 포토스케이프

05. 포토샵

Chapter 04. 기본적인 포토샵 기능 익히기

01. 간단한 배너 만들기로 레이어의 패널 이해

02. 문자 툴을 이용하여 행간 조정하기

03. 클리핑 마스크로 이벤트 페이지 만들기

04. 라쏘 툴을 이용한 누끼 작업

05. 이미지 두 장 합성하여 한 장으로 만들기

06. 레벨값 조절 및 색상 보정하기

07. 도장 툴을 이용하여 잡티 없애기

08. 사용자 패스 활용하여 팝업 만들기

09. 이미지 성형하기

10. 웹용 이미지 저장하기

Chapter 05. html&css 기본 기능 익히기

01. html 실행 방법

02. 기본 태그

03. 표 만들기

04. 목록 태그

05. 링크, 이미지 관련 태그

06. 프레임 태그 iframe

07. css 선택자 - 태그, 클래스, 아이디, 가상 선택자, 롤오버, 하이퍼링크

08. css로 레이아웃 만들기(영역 나누기)

09. html5

10. 자바스크립트. alert 경고창

11. html5&css 표 만들기

12. html5&css 메뉴 만들기

13. html5&css 배경

14. 구글 폰트 사용 방법

15. 이미지 맵

Chapter 06. 카페24 스마트 디자인 편집창의 이해

01. 카페24 스마트 디자인 편집창이란?

02. 카페24 스마트 디자인 편집창의 구성

03. 새 페이지 만들기

Chapter 07. 무료 디자인 다운로드

01. 카페24 디자인뱅크

02. pixabay

03. 그 외 유용한 이미지 다운로드 사이트

PART2. 카페24 스마트 디자인제작 기획 및 설계

Chapter 01. 잘나가는 쇼핑몰 벤치마킹하기

01. 네이버 파워링크, 사이트 검색순위로 벤치마킹하기

02. 다음 파워링크, 사이트 검색순위로 벤치마킹하기

03. 쇼핑몰의 대표 색상과 보조 색상 정하기

04. 화면의 적재적소에 구성요소 배치하기

Chapter 02. 쇼핑몰 디자인 기획 및 설계하기

01. 문서로 만드는 기획 및 설계

02. 이미지로 만드는 기획 및 설계

PART3. 카페24 스마트 디자인 쇼핑몰 만들기

Chapter 01. 기초 지식 알아보기

01. 카페24 기본 스마트 디자인 html 구조

02. 카페24 스마트 디자인 레이아웃 가이드 선 만들기

Chapter 02. 기본형 원 레이아웃 쇼핑몰 제작하기

01. 포토샵에서 기본형 원 레이아웃 디자인하기

02. 디자인 구성요소 만들기

03. 카페24 스마트 디자인으로 제작하기

Chapter 03. 블로그형 원 레이아웃 쇼핑몰 제작하기

01. 포토샵에서 블로그형 원 레이아웃 디자인하기

02. 디자인 구성요소 만들기

03. 카페24 스마트 디자인으로 제작하기

Chapter 04. 쇼핑몰+홈페이지형 다중 레이아웃 쇼핑몰 제작하기

01. 포토샵에서 홈페이지형 다중 레이아웃 디자인하기

02. 디자인 구성요소 만들기

03. 카페24 스마트 디자인으로 제작하기

PART4. 카페24 모바일 쇼핑몰 스마트 디자인 만들기

Chapter 01. 기본형 모바일 쇼핑몰 제작하기

Chapter 02. 쇼핑몰+홈페이지형 모바일 쇼핑몰 제작하기

PART5. 카페24 스마트 디자인 업그레이드 및 백업

Chapter 01. PC쇼핑몰+모바일 쇼핑몰

01. C스토어를 이용하여 메인 이미지를 메인롤링으로 변경하기

02. 인스타그램 추가하기

03. 간편 회원가입 SNS 로그인 만들기

04. 마우스 오버시 변경되는 로고 만들기

05. 구글 맵으로 오시는길 페이지 만들기

Chapter 02. 모바일 쇼핑몰

01. 앱 설치처럼 스마트폰 바탕화면에 바로가기 만들기

02. 롤링배너, 롤링팝업 만들기

Chapter 03. 디자인 백업 및 복구

01. 디자인 백업

02. 디자인 복구