태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.

지난 시간까지 HTML문서의 기본 구조에 대해 알아봤습니다. 오늘은 이전 시간에 배운 내용을 총 복습하고 직접 테스트해 보는 시간을 갖도록 하겠습니다.

잊어 버렸다거나 잘 이해가 되지 않았던 부분이 없나 꼼꼼히 살펴 보신 후 부족한 것은 복습하시고, 첨부된 테스트지로 그 동안 배운 내용을 테스트 해 보시길 바래요.

시험이라고도 할 수 있고, 편하게 예스비™의 html 강좌를 보면서 얼마만큼 배웠는지 알아보는 시간이니까 너무 부담 갖지 마시고, 꼭 테스트 해보세요.

 

● HTML,문서 기본구조 총정리

1. 태그/html이란? :

태그(Tag)란 html문서를 수행하는 명령어를 말하며, HTML이란 "Hyper Text Markup Language"의 약자로 인터넷에서 웹을 통해 보여지는 언어입니다.

2. HTML 문서의 기본 구조:

독립태그외에 태그 공식은<태그명령어> 내용</태그명령어>로 나타내며, html문서의 기본 구조는 아래와 같습니다.

3. HTML문서의 제목에 해당하는 태그:

  • <hn> 제목 </hn>입니다.(n은 1~6까지의 숫자)
  • <hn align="위치"></hn> (위치를 나타내는 태그:오른쪽-right, 가운데-center, 왼쪽-left)

4. HTML 문서의 본문 글자를 나타내는 태그:

