퍼블리셔 취업을 위해 제대로 배워보는 html과 css, 그리고 웹표준

퍼블리셔 취업을 위해 제대로 배워보는 html과 css, 그리고 웹표준

(16개의 수강평)

712명의 수강생
22,000원
지식공유자 · Dongho Lee
84회 수업 · 총 40시간 41분 수업
평생 무제한 시청
수료증 발급 강의
수강 난이도 '입문'

제대로 배워보는 퍼블리싱 - HTML, CSS, 실전 웹표준

학원에서 실제 강의하는 내용을 정리했습니다. html과 css의 기초를 다지고, 다양한 실습을 진행하도록 준비했습니다. 취업을 위해 웹 표준의 기초를 다질 수 있는 기회를 찾고 계신다면, 이 기회를 잡으시기 바랍니다.

또, 학원을 다니고 싶지만 시간의 여유가 없으신 분에게도 좋은 기회가 되리라 믿습니다. 모든 프론트엔드 개발자에게 유용하진 않을 수 있습니다. 빠르게 흘러가는 웹트렌드 속에서 수많은 프레임웍과 라이브러리를 접하고 싶은 분은 좀 더 짧고 간결한 강의가 오히려 도움이 될 것입니다.
그럼 이 강의를 접하는 분들에게 다소나마 도움이 되기를 바라며...

학습 목표

  • 웹표준 기초인 html과 css를 마스터하고 실전 웹페이지를 제작해 봅니다.
  • 웹 퍼블리셔로 취업이 가능한 정도의 지식을 전달합니다.

배우는 것들

  • HTML, CSS 요소들의 개념과 문법
  • 최적화된 마크업 기법, 테이블, 박스모델, 크로스브라우징, CSS3, 미디어쿼리, 반응형 등.
  • 실무예제 : 반응형 웹 구현, 탭메뉴, 여러가지 형태의 list 구현, 이메일코딩, 웹사이트 만들기 등.


도움이 되는 분들

  • 웹퍼블리셔로 취직이나 전직을 원하는 분
  • 이쁜 화면을 그대로 웹 화면으로 구현하고 싶은 분
  • html과 CSS 를 제대로 배워보고 싶은 분
  • 개념없이 경험으로만 퍼블리싱에 의존하는 분
  • 프론트엔드 개발자로 입문하고자 하는 분
  • 학원을 다니기엔 시간이 부족한 분

웹표준 퍼블리셔 과정

  • html & CSS기초 학습하기
  • 개념에 대한 정확한 이해
  • 웹표준 각종 실습진행
  • html5 & CSS3 문법 알아보기
  • 웹페이지 제작 실습

 지식공유자 소개

이동호
현) 하이미디어 강사 전) 모노라움 / 더조은 / 현대직업전문학교 / 방송정보교육원 / 디자인티모(글로벌IT) / 경원직업전문학교 / 한국직업전문학교 강사 전) 홍익대학교 방학특강 / 성신여자대학교 방학특강

교육과정

