'스타트렉' 사이트 입점하고자 하는 CP 강사님들은 관리자메일로 문의해주세요!

웹퍼블리셔 실무코딩 - 웹사이트 레이아웃 실무코딩 따라하기
1 Part 1 : 상단 디자인 - 네비게이션 및 로그인
2 전체 프리미티브 버전 레이아웃 코딩하기1 동영상다운
3 전체 프리미티브 버전 레이아웃 코딩하기2 - container1 동영상다운
4 전체 프리미티브 버전 레이아웃 코딩하기3 - 음영주기 동영상다운
5 전체 프리미티브 버전 레이아웃 코딩하기4 - 위아래 가운데 정렬 동영상다운
6 전체 프리미티브 버전 레이아웃 코딩하기5 - 푸터에 container 삽입 동영상다운
7 전체 프리미티브 버전 레이아웃 코딩하기6 - 리셋 파일 만들기 동영상다운
8 전체 프리미티브 버전 레이아웃 코딩하기7 - 마무리 동영상다운
9 [tip] placehold 이미지 대체기법 사용하기 동영상다운
10 [tip] lorempixel 이미지 대체기법 사용하기 동영상다운
11 [tip] lorempixel 이미지 대체기법 사용하기 - 흑백 전환 동영상다운
12 [tip] lorempixel 이미지 대체기법 사용하기 - 카테고리 랜덤 동영상다운
13 Primitive Version 주석 코드 정리 동영상다운
14 헤더영역 마크업 코딩1 - 각 메뉴 영역 코딩하기 동영상다운
15 헤더영역 마크업 코딩2 - css 정의하기 동영상다운
16 [특강] float, inline 속성 이해하기1 동영상다운
17 [특강] float, inline 속성 이해하기2 동영상다운
18 [특강] float, inline 속성 이해하기3 동영상다운
19 [특강] float, inline 속성 이해하기4 동영상다운
20 [특강] float, inline 속성 이해하기5 - float 레이아웃 동영상다운
21 헤더영역 스타일 코딩1 - 상단메뉴 인라인 동영상다운
22 헤더영역 스타일 코딩2 - 글자지정 및 대문자 지정 동영상다운
23 헤더영역 스타일 코딩3 - 상단메뉴 float 속성 지정 동영상다운
24 리셋파일 추가 동영상다운
25 헤더영역 스타일 코딩4 - 로고 위치 지정 동영상다운
26 헤더영역 스타일 코딩5 - 네비게이션 메뉴 웹폰트 적용 동영상다운
27 지금까지의 헤더영역 작업한 소스코드 정리 동영상다운
28 의미와 범위를 넓혀주는 label label for 사용법 동영상다운
29 헤더영역 로그인폼 코딩하기1 - 밑그림 동영상다운
30 헤더영역 로그인폼 코딩하기1 - fieldset dl dt dd 태그 사용법 동영상다운
31 헤더영역 로그인폼 코딩하기2 - 아이디 비밀번호 입력 폼 동영상다운
32 헤더영역 로그인폼 코딩하기3 - ID저장 로그인버튼 이미지 동영상다운
33 헤더영역 로그인폼 코딩하기4 - 로그인 Div 박스 틀 다듬기 동영상다운
34 헤더영역 로그인폼 코딩하기5 - 마무리 동영상다운
35 헤더영역 로그인폼 CSS 코딩1 - 작업할 클래스 부여 동영상다운
36 헤더영역 로그인폼 CSS 코딩2 - 작업할 스타일시트 정의하기 동영상다운
37 헤더영역 로그인폼 CSS 코딩3 - 전체 박스 포지션 기준점 설정 동영상다운
38 헤더영역 로그인폼 CSS 코딩4 - 기준점 잡아서 로그인 헤더영역 위치잡기 동영상다운
39 헤더영역 로그인폼 CSS 코딩5 - 아이디 비번 안보이게 스타일 처리 동영상다운
40 헤더영역 로그인폼 CSS 코딩6 - 텍스트 입력 폼 스타일 모양 변경 동영상다운
41 지금까지의 작업들 코드정리 동영상다운
42 헤더영역 로그인폼 CSS 코딩7 - ID저장 로그인버튼 위치 조정 동영상다운
43 헤더영역 로그인폼 CSS 코딩8 - ID저장 정밀하게 간격 재조정 동영상다운
44 헤더영역 로그인폼 CSS 코딩9 - 로그인버튼 간격 재조정 동영상다운
45 헤더영역 로그인폼 CSS 코딩10 - 로그인 푸터영역 위치 조정 동영상다운
46 헤더영역 로그인폼 CSS 코딩11 - 아이디 회원가입 글자 간격 조정 동영상다운
47 헤더영역 전체 마무리 동영상다운
48 Part 2 : 갤러리 레이아웃
49 강의개요 - 갤러리 레이아웃 동영상다운
50 강의파일 구성 및 설명 동영상다운
51 갤러리 레이아웃 마크업1 - div 구성 동영상다운
52 갤러리 레이아웃 마크업2 - 마무리 동영상다운
53 갤러리 레이아웃 CSS 코딩1 - 구성 동영상다운
54 갤러리 레이아웃 CSS 코딩2 - 상단쪽 동영상다운
55 갤러리 레이아웃 CSS 코딩3 - inline-block 속성 이해하기 동영상다운
56 갤러리 레이아웃 CSS 코딩4 - 박스크기 및 마우스 on 색상반전 처리 동영상다운
57 갤러리 레이아웃 CSS 코딩5 - 원만들기1 동영상다운
58 갤러리 레이아웃 CSS 코딩6 - 원만들기2 동영상다운
59 포토샵으로 이미지 잘라서 갤러리 멋있게 꾸미기 동영상다운
60 전체적인 갤러리 디자인 밸런스 조정 - 마무리 동영상다운
61 Tip - li 태그 사이의 불필요한 간격을 없애주려면 - CSS로 처리 동영상다운
62 Tip - li 태그 사이의 불필요한 간격을 없애주려면 동영상다운
63 Tip - li 태그 사이의 불필요한 간격을 없애주려면 - 마이너스 사용 동영상다운
64 Part 3 : 콘텐츠영역 레이아웃 디자인(폰트 아이콘)
65 강의개요 - 콘텐츠영역 레이아웃 디자인 동영상다운
66 HTML 마크업1 - 컨테이너 작성 동영상다운
67 HTML 마크업2 - 아이템 마크업 동영상다운
68 HTML 마크업3 - 아이템 li 태그 요소들 정리 동영상다운
69 HTML 마크업4 - Div 클래스명 정리 동영상다운
70 CSS 코딩1 - 각 요소들 선택자 정의 동영상다운
71 CSS 코딩2 - 패딩 옵션 3개짜리 설명 동영상다운
72 CSS 코딩3 - h2 p 간격 설정 동영상다운
73 CSS 코딩4 - p 글자 간격 line-height 동영상다운
74 CSS 코딩5 - innerbox 정의 동영상다운
75 CSS 코딩6 - inline과 float left 속성 차이점 동영상다운
76 CSS 코딩7 - li 한개요소 정의 동영상다운
77 CSS 코딩8 - 애니메이션 영역 block 속성 동영상다운
78 CSS 코딩9 - position relative absolute 완벽 이해시키기 동영상다운
79 CSS 코딩10 - 기준점이 없으면 동영상다운
80 CSS 코딩11 - 소제목 타이틀 정의 동영상다운
81 지금까지의 CSS 코드 정리하기 동영상다운
82 font-awesome 사용법1 - cdn 주소삽입 및 폰트 아이콘 사용하기 동영상다운
83 font-awesome 사용2 - 아이콘 확대 축소 - 가운데 정렬 - 스핀 애니메이션 동영상다운
84 font-awesome 사용3 - 스킨 애니메이션 크게 도는거 수정하려면 동영상다운
85 font-awesome 사용4 - 나머지 사용법들을 익히려면 동영상다운
86 li 태그 맨 우측 부분의 여백이 안나타나게 하려면 동영상다운
87 li 태그 맨 우측 부분의 여백이 안나타나게 하려면2 동영상다운
88 li 태그 맨 우측 부분의 여백이 안나타나게 하려면 - span 블럭으로 처리1 동영상다운
89 li 태그 맨 우측 부분의 여백이 안나타나게 하려면 - span 블럭으로 처리2 동영상다운
90 선택자 소속 관계 찾아들어가는 다양한 방법들 동영상다운
91 li 태그 맨 우측 부분의 여백이 안나타나게 하려면 - 플랜B 차선책 동영상다운
92 강의를 마무리하면서.. 동영상다운
93 Part 4 : 하단 디자인 - Footer 레이아웃
94 강의개요 - 하단디자인 레이아웃 동영상다운
95 Basic CSS 파일 설명 동영상다운
96 하단디자인 마크업1 - 기본 프레임 구성 동영상다운
97 하단디자인 마크업2 - 푸터 콘텐츠 영역 작성 동영상다운
98 하단디자인 마크업3 - 푸터 콘텐츠 영역 마무리코딩 동영상다운
99 하단디자인 CSS 코딩1 - 스타일정의 동영상다운
100 하단디자인 CSS 코딩2 - footer 및 footer-top 동영상다운
101 하단디자인 CSS 코딩3 - footer-wrap 동영상다운
102 하단디자인 CSS 코딩4 - footer-wrap 마무리 동영상다운
103 하단디자인 CSS 코딩5 - 로고영역 동영상다운
104 하단디자인 CSS 코딩6 - 푸터 컨텐츠 나머지영역 간격 동영상다운
105 하단디자인 CSS 코딩7 - title 동영상다운
106 하단디자인 CSS 코딩8 - 전화번호 동영상다운
107 하단디자인 CSS 코딩9 - 계좌정보 동영상다운
108 하단디자인 CSS 코딩10 - 색상정리 동영상다운
109 하단디자인 CSS 코딩11 - P태그 A태그 정의 동영상다운
110 하단디자인 CSS 코딩12 - 하이라이트 효과 만들기 동영상다운
111 하단디자인 CSS 코딩13 - 폰트아이콘 동영상다운
112 하단디자인 CSS 코딩14 - 폰트아이콘으로 디자인완성도 높이기 동영상다운
수강기간 : 2개월 / 수강료 : \220,000



