Understanding HTML/CSS

깊이 이해하고 쉽게 배우는

Curriculum

대부분의 많은 분들이 “할 수 는 있지만 맞게 한건지는 모르겠다” 라고 말합니다. 코드는 정답이 있을 수 가 없지만 그 상황(디자인과 기획목적)에 맞는 가장 좋은 답을 찾는 것이므로 상황에 따른 좋은 코드가 되도록 지도를 받아야 합니다.

Understanding HTML/CSS 실무편

본과정은 HTML/CSS의 기본이 준비가 되신 분들께서 실제 업무에서 어떻게 class의 네이밍을 하고 어떻게 구조를 짜며 무엇을 기준으로 모듈화를 해나아가는지를 실습과 설명을 통해서 분명히 알아질 수 있도록 하는 과정입니다. 어떤 것이든 응용하면서 숙련되게 하는 것이 매우 중요합니다. 현재까지의 교육에서는 이런 부분들이 될 수 없는 아쉬운 환경이었지만 이 과정을 통해 좋은 기회가 되시면 좋겠습니다.

대부분의 많은 분들이 “할 수 는 있지만 맞게 한건지는 모르겠다” 라고 말합니다. 코드는 정답이 있을 수 가 없지만 그 상황(디자인과 기획목적)에 맞는 가장 좋은 답을 찾는 것이므로 상황에 따른 좋은 코드가 되도록 지도를 받아야 합니다. 이렇게 될 때 오래도록 꾸준히 성장하는 기술을 가지게 됩니다.

그러므로 본 과정은 실제 존재하는 사이트 하나를 선정해 메인페이지, 게시판, 단순 소개 페이지 등등의 특성이 있는 컨텐츠별로 작업을 직접 해보고 크리틱(코드지도)을 받는 방식의 수업입니다. 이런 과정을 통해 실무에서 실제 업무에서 일어나는 일들과 함께 그에 필요한 노하우가 코드연습과 함께 숙련되도록 합니다.

실무편 대상

  • 기초적인 마크업과 CSS를 하실 수 있으며 float과 clear를 이해 하시는 분

실무편 커리큘럼

구조설계와 레이아웃

전체적인 컨텐츠와 디자인을 검토하여 CSS구조와 레이아웃 구조를 설계하며, 컨텐츠와 디자인 특성에 맞게 마크업 시작하기
(주요포인트: CSS구조, 네이밍규칙, 디자인구조파악, float&clear)

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

접근성을 고려한 마크업과 추가되는 메뉴를 고려해 확장성있는 메뉴와 풋터 작업하기
(주요포인트: vertical-align, background, float&clear)

회사소개 페이지

각기 다른 컨텐츠들을 관리하기 쉽도록 규칙을 만들어 작업하기
(주요포인트: 네이밍규칙, background, 음수마진, float&clear)

제품, 서비스소개 페이지

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

입력양식 / 게시판

접근성있는 입력양식을 디자인 상황에 맞게 만들고 한 사이트에 사용되는 다양한 테이블에 규칙을 부여하고 스타일링 작업하기

상단메뉴

자바스크립트를 고려하고 확장성 있는 메뉴를 위한 마크업과 스타일링하기

메인 페이지

메인페이지의 조밀하고 복잡한 메인 페이지를 실습합니다.

실전 웹표준 능력 테스트

실무에서 사용되는 기획서와 디자인을 가지고 직접 작업해 보고 크리틱을 받기