• HTML5 MARKUP
  • HTML 목록
  • HTML 폼
    • GET VS POST

HTML5 MARKUP

<header><h1>...</h1></header>
 <nav>
     <header id="고유한_이름" class="다른_이름 또_다른_이름"></header>
 </nav>
 <article>
     <h3>...</h3>
 </article>
 <main>
     <header><h3>...</h3></header>
 </main>
 <footer></footer>
  • 문서 내에서 <h1>요소는 한번만 사용하기를 권장
  • header, footer요소는 여러곳(섹션 요소)에 들어갈 수 있기 때문에 식별자 부여
  • 모든 섹션요소에는 보이든 안보이든 제목이 반드시 기입
  • main 요소는 문서에서 한번만 써야 함
  • 브라우저별 HTML5 지원 현황 알아보기

HTML 목록

<!-- Ordered List -->
<ol>
  <li>...</li>
</ol>

<!-- Unordered List -->
<ul>
  <li>...</li>
</ul>

<!-- Definition List -->
<dl>
  <dt>...</dt>
  <dd>...</dd>
</dl>
  • Ordered List
  • Unordered List
  • Definition List

HTML 폼

<form action="/register.php" method="POST" name="register_form" enctype="multipart/form-data">
  <label for="user_id">ID</label>: <input type="text" id="user_id" name="user_id">
  <label for="user_id">PASSWORD</label>: <input type="text" id="user_password" name="user_password">
  <button type="submit">전송</button>
</form>
  • action: 데이터를 보낼 곳, 메서드: 보내는 방식
  • input: input 요소에 암묵적 레이블 연결, 일부 스크린리더는 읽지 못하므로 권장하지 않음.
  • input 요소에 명시적 레이블 연결: for 속성과 id 속성이 연결 된다.
  • id 속성은 접근성, name 속성은 서버에 값을 전송할 경우, 필요하므로 둘 다 기입한다.

GET VS POST

조건 GET POST
보안 POST에 비해 덜 보안적 GET에 비해 보안적
데이터 제한 제한적, url 허용 길이만큼 제한 없음
데이터 타입 제한 오직 아스키 문자만 해당 제한 없음, 바이너리 역시 사용가능
뒤로가기, 재전송 사용자가 입력한 내용 다시 작성 사용자에게 지워짐을 경고 함
인코딩 application-x-www-form-urlencoded multipart/form-data, application-x-www-form-urlencoded