★★★ 본 강의는 HTML5/CSS3 실무코딩 과정입니다. ★★★
★★★ 자세한 강의개요는 아래 설명글을 찬찬히 읽어주십시오! ★★★

이 강좌는 웹사이트 실전/실무코딩 과정입니다.
따라서 HTML5, CSS3 기본은 알고 있는 유저들을 대상으로 합니다.
즉, HTML5, CSS3 등을 배웠는데 실전/실무 웹사이트 제작 경험이 없는 사람들에게 실전적인 코딩 및 퍼블리싱 노하우를 가르쳐줍니다.

실전 코딩을 처음 해보면 사실 쉽지가 않습니다.
영어 문법을 배웠다고 회화를 잘하는게 아닌 것처럼요.
HTML, CSS를 배웠다해서 사이트 코딩이나 퍼블리싱을 잘하는건 아닙니다.
본 과정을 끝까지 잘 학습한다면 여러 웹퍼블리싱 실무 기법과 웹디자인 코딩을 배우게 됩니다.

모든 과정을 하나하나 타이핑치면서 강의합니다.
결과를 보여주는 하드코딩 방식이기 때문에 사이트가 만들어져가는 과정과 변화되어져 가는 모든 과정과 모습을 볼 수 있습니다.
그렇기 때문에 이해가 책을 통해서 배우는 것과는 비교가 안될 정도로 잘 되어집니다.

아무튼,
이 정도 레벨의 웹사이트 코딩 및 퍼블리싱을
혼자 처음부터 다 해보는 경험을 한다면 많은 자신감이 생길 것입니다.

.
.

HTML, CSS 강의 듣는다해서 코딩이 바로 되는건 아닙니다.
HTML/CSS 문법은 가볍게 배우고 이런 실전 강의를 많이 보고 따라하세요.
그리고 중요한건 혼자 연구하는 시간을 많이 가지세요.
그게 남들보다 더 많은 연봉을 받게 해줍니다.

요즘 신입도 잘 안뽑는다는데 웹디자이너나 웹퍼블리셔 경력자로 바로 취업을 하고 싶다면 이런 강의를 많이 들으시고 많이 연습하세요.
많이 해보면 코딩이나 퍼블리싱도 당연히 늘게 되어 있습니다.
연습이 최고의 학습입니다.^^

[AD] 데브렉 사이트 VIP Freepass 전과정 자유이용권 혜택보기
홈 회사소개 이용약관 개인정보 보호정책 이용안내 Q&A FAQ Guide