[HTML][HTML문서]HTML의 개념, HTML의 특징과 HTML의 문자편집, HTML의 표편집, HTML의 프레임편집 및 HTML의 특수문자사용과 HTML의 링크삽입, HTML의 그림삽입 그리고 HTML의 작성후 점검 심층 분석

소개글

[HTML][HTML문서]HTML의 개념, HTML의 특징과 HTML의 문자편집, HTML의 표편집, HTML의 프레임편집 및 HTML의 특수문자사용과 HTML의 링크삽입, HTML의 그림삽입 그리고 HTML의 작성후 점검 심층 분석에 대한 보고서 자료입니다.

목차

Ⅰ. 개요

Ⅱ. HTML의 개념

Ⅲ. HTML의 특징

Ⅳ. HTML의 문자 편집
1. 문서모양
2. 글자모양
1) 논리적 스타일(Logical Style)
2) 물리적 스타일(Physical Style)
3. 글자크기
4. 특수문자
5. 선그리기
6. 기타

Ⅴ. HTML의 표 편집
1. 표짜기 요소들(Table Elements)
2. 표만들기 속성(Table Attributes)
3. 일반적인 표 형식
4. 표의 형식이 아닌 정보를 표현하기 위한 표 사용

Ⅵ. HTML의 프레임 편집

Ⅶ. HTML의 특수문자 사용

Ⅷ. HTML의 링크 삽입
1. 같은 사이트 내의 연결 :
2. 내 사이트에서 다른 사이트로 연결하기
3. 한 문서내의 특정 단어로 이동하기

Ⅸ. HTML의 그림 삽입

Ⅹ. HTML의 작성 후 점검
1. 작성한 문서에 대한 확인
2. 망가진 이미지
3. 정보의 갱신
4. 브라우저들 간의 차이
5. 파일에 주석달기

참고문헌

본문내용

/BODY>

