Training Class

HTML / CSS Intermediate.

웹표준 응용

일자         2019.10.05 ~ 2019.11.09

요일         주 1회 (토)

시간         14:30 ~ 18:30

장소         봄아카데미 오렌지룸

1개월 과정
336,000 원

강의 정보

HTML & CSS 란?

HTML은 웹 사이트를 만들기 위하여 사용하는 기본적인 프로그래밍 언어의 한 종류로, 웹 사이트를 다양하게 설계하고 수시로 변경할 수 있도록 CSS라는 스타일 시트와 함께 쓰입니다.

쉽게 설명해서 HTML이 웹 사이트의 몸체를 담당한다면 CSS는 옷과 액세서리 같이 꾸며주는 역할을 담당한다고 할 수 있습니다.

하나의 웹 사이트를 구성하는 웹 페이지들이 적게는 몇 십부터 많게는 수만까지 될 수 있으므로 웹 사이트는 규칙을 기반으로 디자인되어야하며 이렇게 만들어진 웹 사이트야말로 웹다운 큰 힘을 갖게 됩니다.

그러므로 디자이너는 HTML/CSS에 대한 충분한 이해로 크리에이티브한 시각언어를 규칙 안에 담아낼 때 현장감 있고 현실성 있는 좋은 웹 디자인을 만들어낼 수 있게 됩니다.

 

주요 특징

HTML/CSS의 선명해진 개념을 

손으로 익히며 훈련하는 단계

코드는 흔히 머리와 손으로 익혀진다고 말합니다. 머리로 이해하고 해보지 않으면 자신감이 없고, 반대로 이해 없이 손으로 해보기만 한다면 왜 이렇게 깨지는지, 왜 이런 속성이 필요하고 앞으로는 어떻게 될지 예측할 수 없는 반 쪽 공부가 됩니다.

이번 단계에서는 지난 강의에서 다져진 탄탄하고 깊은 이해를 바탕으로 실제 웹 사이트의 부분들을 엄선한 예제로 단순하고 큼직한 부분부터 복잡하고 오밀조밀한 디자인까지 실습을 통해 손으로 익히게 됩니다.

실습을 통해 상자 Box를 늘리거나 줄이고, 배치하는 등의 실제적이고 자세한 기법을 훈련함으로써 그림이 아닌 코드를 이용해 모양을 만드는 데 필요한 사고 방법의 숙달과 응용을 할 수 있게 됩니다.

또한, 특정 상황에서의 의미 있는 태그 사용, 접근성 그리고 좋은 디자인과 크로스브라우징을 동시에 생각하여 그 중 가장 많은 것을 얻을 수 있는 방법을 선택하는 훈련을 하게 됩니다.

지난 강의에서 깨우친 원리를 예제에 맞춰 다시 한번 설명 들음으로써 머리와 손으로 익혀져 단순히 아는 것에서 할 수 있는 것으로 발전하게 됩니다.

이 강의를 마칠 때쯤 여러분은 웹 사이트의 박스Box들을 코드로 말하는 방법과 본인이 의도하는 방향으로 응용해서 만들 수 있는 능력을 갖추게 될 것입니다.

매 강의마다 진화하는 정을수 강사의 HTML/CSS 강의는 이렇게 탄생했습니다.

HTML/CSS 강의의 원칙

최대한 쉽게 설명하여 누구나 이해할 수 있도록 할 것

점진적으로 향상되는 즐거움과 재미가 있을 것

최대한 일반인이 생각할 수 있는 단어와 그림으로 기술적 원리를 설명할 것

기술에 대한 폭넓은 이해, 디자인과 기술간의 인사이트를 경험하도록 할 것

실제 실무 작업과 괴리감이 없어 배운 것을 현장에서 적용할 수 있도록 할 것

HTML/CSS에 사용되는 강의자료(PDF) 총 700여장

HTML/CSS가 진행되어 온 기간 총 77개월 (2019년 5월 기준)

HTML/CSS를 거쳐간 학생의 수 총 1,100명

 

커리큘럼

Part1.

포털사이트의 게임 소개 영역

Part.2

포털사이트의 자동차 소식 영역

Part.3

포털사이트의 캐스트 영역

Part.4

포털사이트의 만화/웹툰 영역

Part.5

구조설계와 레이아웃

  • 전체적인 컨텐츠와 디자인을 검토

  • CSS구조와 레이아웃 구조를 설계

  • 컨텐츠와 디자인 특성에 맞게 마크업 시작