모두 펼치기 84 강의 40시간 41분
섹션 0. 프로그램(Editor) 설치 및 준비
2 강의 23 : 00
emmet(zen-coding) 설치
11 : 00
dummy text, dummy image 작성방법
12 : 00
섹션 1. html 작성 기초
5 강의 80 : 00
웹표준이란?
10 : 00
html 태그 작성 문법
10 : 00
문서형 선언, 언어 지정, 문자 코드 셋 지정하기
25 : 00
meta요소 알아보기
20 : 00
html템플릿 작성하기
15 : 00
섹션 2. 각종 html 요소 알아보기
13 강의 255 : 00
문자 실체 참조와 수치 문자 참조 적용
07 : 00
구문을 강조하거나 하이라이팅 지정하기
13 : 00
단의어 정의와 약어, 작품의 제목 표현
16 : 00
루비 주석과 시간의 표현
11 : 00
제목, 문단, 연락처, 인용문
25 : 00
목록 작성하기
17 : 00
테이블 작성하기
22 : 00
a요소 알아보기
25 : 00
img요소 알아보기
21 : 00
이미지맵 만들기
18 : 00
아이프레임 알아보기
07 : 00
폼 컨트롤 알아보기
41 : 00
html5에서 추가 된 폼 콘트롤과 속성들
32 : 00
섹션 3. 웹페이지 코딩 실습
3 강의 147 : 00
그룹화와 섹셔닝
48 : 00
웹 페이지 제작(Markup) 실습 1
24 : 00
웹 페이지 제작(Markup) 실습 2
75 : 00
섹션 4. css 기초
3 강의 126 : 00
html 문서에 css 적용하기, css 연결하기
23 : 00
css값, 길이와 색상 알아보기
32 : 00
css 선택자와 선택자의 우선순위
71 : 00
섹션 5. 폰트 스타일
4 강의 95 : 00
폰트와 텍스트 스타일
32 : 00
@font-face와 구글폰트 적용
31 : 00
단어 깨트리기, 줄바꿈 지정하기
21 : 00
목록 관련 스타일
11 : 00
섹션 6. 박스모델과 배경 스타일
2 강의 79 : 00
박스모델 알아보기
38 : 00
배경 스타일 알아보기
41 : 00
섹션 7. 테이블 관련 스타일
1 강의 17 : 00
테이블 관련 스타일 알아보기
17 : 00
섹션 8. 배치(레이아웃) 관련 스타일
4 강의 92 : 00
플롯 지정하기
27 : 00
플롯 해지하기
14 : 00
포지션 지정하기
32 : 00
포지션을 활용한 가운데 위치 지정
19 : 00
섹션 9. EMS, 이벤트 제작 실습
3 강의 81 : 00
이메일 페이지 제작 실습 1
29 : 00
이메일 페이지 제작 실습 2
15 : 00
이벤트 페이지 제작 실습
37 : 00
섹션 10. 예제 만들어보기 (네이버 Nuli)
24 강의 767 : 00
Box1 - 제목, 내용, 더보기
52 : 00
Box2 - 모서리 라운드 처리
35 : 00
Box3 - 수직 가운데 정렬 1
15 : 00
Box3 - 수직 가운데 정렬 2
07 : 00
Button - 텍스트버튼
41 : 00
Button - 텍스트버튼아이콘
12 : 00
paginate - 게시판의 페이징 부분
38 : 00
menu - 탭메뉴, 메뉴 1
52 : 00
menu - 탭메뉴, 메뉴 2
13 : 00
faq list - 질문과 답변 목록
33 : 00
list - 갤러리 형식의 목록 1
54 : 00
list - 갤러리 형식의 목록 2
03 : 00
list - 갤러리 형식의 목록 3
15 : 00
list - 이미지와 텍스트 목록 1
25 : 00
list - 이미지와 텍스트 목록 2
10 : 00
list - 이미지 하단에 텍스트가 있는 목록 1
19 : 00
list - 이미지 하단에 텍스트가 있는 목록 2
16 : 00
list - 다음(Daum) 메인페이지 이미지 목록
62 : 00
list - 다음(Daum) 부동산 메뉴
67 : 00
table - 테이블 작성 예제
33 : 00
form - 로그인 만들기 1
77 : 00
form - 로그인 만들기 2
17 : 00
layout - 레이아웃 실습 1
57 : 00
layout - 레이아웃 실습 2
14 : 00
섹션 11. 웹 페이지(subcide.com) 만들어보기 실습
3 강의 99 : 00
웹 페이지 html 실습
22 : 00
웹 페이지 css 실습
59 : 00
웹 페이지 link 실습
18 : 00
섹션 12. css3 알아보기
9 강의 275 : 00
css3 선택자 알아보기
42 : 00
그림자처리, 말줄임표현, 투명도 지정하기
39 : 00
멀티칼럼&둥근모서리 지정하기
29 : 00
추가 된 배경처리 알아보기 & 그라데이션 적용
30 : 00
박스사이징&플렉스 지정하기
13 : 00
transition 지정하기
25 : 00
animation 지정하기
21 : 00
transform 지정하기
50 : 00
filter 지정하기
26 : 00
섹션 13. 반응형 웹 알아보기
2 강의 81 : 00
미디어쿼리 알아보기
27 : 00
반응형 웹 페이지 실습하기
54 : 00
섹션 14. 웹 사이트 제작 실습
6 강의 224 : 00
최적화 된 웹사이트 마크업 작성하기 1
72 : 00
최적화 된 웹사이트 마크업 작성하기 2
15 : 00
기본 스타일 지정하기 1
50 : 00
각 부위별 스타일 지정하기
54 : 00
웹페이지실습 - script
18 : 00
웹호스팅 설정 & FTP활용 파일 전송
15 : 00

