하늘과 나의 IT 이야기

4장. HTML5 기본태그(글과 관련된 태그) 이번 시간에는 기존에 사용되었던 글과 관련된 태그를 복습해 보도록 하겠습니다. 이미 이 부분을 알고 계신 분들도 많이 있으시리라 생각됩니다. 처음 접하시는 분들은 강의에 집중해 주시기 바랍니다.^^ 글과 관련된 태그 1. ~ 태그제목을 나타내는 태그입니다. 에서 까지 있으며 태그가 가장 크고 태그가 가장 작습니다. HTML4에서는 태그와 비교하면서 많이 설명이 되어졌지만 HTML5.0 에서는 태그 자체를 사용하지 않으므로 비교설명은 하지 않고 태그만 설명드리도록 하겠습니다. 예제 소스를 보도록 하겠습니다. 첫번째 첫번째 첫번째 첫번째 첫번째 첫번째 2. ~ 태그영어의 paragraph를 의미합니다. 즉, 문장 여러개가 모인 문단을 만들어주는 태그입니다. 3...

HTML5강의를 시작하게 된 하늘과 나입니다. 오늘부터 하나씩 HTML5 강의를 시작할 텐데요. HTML5에 대해서 배워보고 싶은 분들과 HTML5가 뭐지 하는 분들에게 조금이나마 도움이 되어 드리고자 시작하게 되었습니다. 그러면 하나씩 하나씩 살펴보도록 하겠습니다. 1. 웹(web)의 역사 먼저 웹(web)이라는 녀석이 어떻게 세상에 등장하게 되었는지 살펴보도록 하겠습니다. 웹은 월드 와이드 웹(World Wide Web)을 줄여서 부르는 말인데요. 인터넷에 연결된 컴퓨터들을 통해서 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말합니다. 웹이라는 단어는 생소하기도 한데요. 우리는 흔히 이 웹을 보고 인터넷이라고 말하기도 합니다. 하지만 웹은 인터넷 밑에 있는 하나의 서비스라고 보면 될 것 ..

자, HTML5 강의 세번째 시간입니다. HTML4에서는 문서의 구조를 만들 때 div 태그를 id, class와 함께 사용했습니다. 완성된 문서를 보면 태그가 여러번 사용한 것을 볼 수 있었지요. 그래서 구조가 복잡할 수록 태그가 여러번 겹쳐 있었기 때문에 알아보기가 힘들었을 뿐더러 수정하기도 어려웠습니다. HTML5에 와서 문서의 구조를 만드는 새로운 개념과 요소들이 추가되었습니다. 그래서 기존에 태그로 소스코드를 작성했던 것보다 구조적인 문서를 만드는 것이 가능해졌습니다. 구조를 만들기 위한 새로운 태그들을 시맨틱 태그라고 하는데요. 오늘은 HTML5에서 새롭게 등장한 시맨틱(semantic)태그에 대해서 알아보도록 하겠습니다. 시맨틱(semantic) 태그란 무엇인가요? 영어에서 semantic이..

[HTML5 강의] HTML5를 실행해보자. 웹 브라우저 설치하기 HTML5 강의 두번째 시간입니다. 이번 HTML5 강의에서는 HTML5를 실제로 실행해보기 위해서 HTML5를 지원하는 웹브라우저를 설치해 보도록 하겠습니다. 구글 크롬 설치 구글 크롬은 가장 최근에 만들어진 브라우저로 빠른 속도가 큰 장점이라고 할 수 있겠습니다. 구글 크롬 설치하러 가기 - http://www.google.co.kr/intl/ko/chrome/ 위 링크를 클릭하여 구글 크롬 설치페이지로 이동합니다. 아래 보이는 화면과 같이 나오면 Chrome 다운로드 버튼을 눌러 설치 파일을 다운로드 한 후 설치하면 됩니다. 오페라 설치 아래의 링크를 클릭하여 오페라 브라우저를 설치합니다. 오페라 브라우저 설치하러 가기 - http:..

HTML5 두번째 시간이 돌아왔습니다. 이번 시간에는 HTML5인지 아닌지 어떻게 구분할 수 있는지와 기존 HTML 버전과 무엇이 다른지 알아보도록 하겠습니다. 첫번째 HTML5인지 아닌지 알아보는 방법에 대해서 알아보도록 하겠습니다. HTML 페이지를 만들 때 일반적으로 DOCTYPE이라는 것을 문서의 처음 부분에 지정하도록 되어 있는데 아래의 내용과 같이 쓰곤 했었죠. HTML5 이전에 사용했던 버전의 DOCTYPE!

우리가 흔히 인터넷을 할 때 '이 웹페이지는 뭘로 만드는 거야?' 이런 고민을 가지신 분들이 몇 분 계실지도 모르겠습니다. 또는 우리가 매일매일 공기를 들이마시고 내쉴 때 공기가 무엇으로 이루어져 있는지 신경쓰지 않는 것처럼 신경쓰지 않고 인터넷을 이용하시는 분들도 있는지 모르겠습니다. 보통 후자의 경우가 대부분일 것이라는 생각이 드네요. 오늘은 이 웹페이지를 만들 때 알아야 하는 HTML에 대해서 알아보도록 하겠습니다. HTML은 HyperText Markup Language의 줄임말 HTML은 보시면 어느 영어단어와 같이 줄임말입니다. 그러면 무엇의 줄임말일까요? 바로 HTML은 HyperText Markup Language의 줄임말입니다. 대문자만 써서 HTML이라 부릅니다. HTML은 HyperT..