Part.6

브래드커럼스 / 서브메뉴 / 풋터

  • 접근성을 고려한 마크업

  • 추가되는 메뉴를 고려해 확장성있는 메뉴와 풋터 작업

Part.7

회사소개 페이지

  • 각기 다른 컨텐츠들을 관리하기 쉽도록 규칙을 만들어 작업

Part.8

제품, 서비스소개 페이지

  • 동일한 컨텐츠를 최소한의 CSS를 사용하여 효율성있게 작업

Part.9

입력양식 / 게시판

  • 접근성있는 입력양식을 디자인

  • 다양한 테이블에 규칙을 부여하고 스타일링 작업

Part.10

상단메뉴

  • 자바스크립트를 고려

  • 확장성 있는 메뉴를 위한 마크업과 스타일링

Part.11

메인 페이지

  • 메인페이지의 조밀하고 복잡한 메인 페이지를 실습

 

​강의 대상

  • HTML/CSS, Javascript를 배우려는 분

  • 책이나 강의를 들어도 이해가 어려운 분

  • 개념이 선명하지 않아 작업이 우연하게 이루어지는 분

  • 더 좋은 조건으로 이직하려는 디자이너 분

  • 프론트엔드 개발자가 되려는 분

강의 자료

강의 자료는 무엇인가요?

다년간 강의를 진행하면서 다듬어온 강사의 교육자료(PDF)와 단계별 훈련을 위해 준비한 실습 예제 파일을 아낌없이 공유해드립니다.

 

강의 결과물

결과물은 무엇인가요?

정을수 강사의 Understanding HTML/CSS 시리즈를 모두 거치게 되면 아래와 같은 디자인 작업물을 스스로의 힘으로 코딩할 수 있게 됩니다.

 
 

수강 안내

강의장비

- Apple iMac 21.5-inch

소프트웨어

- Adobe Photoshop CS6, Text Editor

 

 

교재

- 강사가 준비한 예제 파일

 

 

수강생 준비물

- 메모지, 필기구

강사 소개

 

자주 하는 질문

Q. 코드를 전혀 모르는 사람도 이 과정을 들을 수 있나요?

A. 예. 가능합니다. 본 과정은 비전공자의 눈높이에서 기초부터 차근차근 배울 수 있도록 진행합니다. 과정이 진행되는 동안 교육 내용을 이해하고, 잘 따라온다면 좋은 결실을 맺을 수 있습니다.

 

Q. 강의를 마치면 과제는 어느 정도인가요?

A. 배운 내용에 대한 복습을 위해 과제를 부여하고 있습니다. 과제에 대한 피드백을 개별적으로 제공합니다.

Q. 수업 준비물이 필요한가요?

A. 아니오. 강의실에서 실습할 수 있는 아이맥 PC가 세팅되어 있습니다. 물론, 개인 노트북을 지참하셔도 되며, 간단한 필기도구와 종이를 준비해오면 됩니다. 교재는 자체 제작된 교안을 무상으로 배포합니다.

 
 

현) 프리랜서 디렉터 및 디자이너

현) 봄아카데미 웹표준, 프론트엔드 강사

전) 펜타브리드 수석 디렉터

전) 메가존 웹표준화 팀장

 

프로젝트

- 2014~현재, Vom Academy 웹표준, 프론트엔드 개발 강의

- 2013~현재, (사)한국인터넷전문가협회 웹표준 강의

- 2011~2014, 아카데미정글 웹표준 강의

- 2013. 한국디자인진흥원 국가기간전략산업직종 UX/UI 디자인 4기 교육

- Godpeople.com 디자인팀 웹표준 교육

- 2013. 에스원 웹사이트 웹접근성 고도화 (디렉터)

- 2012. 에스원 웹사이트 구축 (PM)

- 2012. 현대 아산정주영 웹사이트 구축 (PM)

- 2012. 현대자동차국내판매 웹사이트 구축 (UI 디렉터)

- 2012. 삼성HSPOSM 웹사이트 구축 (PM)

- 2012. 코스콤 웹접근성 고도화 (PM)

정을수

프론트엔드 디벨로퍼, 봄아카데미 주강사

footer-logo.png
Bloom Your Possibility

​서울시 마포구 독막로9길 23 | 대표 백경찬 | 02-325-1500 | vomacademy@gmail.com

© 2019 VOMACADEMY