공개 일자

2018년 6월 19일 (마지막 업데이트 일자 : 2018년 11월 6일)

수강 후기

4.9
16개의 수강평
가빈 8달 전
정말 좋은 강의입니다. (아직 전부 듣지 않아서 완강하면 추가로 후기 쓰겠습니다) 컴퓨터학원도 없는 시골에 살아서 온라인으로 배울 수 밖에 없었는데, 이 강의를 듣기 전까지는 비전공자로서 독학하는 것이 너무 힘들었습니다. 책도 여러권 사보고 이런 저런 인터넷 강의를 들어봤는데 그냥 따라만 해보게 되어있고 잘 와닿지가 않았습니다. 그런데 이거 들으면서 그동안 궁금했던 부분들이 뻥 뚫리듯 시원하게 풀리고 있습니다. 기초 지식과 실제 어떻게 쓰이는지 전혀 연결이 안되었는데 정말 그런 부분 설명 잘해주시고, 오프라인 학원 갈 수 없는 사람들에게 꿀같은 강의입니다. 열심히 공부하겠습니다. 좋은 강의 만들어주시고 저렴하게 배포해 주셔서 매우 감사드립니다.
서유라 2달 전
IT 문외한입니다. 비전공이고, 대학생입니다. 올해부터 웹을 무작정 배우게 된 사람입니다. 올해 1월, 제가 만들고 싶은게 있어서 프로젝트를 팀과 같이 만들기로 했었습니다. 그 프로젝트를 하기 전 저보고 프론트를 하라며 지인이 이 강좌가 할인을 할 때 저에게 이 강좌를 들어보라며 추천해주었습니다. (그 분은 이 강좌를 들어본 적은 없습니다. html, css 초기본만 안다고 했습니다. 그냥 백앤드 개발자). 그 분 계정으로 거의 90% 이 강좌를 봤었고, 지금은 제 계정으로 결제해서 생각이 안나는 부분만 봅니다. 그 프로젝트는 무산되고 저 혼자만 하고 있고, 지금 서비스를 하고 있습니다. 매달 서버 비용에 비해 광고비는 안 나오는 적자이긴 하지만...^^ 정말 정말 만들고 싶은 게 있어서 만들게 되었고, 지금은 한달에 순 방문자가 1000명 정도 됩니다. 나중에 백앤드를 더 배워서 게시판 같은 것이라던지, 안드로이드 앱을 만들어 클라이언트에 제공하면 본전이라도 뽑을 거라고 제 자신을 믿고 있습니다. 이 강좌를 보기 전엔 "이거 무조건 다 보고 만들기 시작해야지" 했는데요. 근데 이걸 한 80% 정도를 보고 내가 직접 해보고 이해하다 보니깐 욕구는 강좌 완강을 목표한 걸 이길 수 없었네요 ㅋㅋ 머릿속으로 이런 디자인은 css 이렇게 만들면 되겠네~! 그런 게 다 그려지니까요 또 css가 참 재밌습니다. 그렇게 부트스트랩 하나도 안 쓰고 약 2일에 걸쳐 원하는 디자인을 만들게 되서 정말 기뻤던 기억이 ㅎㅎ 감사합니다 금액에 비해 좋은 강좌입니다.
Dongho Lee 프로필

Dongho Lee 2달 전
강좌가 부족한점이 많을텐데 도움이 되셨다니 정말 다행입니다. 서비스까지 하고 계시다니 무척 열심히 하신것 같아 기분이 좋아집니다. ^^ 감사합니다.

지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스