Hyper Text Markup Language5
HTML5 과정
웹시장에서 그 중요시 되는 "플랫폼화 전략"에 대응하기 위해서 HTML5는 필수 요건이며, 대부분의 기업들이 이젠 인터넷을 접점으로 재활용한 모바일 웹의 활용도가 날로 높아지고 있습니다.
기초디자인-디자인툴- UIUX-웹퍼블리싱으로 진행되는 기본 웹사이트 제작과정에 따라 커리큘럼이 진행되면서 홈페이지 제작의 각 단계를 이해하게 하고 난이도별 실습을 통해 기술과 실력을 키웁니다.
취업분야웹에이전시, 쇼핑몰, 광고, 이벤트 회사(홍보물, 배너 제작), 기업체 홈페이지 관리, 이러닝 업체(홈페이지, 컨텐츠 제작)
-
- 01
- 취업을 위한 1:1 맞춤형 멘토링
- 교육과정 설계
-
- 02
- 사전 등록시 역대급 할인혜택
- 최대 30%할인
-
- 03
- 복습할 수 있는 온라인 강의
- 시스템 구축
-
- 04
- 취준생 필수 이력서 & 자소서 첨삭
- 취업상담 및 취업처 연계
교육과정 상세정보
- 2개월(8주)
- 입문 ~ 고급
- 15명 내외 인터뷰 및 레벨 테스트 후 입학
- 052-922-8566 주말·공휴일 상담 및 접수가 가능
- 평일반 (월~금)
- 1교시 09:00~11:00 2교시 11:00~13:00 3교시 14:00~16:00 4교시 16:00~18:00 5교시 18:00~20:00 6교시 20:00~22:00
- 주말반 (토~일)
- 1교시 09:00~12:00 2교시 12:00~15:00 3교시 15:00~18:00
SBS아카데미는 결과로 증명합니다.
학력, 경력, 경험이 없어도 취업에 성공합니다.
- 카페 매니저에서 웹디자이너로 취업
- 광고 디자이너에서 웹 사이트 제작, 관리자로 이직
- 공무원 준비생에서 웹 기획자로 취업
- 비전공자에서 프론트엔드 개발자로 취업!
팀팩토리
- 이한솔 취업생
- 제 생각보다 더 체계적으로 수업들이 진행되었고 무엇보다 팀원들과 함께 작업을 했던 것이 정말 좋았습니다. 선생님 또한 열정적으로 중간중간 보충수업까지 해주시고 너무 감사합니다!
(주)엔유비즈
- 이수현 취업생
- 저도 웹디자이너를 늦은 나이에 새로운 도전이라고 생각해서 뛰어들었지만 전혀 후회하지 않습니다. 취업담당자 선생님이 계시니 너무 성급하게 생각하지 말고 천천히 하고 있으면 언젠가 좋은 기회가 찾아 올거라 생각합니다.
로빈ICT
- 박원휘 취업생
- 친한 동기가 생겨서 같이 서로 도와주면서 자격증 준비도 많이 하고, 멘토나 선생님들이 칭찬과 격려 따로 문자로 도움을 많이 주시기도 해서 잘 준비하였습니다!
㈜JOYFULSOFT
- 김연희 취업생
- 학원 내부도 엄청나게 깨끗했고, 교육을 받으면서 제가 모르고 있던 팁 같은 걸 알게 되어 엄청나게 좋았습니다. 내가 몰랐던 팁을 아는 그 순간이 제일 즐거웠습니다. 머릿속에 전구가 팟! 하고 켜지는 느낌이었달까요.
(주)아이텍씨앤씨
- 고지현 취업생
- 이력서와 자소서, 포트폴리오를 컨펌해 줌으로서 제가 가진 부족한 부분을 말씀해주시며 보완할 기회를 주셨고, 취업관련 공고와 면접질문, 채용사이트에서 확인해야 할 점 등 필요한 정보들을 다루며 같이 상의해 주시는 친절한 상담이 정말 많은 도움이 됐다 생각합니다.
온메이커스
- 송창현 취업생
- 취업지원해주시는 선생님께서 항상 자기 일처럼 취업 자리를 알아봐주셔서 취업에 성공할 수 있었던 것 같습니다. 또한 수업을 해주시는 선생님께서 단순한 강의가 아닌 다양한 이야기와 여러가지를 도와주셔서 취업에 성공할 수 있었던 것 같습니다.
(주)데이타이음
- 송지민 취업생
- 학원 등록 전에는 학원에 반신반의하면서 등록했는데 학생의 의지만 있다면 멘토님과 선생님들 모두가 한 명의 취업에 진심으로 대해주셔서 놀라웠고 감사했습니다.
Cross Shock
- 장소영 취업생
- 비전공자이지만, 학원을 믿고 따라와서 결국 IT분야에 원하는 직종으로 취업할 수 있었습니다. 마지막으로 허지훈 강사님, 박진수 멘토님, 취업담당자 차지연 선생님께 감사 말씀 전하고 싶습니다.
델타인덱스
- 김도영 취업생
- 학원에서 배웠던 HTML과 CSS 기술 덕분에 업무에 빠르게 적응할 수 있었습니다. 후에 디자인 작업에도 투입될 예정인데, 포토샵과 일러스트레이터 프로그램을 배운 것이 큰 도움이 될 것 같습니다.
케이앤제이 컴퍼니
- 채지안 취업생
- 디자인 업계에서는 창의성을 많이 발휘해야 하는데 강사님께서 색감을 잘 활용할 수 있는 방법을 제시해주시고 다양한 포트폴리오를 볼 수 있는 사이트를 제공해 주셨습니다.
- 이런 분들이 배우시면 좋아요!
-
· 홈페이지 기획, 디자인, 제작에 관심이 있는 분
· 웹사이트에 관심이 있는 분
· 웹파트 진로 고민자
· 코딩입문자(비전공자)
· 홈페이지 제작 방식이 궁금하신 분
· 자신만의 홈페이지를 만들고 싶으신 분
· 나만의 포트폴리오 홈페이지를 만들고 싶으신 분
Hyper Text Markup Language5
HTML5 과정 소개
HTML5는 "Hyper Text Markup Language5"의 줄인 말로, 기존에 웹 문서를 제작하기 위해 활용되었던 표준 프로그래밍 언어인 HTML의 최신 버전입니다.
웹 시장에서 중요시 되는 "플랫폼화 전략"에 대응하기 위해서 HTML5는 필수 요건이며, 대부분의 기업들이 이젠 인터넷을 접점으로 재활용한 모바일 웹의 활용도가 날로 높아지고 있습니다. 이로 인해 대부분의 웹 브라우저들은 HTML5의 호환 작업을 빠르게 진행해 나가고 있으며, 차세대 플랫폼으로 점점 각광받고 있습니다.
- HTML5의 새로운 MARKUP
-
HTML5는 웹 개발을 위한 다양한 새로운 마크업 요소와 기능을 도입했습니다. 일부 주요 HTML5 마크업 요소는 다음과 같습니다.
<article> 요소: 독립적인 콘텐츠를 나타냅니다. 뉴스 기사, 블로그 글, 포럼 게시물 등이 포함될 수 있습니다.
<section> 요소: 문서의 섹션을 정의합니다. 주제별로 그룹화된 콘텐츠를 나타낼 때 사용됩니다.
<nav> 요소: 내비게이션 링크를 그룹화합니다. 주로 메뉴 또는 링크 목록을 표현하는 데 사용됩니다.
등의 다양한 HTML5 요소가 있으며, 이러한 요소들은 웹 애플리케이션 및 멀티미디어 콘텐츠를 구축하는 데 사용됩니다. HTML5는 더 풍부한 웹 경험을 제공하기 위한 다양한 기능을 도입하여 웹 개발자에게 유연성을 제공하고 있습니다.
- HTML5 동영상 및 FORM
-
HTML5에서는 <video> 요소를 사용하여 동영상을 웹 페이지에 삽입할 수 있습니다.
<video> 요소는 다양한 속성과 이벤트를 제공하여 동영상을 컨트롤하고 사용자와 상호작용할 수 있습니다.
그리고 <form> 요소를 사용하여 사용자 입력을 받는 양식을 만들 수 있습니다.
여러 양식 요소를 사용하여 텍스트 입력, 체크박스, 라디오 버튼, 드롭다운 등 다양한 형태의 입력을 받을 수 있습니다.
이러한 HTML5 요소들은 웹 페이지를 보다 동적이고 사용자 친화적으로 만들어 줍니다.
- HTML5 미디어쿼리
-
HTML5 미디어 쿼리(Media Queries)는 CSS3의 일부로서, 웹 페이지의 스타일을 장치의 특성에 따라 동적으로 조정할 수 있는 기능을 제공하는 기술입니다.
주로 반응형 웹 디자인에서 사용되어 다양한 디바이스 및 뷰포트 크기에 대응하는데 도움을 줍니다.
미디어 쿼리는 주로 @media 규칙을 사용하여 정의되며, 특정 미디어 특성(예: 화면 크기, 해상도, 장치 종류 등)에 따라 스타일을 적용하거나 제외할 수 있습니다.
이렇게 미디어 쿼리를 사용하면 다양한 디바이스 및 화면 크기에 대응하여 웹 페이지의 레이아웃과 스타일을 최적화할 수 있습니다.
- CSS3 선택자유형
-
CSS3는 다양한 선택자 유형을 도입하여 웹 개발자가 더 효과적으로 요소를 선택하고 스타일을 적용할 수 있도록 했습니다.
일부 주요 CSS3 선택자 유형은 다음과 같습니다.
일반 선택자 (Universal Selector): 모든 HTML 요소를 선택합니다.
요소 선택자 (Type Selector): 특정 HTML 요소를 선택합니다.
클래스 선택자 (Class Selector): 특정 클래스를 가진 요소를 선택합니다.
자식 선택자 (Child Selector): 특정 요소의 직계 자식 요소를 선택합니다.
등의 선택자가 있습니다.
CSS3의 이러한 다양한 선택자를 조합하여 원하는 대상을 정확하게 선택하여 스타일을 적용할 수 있습니다.
- CSS3 배경및 테두리 등의 속성 및 벤더프리픽스
-
CSS3에서는 배경과 테두리에 관한 다양한 속성이 도입되었으며, 몇 가지 속성은 벤더 프리픽스(vendor prefix)를 사용하여 브라우저 호환성을 유지합니다.
배경 속성 (Background Properties) / 테두리 속성 (Border Properties)의 속성들은 각각의 브라우저에 대응하지 못하기에 각각 웹킷과 모질라등의 브라우저에 대응하고 표준 속성을 적용하고 있습니다.
벤더 프리픽스를 사용하여 브라우저 간 호환성을 확보합니다.
- 그리드 시스템
-
웹의 그리드 시스템(Grid System)은 웹 페이지를 레이아웃하는 데 사용되는 구조적인 방법 중 하나입니다. 그리드 시스템은 웹 페이지를 일정한 열과 행으로 나누어 구성하여 컨텐츠를 조직화하고 배치하는 데 도움을 줍니다.
이는 일관된 디자인 및 레이아웃을 유지하고 반응형 웹 디자인을 구현하는 데 도움이 됩니다. 컨테이너 / 열 / 커터 / 로우와 같은 구성 요소를 포함합니다.
웹 디자이너 및 개발자들은 그리드 시스템을 사용하여 웹 페이지의 레이아웃을 쉽게 구성하고 관리할 수 있습니다. 대표적으로 Bootstrap, Foundation, 그리드 시스템을 쉽게 구현할 수 있는 프레임워크들이 있습니다.
그리드 시스템은 반응형 웹 디자인에서도 중요한 역할을 하며, 다양한 화면 크기 및 디바이스에 대응할 수 있도록 도와줍니다.
- 플로이드 기법 등의 반응형 레이아웃
-
반응형 웹 디자인은 다양한 디바이스와 화면 크기에 대응하여 최적의 사용자 경험을 제공하는 디자인 접근 방식입니다.
플로이드 기법은 반응형 웹 디자인에서 사용되는 한 가지 기법으로, 유연한 그리드와 미디어 쿼리를 활용하여 웹 페이지의 레이아웃을 조절하는 방법 입니다.
반응형 웹 디자인은 사용자 경험을 향상시키고 다양한 디바이스에 대응하여 웹 페이지를 효과적으로 표현할 수 있는 중요한 디자인 접근 방식 중 하나 입니다.