Ⅸ. HTML의 그림 삽입
그림삽입 TAG지정 시 경로와 그림파일명. 확장자는 정확하게 대소문자를 구별한다.
option(선택사항)
Border=\"pixel수\" : 그림 테두리선의 굵기 지정
동화상 그림파일인 gif파일연결 시 \'border=0\'을 지정해주면
깔끔하게 표현된다.
Align=\"위치값\" : 그림과 문자열의 정렬관계. 위치 값으로는 top, middle, bottom, texttop, abscenter, absmiddle,
absbottom, baseline
Alt=\"그림설명문기재(pop-hint)\"
그림이 Page-Loading되기까지는 화면에 내용이 표시된다.
width=\"pixel수 또는 백분율\" : 그림 가로크기 지정
height=\"pixel수 또는 백분율\" : 그림 세로크기 지정
vspace=\"pixel수\" : 그림의 상하 여백지정
hspace=\"pixel수: : 그림의 좌우 여백지정
큰 이미지 삽입시 대체그림파일 출력
형식
※ 삽입하고자하는 Image가 큰 그림일 경우 Page-Loading시간이 길어질 수 있다. 그때 실제 Image 가 보여지기 전 까지 작은 그림파일을 대체그림파일로 지정해두면 Page-Loading되는 동안 작은 그림파일을 먼저 보여준다. (단 두 개의 그림이 있어야 한다.)
하나의 Image를 세분화시켜 영역개념으로 이미지 활용을 할수 있도록 설정하는 작업을 말한다. 해당영역에 Mouse-event(click)를 취하면 Anchor문에서 지정할 수 있는 모든 작업을 연결할 수 있다.
Ⅹ. HTML의 작성 후 점검
1. 작성한 문서에 대한 확인
여러분이 작성한 문서를 웹 서버에 올리려고 할 때, 지명 앵커들과 각각의 링크들, 그리고 전체적인 포맷 등을 점검해야한다. 여러분이 작성한 문서들이 완전히 끝났다고 여기기 전에, 다른 사람들이 그것을 읽어보고 논평을 할 수 있도록 하는 것이 좋다. 여러분은 HTML 점검 서비스(an HTML validation service)를 통하여 제대로 HTML이 받아들일 수 있게 문서를 작성했는지 점검해 볼 수도 있다. 만일 HTML 사양에 들어맞지 않는 문법을 사용하였다면, 이 서비스가 제대로 된 것을 가르쳐 줄 수 있는 아주 유용한 수단이 될 것이다. 다행히도 이 서비스는 여러분으로 하여금 여러분의 파일에 대한 적합도의 정도(예, 엄격함, 제 2단계, 제 3단계)를 선택할 수 있도록 마련하고 있다. 만일 여러분이 HTML 사양의 공식적인 부분이 아닌 몇몇 태그들을 사용하고 싶다면, 이러한 관용범위가 도움이 될 것이다.
2. 망가진 이미지
태그가 존재하지 않는 이미지를 지정하고 있다면, 웹브라우저에서는 임시로 만든 망가진 이미지(dummy image)를 가지고 그것을 표현하게 된다. 만일 여러분이 만든 파일들을 최종 점검 할 때에 이러한 일이 발생하게 된다면, 관련된 이미지들이 존재하지 않기 때문이거나, 제대로 된 URL이 하이퍼링크 되어 있지 않기 때문이거나 파일의 권한이 제대로 설정(누구나 읽을 수 있게)되어 있지 않기 때문이라는 사실을 알아야 한다.
3. 정보의 갱신
만일 파일의 내용이 고정적인(예를 들어 George Washington의 자서전과 같은) 것들이라면 더 이상의 정보 갱신은 필요치 않을 것이다. 하지만 시간과 밀접한 관련이 있다거나 자주 바뀌는 부분을 다루고 있는 문서라면 문서를 갱신하는 것을 잊지 말아야 한다.
해당하는 파일이 주간 계획이나 모금행사의 완료 기한 등과 같은 것들을 다루고 있다면, 정보의 갱신은 더할 나위 없이 중요한 요소라 할 수 있다. 시한이 지난 파일들을 지우거나, 왜 그러한 정보들이 서버에 계속 남아있는 지에 관한 주석을 달아라. (예들 들면, \'본 행사에 대한 사항은 다음번 행사가 있을 때까지 관심 있는 분들의 참조를 위하여 계속 보존될 것이다\')
4. 브라우저들 간의 차이
HTML 요소들은 웹브라우저들마다 서로 다르게 표현된다. HTML 파일 내부에서 사용된 모든 요소들이 어떠한 브라우저들에서도 다 표현될 수는 없다는 사실을 명심하여라. 일반적으로 어떠한 브라우저에서 인식할 수 없는 요소가 있는 경우에, 그러한 요소들은 무시된다. 여러분이 사용하고 있는 브라우저에서 여러분이 만든 파일이 \"완벽한 것처럼 보이게\" 만들기 위하여 많은 시간을 소모할는지 모른다. 만일 여러분이 그 파일을 다른 브라우저에서 보게 된다면, 그 결과는 (약간, 혹은 아주 많이) 다르게 보일 수도 있다. 따라서 여러분의 파일을 정확한 HTML에 따라서 작성하라고 충고하고 싶다. 작성한 파일을 어떻게 나타낼 것인가에 대해서는 웹브라우저에게 맡기고 아주 근사한 결과를 바라는 수밖에는 없다.
5. 파일에 주석달기
혹시 여러분이 작성한 HTML 파일 내부에 주석을 달려고 할지도 모른다. HTML에서 주석이란 컴퓨터 프로그램을 작성할 때와 거의 비슷하다. - 컴퓨터 프로그램에서 주석들은 보이지도 않고 사용되지도 않는 것처럼 웹브라우저를 통하여 직접 볼 수도 없고 다른 형태에도 영향을 끼치지 않는 글자들을 말한다. 하지만 이용자가 원본(source) 파일을 보는 경우에는 주석을 읽을 수 있다. 파일을 갱신한 사람의 이름이나 해당 파일을 만들기 위하여 사용한 소프트웨어와 그 버전, 또는 수정을 한 날짜들과 같은 종류의 주석들은 나름대로의 형식이 있다. 주석을 삽입하려면, 다음과 같이 입력하면 된다.

여러분은 반드시 위의 예제에서 보인 것처럼, 느낌표와 하이픈(-)의 사용 방법을 지켜야 한다.
참고문헌
기한재·김형호, 인터넷 활용과 홈페이지 제작
김석주, WWW에서 홈페이지 만들기, 가남사 , 1996
김충남, 차세대 무선인터넷 서비스, 전자신문사, 2003
성윤수·박종훈, 홈페이지 할 수 있다! 쉽게 배우기, 영진닷컴, 2004
이병관, 알기 쉬운 컴퓨터 네트워크
이케다 노부오, 이규원 역, 인터넷 자본주의 혁명, 1999
PC BOOK 기획실, 홈 페이지 7일 작전, PC BOOK , 1997

키워드

HTML,   HTML문서,   HTML편집,   웹,   웹사이트