<font> 본문 내용</font>의 공식으로 이루어 지며, <font>안에 글자에 관한 몇가지 속성을 지정 할 수 있습니다.

  • <font size="크기"> 본문 내용</font>: 본문 글자 크기를 지정
  • <font color="색상"> 본문 내용 </font>: 본문 글자 색상을 지정(#xxxxxx_x는 6자리 코드값)
  • <font face="글꼴"> 본문 내용 </font>: 본문 글자 글꼴을 지정

5. HTML 문서 본문 단락을 나타내는 태그:

<br>은 줄바꿈 태그이며,<p>는 문단 단락을 나누는 태그입니다. 이 둘 태그는 단독으로 쓰이는 태그이기도 합니다. <p>태그안에는 관련 태그들로 속성을 부여 할 수 있습니다.

6. HTML 문서의 수평선을 긋는 태그:

문서에 수평선을 그어주는 태그는 <hr>이며, 태그안에 수평선의 속성을 지정 할 수 있습니다.

 

● TEST 하는 법과 체점하는 법

지금까지 기본구조에 대한 태그들을 공부했습니다. 과연 위의 공식들을 보지 않고 html문서로 작성 할 수 있습니까? 이제부터 테스트 해볼까요?(No cheating~!)

1. TEST 하는 법:

아래 테스트 항목에 대해 첨부 파일이 있습니다. html형식의 파일과 한글 파일입니다. 보기 편하신 것을 다운 받아 각 항목에 작성하시면 됩니다.

테스트 응모라고 하시고 답안지를 받을 메일을 비밀 댓글로 남겨 주시거나, 작성된 테스트지를 공지에 나와 있는 제 블로그 전용 한메일로 신청해 주시면 정답을 메일로 보내 드립니다.

제가 직접 시험답안을 받아 채점해 드리려고 하였으나, 참가율이 저조 할 것 같아 스스로 해보시기 바랍니다.

2. 채점하는 법:

채점은 단답형과 서술형이 있습니다. 각 문제당 점수를 문항 뒤에 표기 하였습니다.

서술형을 채점하실때 오타나 단어가 빠졌을 경우도 감점처리 해주십시요. html의 경우는 오타가 나거나, 글자 하나라도 빠졌을 경우 실행이 되지 않기때문에 정확히 작성해주셔야 됩니다. 나중에 스킨을 만들때 오타를 잡아내는 것도 중요한 부분이기 때문입니다.

※ 참고로 테스트 문항중에 제가 설명하지 않은 것이 있을 수 있습니다.

시험지 한글 파일로 받기
시험지 텍스트 파일로 받기

 

● 튜토리얼에 관해...

태그를 배우는 것은 다음에 블로그 스킨을 만들때 필요한 부분이기에 불가피하게 강좌를 시작했습니다. 현재의 html강좌가 웹표준에 근거해 맞지 않는다는 분들이 계십니다만, 직접 그 부분에 대해 공유해 주실 생각은 해보셨는지 부터 묻고 싶습니다. 본인도 하기 싫고 힘들고 귀찮은 부분이 바로 튜토리얼입니다. 예스비™도 무척이나 귀찮고 힘듭니다.

포토샵도 그렇지만 html 강좌 역시 한 개의 글을 발행하기 위해 몇 시간이 걸릴거라고 생각하나요? 튜토리얼에 관한 공지도 있지만, 몇 시간이 아니라 몇 일이 걸립니다. html강좌를 시작하면서 관련 서적을 4권을 더 사서 읽게 되더군요. 혹시나 내가 가지고 있는 책과 지식이 잘못된 것은 아닌지 확인하기 위해서죠.

현재는 html기초 강좌 글만 발행하고 있습니다. 꼭 알아야 할 태그만을 정리해서 올리고 있습니다. 한글로 따지면 엄마, 아빠등 단어에 해당 하겠네요. 단어를 모르는데 말을 할 수 있을까요?

기초태그가 끝나면 웹표준에 근거한 튜토리얼을 할 겁니다. 그 다음에는 직접 스킨 제작을 할 것이구요. 제발 부탁드리는데, 한 편의 튜토리얼 을 읽고 섣부른 태클은 하지 말아 주세요. html과 포토샵 강좌의 모든 구조적인 아웃라인이 잡혀 있고 그 것에 맞추어 진행중에 있습니다. 예스비™의 튜토리얼은 하나의 글로 완성되는 것도 아닙니다. 중구난방으로 그때 그때 필요한 부분만을 포스팅 하는 것도 아닙니다.튜토리얼에 대한 것은 모두가 연결되어 있습니다.이전 글을 모르면 다음 글을 이해하기 어렵습니다.

체계적이지 않은 중구난방식의 튜토리얼은 많습니다. 예스비™의 강좌 는 이런 아쉬운점들 때문에 시작한 강좌입니다. 스스로 공부하면서 가장 힘들었던 부분이 무엇을 먼저 배우고 나중에 배워야 할 지 막막했던 기억, 따라하면서 너무나 답답했던 이유를 분석해 보니 바로 체계적인 가이드가 없었기 때문이죠. 그래서 시작한 강좌입니다.

어설프게 아는 것보다 확실히 알려 드리고자 강좌 하나를 위해 여러 권의 책을 보고 인터넷 뒤지고...자료를 정리하고... 많은 시간을 투자하고 있습니다. 이런 점을 조금만 헤아려 주셨으면 좋겠네요.

앞으로 웹표준 어쩌고 운운하며 딴지를 거는 댓글은 무조건 통보 없이 삭제 하겠습니다.(본인이 나서서 글 좀 써주시죠~부탁드립니다. 저도 부족한 것 좀 편하게 배우게요.) 잔소리를 너무 길게 했군요ㅠ 죄송합니다. 오늘은 이렇게 마무리 짓고, 아시죠? 다 읽으셨으면 두 손 번쩍 들어~~다음과 믹시 그리고 알라딘 창작블로그에 추천 누르는 것~~잊지 마세요^^& 참, 월요일에 블로그 이벤트 당첨자 안내와 이벤트선물안내가 포스팅됩니다. 확인하시고~당첨자 분들은 연락처,이름,주소,메일을 비밀댓글로 남겨 주세요.

 

이 글이 링크되어 있는 곳:

블코채널[blogkorea]: 웹디자인과 블로그팁에 링크되어 있습니다.
레뷰 아이템[revu]: 웹디자인& 블로그 Tip에 링크되어 있습니다.

 

posted by 예스비™

이글에 관한 저작권은 예스비™에게 있으며, 무단 전제및 스크렙(퍼가기), 인용, 수정등을 불허 합니다. 이 글의 사용은 공지의 "저작권안내"에 따라 사용 하시기 바랍니다. 불편하시더라도 가급적 rss로 구독하거나 제 블로그에 직접 방문하셔서 읽으시길 바랍니다. _by 예스비™
제 글이 맘에 드셨나요? RSS구독을 하시면 무료로 배달해 드립니다.
  • 한rss로 구독하기
  • 피드버너로 구독하기
  • 구글리더로 구독하기
  • 다음뷰로 구독하기
  • 최근 댓글

    최근 트랙백

    BLOG main image
    포토샵 강좌, html/css 강좌등 어렵게만 느껴졌던 웹디자인을 초보자도 쉽게 이해 할 수 있는 튜토리얼, IT 트랜드, 블로그팁과 운영법, 디자인 시각에서 풀어 헤치는 상품 리뷰등, 디자인에 대한 재밌고 유익한 정보를 제공하는 블로그입니다. by 예스비™
    rss

    위젯

    BLOG ★ NIGHT

    Blog♥Rings

    Blog♥Rings Family Blog & Sites T-Blog Web site meta hub site

    구독리스트

  • rss
  • Add to Google Reader or Homepage
  • 블로그코리아에 블UP하기
  • Powered by FeedBurner
  • BlogRankers.com
  • Page Ranking Tool