멀티캠퍼스 :: 과정상세보기

과정요약

과정요약
학습시간	09:00 ~ 17:00 ( 20시간 )	난이도	중급
교육비 지원	고용보험 비환급	평가항목	출석률 100%
수료기준	총점 80점 이상시 수료	정원	24 명
교재정보

과정소개

'최적화'된 웹사이트의 제작! HTML CSS 반응형 웹

본 과정에서는 다양한 화면 크기에 대응할 수 있도록
반응형 웹디자인에 필요한 기술들을 소개하고
이러한 기술을 사용하여 유연한 UI를 제공하는 웹사이트를 설계 및 제작해 볼 수 있습니다.

반응형 웹 디자인(Responsive Web Design)이란
웹페이지가 다양한 디바이스와 화면 크기에 적응하여
일관된 사용자 경험을 제공할 수 있도록 설계된 웹 디자인 접근 방식을 말합니다.

반응형 웹 디자인은 웹사이트가 데스크톱, 태블릿, 스마트폰 등
모든 기기에서 '최적화'된 형태로 표시되도록 하는 것을 목표로
유동적인 레이아웃(Flexible Grid Layouts)과 유연한 이미지(Flexible Images),
미디어 쿼리(Media Queries) 등을 활용하여 구현할 수 있습니다. 😀

핵심만 모아놓은 압축적인 강의❕

단 3일만에! 반응형 웹디자인을 구현하기 위한
HTML5와 CSS3기술을 활용하는 방법을 학습할 수 있습니다.

수업만 진행해도 산출물이 완성❗

수업 중 진행하는 단계별 예제를 작성하다보면 반응형 웹디자인이 적용된 웹사이트가 완성됩니다!
(웹사이트의 제작프로세스 경험해 보세요!)

교육 종료 후에도 질의응답 가능❕❗

수정하거나 궁금한 소스코드, 웹페이지 등을 디스코드를 통해 교육 중, 교육 후에도 질의응답이 가능합니다.
(교육에서 배운 내용을 실무 적용 시, 어려움을 해소해 드려요!)

👀 미리 보는 예제 👍

학습목표

디바이스 크기에 따라 UI를 유연하게 제공할 수 있다.
반응형 웹디자인의 장/단점을 파악하고 기존 서비스 개선 방법을 도출 할 수 있다.
반응형 웹디자인이 적용된 웹사이트를 개발할 수 있다.

학습대상

반응형 웹디자인에 대한 개념과 제작 기술을 학습하고자 하시는 분
기획자와 디자이너, 개발자 등 웹과 관련한 실무자

- 1일차
  - 1. 개발환경 구축
    - - 크롬 및 파이어폭스 설치와 확장프로그램 셋팅
      - Visual Studio Code 설치 및 환경설정 09:00 ~ 10:00
  - 2. 반응형 웹디자인
    - - 반응형 웹디자인(RWD) 이란?
      - 미디어 쿼리
      - 반응형 콘텐츠 이미지, 배경 이미지 10:00 ~ 12:00
  - 3. 그리드 시스템 디자인
    - - 그리드 시스템이란?
      - Flex Box
      - CSS Grid Layout 13:00 ~ 15:00
  - 4. 반응형 구조 마크업
    - - One Source Multi Use
      - HTML5의 Sementic 요소
      - Columns, Gutter, Margin 15:00 ~ 17:00
- 2일차
  - 5. 반응형 레이아웃
    - - 미디어 쿼리를 활용한 모바일과 데스크탑 레이아웃
      - 웹 폰트의 활용(em, rem 단위) 09:00 ~ 12:00
  - 6. IE11 호환을 위한 Polyfill
    - - picturefill
      - retina.js 13:00 ~ 17:00
- 3일차
  - 7. 반응형 웹 프로젝트
    - - 모바일 및 데스크탑 구조 설계
      - 모바일 및 데스크탑 레이아웃 및 UI 디자인 09:00 ~ 12:00
  - -
    - - 모바일 및 데스크탑 레이아웃 및 UI 디자인 13:00 ~ 16:00

수강후기 21

평균평점

4.7 / 5.0

5

정*혜
2025.04.11

짧은 시간이었지만 매우 유익한 시간이었습니다.
5

김*재
2025.04.10

너무 좋았습니다. 반응형 웹을 만드는데 도움이 될 것 같아요!
4.75

김*아
2024.04.11

실무에서 사용하지 않아서 모르고 있었던 속성과 새로운 기능들을 상세히 설명해 주시고 예시 화면을 참조해서 설명해 주셔서 이해하는데 많은 도움이 되었고 실무에 꼭 적용해 보고 싶었습니다.
5

김*은
2024.04.11

예상보다 심화과정이어서 많이 어려웠지만, 강사님께서 도와주고 배려해주셔서 많은 실무에 관한 인사이트를 얻을 수 있었습니다.
5

이*준
2024.04.11

반응형 웹에 대하여 많은 걸 알 수 있었습니다. 수업 참여인원이 적어서 맞춤형 수업을 해주셔서 정말 좋았습니다. 3일로는 아쉬운 과정이였습니다.

반응형 웹UI 제작 실무 관련과정

집합

교재제공

Figma와 TailwindCSS를 활용한 UI 올인원(디자인&개발)

집합

교재제공

입문자를 위한 Git과 HTML＆CSS

집합

교재제공

업무에 바로 쓰는 HTML5와 CSS3