[WBE2]DAY2_WWW, W3C, 웹 표준, 웹 접근성 개념, HTML(HTML 개념, 단락태그)

welcome page 설정
초기에 보여질 파일의 경로가 URL에 나오지 않도록 설정
    WEB-INF > web.xml 파일이 있는지 확인(xml : 설정하는 파일)
    없으면 프로젝트 우클릭 > JAVA EE ... 클릭
    > Generate 클릭으로 생성

    톰캣 서버 더블 클릭 > 하단 Modules탭 클릭
    > 실행할 프로젝트 클릭 > Edit 클릭
    > 경로 지우기(/만 써놓기) > Ctrl + s로 저장 후
    > 서버 재시작 > 브라우저에서 localhost:포트번호

---

WWW(World Wide Web)
   인터넷에 연결된 전 세계 컴퓨터들을 통해 사람들이
   정보를 공유할 수 있는 정보공간

W3C(World Wide Web Consortium)
월드 와이드 웹을 위한 표준을 제정하고 관리하는
중립적인 기관이다.

웹 표준(Web Standard)
   1. HTML(HyperText Markup Language)
      웹 페이지에서 다른 페이지로 이동할 수 있도록하는
      마크업 언어이다. 마크업 언어란 태그 방법 체계를 의마하며,
      태그 등을 이용해서 문서나 데이터의 구조를 기술하는 언어이다.

   2. CSS(Cascading Style Sheets)
      구체적으로 어떤 스타일로 요소가 표시되는지를 정하는
      규격이다. HTML로 문서를 구조화하는 것 뿐만 아니라
      꾸미기도 할 수 있지만 동일한 디자인을 사용한 문서가
      여러개 있다면 변경시 모두 수정해야하므로 불편하다.
      CSS는 이런 문제를 해결함과 동시에 웹페이지에서
      내용가 스타일을 분리하고 역할도 분리해준다(분업). 

   3. XHTML(EXtensible HTML)
      기존에 사용되던 HTML 규격이 가진 문제점을 극복하고,
      보다 다양한 분야에 응용될 수 있도록 해주는 여러가지
      확장된 기능을 포함한다.
      하지만 XML기반으로 만들어졌기 때문에 지원되지 않는
      브라우저도 있다. 따라서 HTML과 XHTML은 사실상
      큰 차이 없이 사용된다.

      HTML : <태그> 텍스트
      XHTML : <태그> 텍스트 </태그>

   4. XML(EXtensible Markup Language)
      어떠한 데이터를 설명하기 위해 임의로 지은 태그로
      데이터를 감싼다. 태그로 데이터를 설명하며,
      이것이 데이터의 표시(Markup)가 되고 추가적인
      데이터가 생기면 태그 추가와 태그 내부 내용 추가를
      할 수 있다. 따라서 데이터 전달에 목적이 있다.

      <? xml version = "1.0"?>
      <컴퓨터언어>
      <C언어>C</C언어>
      <자바>JAVA</자바>
      <파이썬>Python</파이썬>
      </컴퓨터언어>

웹 접근성
   모든 사용자가 신체적, 환경적 조건에 관계없이 웹에
   접근하여 이용할 수 있도록 보장하는 것을 의미한다.
   마우스가 없는 환경이나 키보드만을 조작해야 할 경우,
   신체적 장애로 인해 특수한 환경하에 접속해야 되는 경우,
   브라우저별, 모바일 환경에서 접속해야 되는 경우와 같이
   다양한 플랫폼에서도 정보제공이 다름이 없어야 한다는 것이다.

---

[HTML]

마크업 언어
   HTML은 프로그래밍 언어가 아닌 마크업 언어이다.
   마크업 언어란 우리가 보는 웹페이지가 어떻게
   구조화되어 있는지 브라우저로 하여금 알 수 있도록 
   하는 언어이다.

HTML의 요소
   (1)<p>(3)You are better.(2)</p>

   (1) 여는 태그(Opening Tag) : 요소의 이름(p)과 열고 닫는 꺽쇠괄호로 구성
   (2) 닫는 태그(Closing Tag) : 요소의 이름 앞에 슬래시(/)가 있다.
   (3) 내용(Content) : 요소의 내용이며, 단순한 텍스트를 의미한다.

   (1), (2), (3)을 통틀어서 요소라고 한다.
   요소의 이름은 대소문자를 구분하지 않지만 가독성에 있어서
   소문자로 작성하는 것을 권장한다.

내포된 요소(Nexted elements)
   요소 안에 다른 요소를 넣는 기법

   <p>You are <strong>much</strong> better.</p>

 

---

단락 태그(Paragraph tag)
   글 단락 태그

      단락이란 내용상 끊겨서 구분할 수 있는 하나하나의 부분을

      의미하고, 문단이라고 부른다.

      <p>태그를 이용하여 단락을 표현한다

 

   서식 태그

      <strong>, <b>태그 : 강조(진한 글씨)

      <em>, <i>태그 : 글씨 기울이기(이탤릭체)

      <mark>태그 : 하이라이팅(형광펜)

      <del>태그 : 텍스트 중간에 가로줄을 만든다.

      <ins>태그 : 텍스트 밑에 줄 긋기

      <sup>, <sub>태그 : 위 첨자, 아래 첨자

 

   리스트 태그

      1. 순서 없는 리스트

      <ul>태그 안에 <li> 태그 사용

      ul : Unordered list
      li : list
      예 ) 

         <ul>

                 <li>텍스트1</li>

                 <li>텍스트2</li>

                 ...

         <ul>

 

      2. 순서 있는 리스트

      <ol>태그 안에 <li>태그

      ol : Ordered list

      예 )

         <ol typr = "값" start = "값">

                 <li>텍스트1</li>

                 <li>텍스트2</li>

                 ...

         <ol>

 

type 값

1 : 숫자(1, 2, 3, ...)
A : 알파벳 대문자
a : 알파벳 소문자
i : 로마숫자(i, ii,  iii, ...)
I : 로마숫자(I, II, III, ...)