웹표준23기 건대 4번째 스터디 - 이미진
 웹 문서가 서로 상호작용을 할 수 있도록 하는 역할


 검색어 입력, 원하는 값을 선택, 목록상자 등
서버로 자료를 전송하기 위한 버튼 등이 해당
 폼의 범위를 정한다
 속성
  Action =“url”
   폼의 내용을 처리하기 위한 서버의 url(필수)
  Method =“get 또는 post”
     get : action 속성에 지정한 url에 폼의 내용을 추가해서 서버
      에 송신하는 방식 form의 기본값, 데이터의 길이가 짧을경우
      적합하며 ,post보다 속도가 빠르나 주소창에 변수값이 노출
      되므로 보안상의 경우는 post를 사용한다
     post : 폼의 본문을 송신하는 방식, 길이가 길때 적합, 보안문
      제때문에 데이터값을 노출시킬수 없을때 (회원가입등) 사용
 fieldset
   여러 개의 폼 요소를 그룹화 하여 좀 더 구조적으로 묶
    어줄 때 사용한다. 기본값은 border가 있어서 콘텐츠가
    폼과 관련있는 요소인지 구별할 수 있게 해준다.

 legend
   하나의 fieldset안에 하나의 legend가 가능하며, 필드셋
    바로다음에 작성해준다 그 그룹의 컨텐츠가 어떠한 성
    격인지 제목형식으로 알려준다.

  Xhtml에서는 반드시 사용하지않아도 괜찮지만 접근성측
  면에서 사용하도록 한다
 폼을 구조화 하고 접근성을 높인다.
 각 폼 컨트롤의(예를 들면 인풋요소) 연관관계와 추가
  설명을 하는 역할을 담당한다. 1대1로 대응
 웹표준을 지원하는 브라우저의 경우 레이블만 선택해
  도 폼 컨트롤이 선택된다.
 스크린리더의 경우 폼 컨트롤과 레이블이 떨어져있어
  도 인식할 수 있도록 지원.
 명시적 방법(for속성과 폼 컨트롤의 id를 연결)과 암묵
  적 방법(label안에 폼 컨트롤 포함)의 2가지가 있다.
(첫번째 소스 주석4번 참고)
 text : 한줄 글상자, 텍스트를 입력받음
 password : 비밀번호 입력상자, 값을 * 등으로 표시
 radio : 동그란 라디오 버튼, name값을 동일하게 주면 하나만 선
    택가능함
   checkbox : 다중선택 가능한 체크박스
   file : 파일을 첨부 형태로 서버로 보낼 때 사용
   image : 이미지 버튼 src속성에 이미지 경로, alt에 대체텍스트
    사용
   submit : 전송버튼
   reset : 취소버튼
   button : 범용버튼, 이벤트가 발생할 때 스크립트 또는 프로그램
    수행하기 위함
   hidden : 숨김 컨트롤, 화면에 표시되지 않으며 프로그램에 송신
    하려고 하는 데이터 지정
 select
   목록상자
   기본은 드롭다운 형태지만 size=“10” 같이 1 이상주게
    되면 리스트 박스 형태로 나온다
   Multiple 이란 속성을 사용하면 다중선택이 가능
 optgroupt
   옵션들을 그룹으로 묶어서 사용한다
   Label 이란 속성을 사용하면 어떤 종류로 묶였는지 나
    타낼수있다.
 option
   Select박스의 하위 항목 value 속성을 가질 수 있다.
   Selected 속성을 사용하여 맨 처음에 노출시킬수있음
 여러줄 글상자
 입력받을 수 있는 텍스트 수는 제한이 없다
 영역크기는 cols=“영문a의 경우 a가 가로로 들어가는
  숫자” , rows=“a가 세로로 들어가는 숫자” 로 정한다.
 웹 브라우저나 글꼴에 따라서 달라질 수있으므로
CSS에서 크기를 지정한다.
 인풋요소의 타입과 같지만 좀더 유연한 디자인이 가
    능하다.
   Image 이미지 버튼 (기본속성은 submit)
   Button 그냥 텍스트 기본버튼
   Submit 전송 버튼
   Reset 취소 버튼
 아닙니당
 Button요소의 경우 스스로 어떤콘텐츠인지를 알려주
    기때문에 레이블이 필요없다.(콘텐츠 자체를 요소로
    가짐)
   Input type=“submit” , input type=“reset”은 value 속성
    으로 대체할 수 있다.
   Type=“image”인 경우 alt 속성이 대체용으로 사용됨
   숨김input type=“hidden” 도 필요없다.
    label을 사용하지 못할경우 title로 대체할 수도있다.
 웹표준 핵심가이드 북 xhtml+css




Html5에서는 폼요소가 많이 추가가 되었습니다.
꼭 확인하고 공부하세염..

웹표준스터디4주차 이미진

  • 1.
    웹표준23기 건대 4번째스터디 - 이미진
  • 2.
     웹 문서가서로 상호작용을 할 수 있도록 하는 역할  검색어 입력, 원하는 값을 선택, 목록상자 등 서버로 자료를 전송하기 위한 버튼 등이 해당
  • 7.
     폼의 범위를정한다  속성  Action =“url” 폼의 내용을 처리하기 위한 서버의 url(필수)  Method =“get 또는 post”  get : action 속성에 지정한 url에 폼의 내용을 추가해서 서버 에 송신하는 방식 form의 기본값, 데이터의 길이가 짧을경우 적합하며 ,post보다 속도가 빠르나 주소창에 변수값이 노출 되므로 보안상의 경우는 post를 사용한다  post : 폼의 본문을 송신하는 방식, 길이가 길때 적합, 보안문 제때문에 데이터값을 노출시킬수 없을때 (회원가입등) 사용
  • 8.
     fieldset  여러 개의 폼 요소를 그룹화 하여 좀 더 구조적으로 묶 어줄 때 사용한다. 기본값은 border가 있어서 콘텐츠가 폼과 관련있는 요소인지 구별할 수 있게 해준다.  legend  하나의 fieldset안에 하나의 legend가 가능하며, 필드셋 바로다음에 작성해준다 그 그룹의 컨텐츠가 어떠한 성 격인지 제목형식으로 알려준다. Xhtml에서는 반드시 사용하지않아도 괜찮지만 접근성측 면에서 사용하도록 한다
  • 9.
     폼을 구조화하고 접근성을 높인다.  각 폼 컨트롤의(예를 들면 인풋요소) 연관관계와 추가 설명을 하는 역할을 담당한다. 1대1로 대응  웹표준을 지원하는 브라우저의 경우 레이블만 선택해 도 폼 컨트롤이 선택된다.  스크린리더의 경우 폼 컨트롤과 레이블이 떨어져있어 도 인식할 수 있도록 지원.  명시적 방법(for속성과 폼 컨트롤의 id를 연결)과 암묵 적 방법(label안에 폼 컨트롤 포함)의 2가지가 있다. (첫번째 소스 주석4번 참고)
  • 10.
     text :한줄 글상자, 텍스트를 입력받음  password : 비밀번호 입력상자, 값을 * 등으로 표시  radio : 동그란 라디오 버튼, name값을 동일하게 주면 하나만 선 택가능함  checkbox : 다중선택 가능한 체크박스  file : 파일을 첨부 형태로 서버로 보낼 때 사용  image : 이미지 버튼 src속성에 이미지 경로, alt에 대체텍스트 사용  submit : 전송버튼  reset : 취소버튼  button : 범용버튼, 이벤트가 발생할 때 스크립트 또는 프로그램 수행하기 위함  hidden : 숨김 컨트롤, 화면에 표시되지 않으며 프로그램에 송신 하려고 하는 데이터 지정
  • 11.
     select  목록상자  기본은 드롭다운 형태지만 size=“10” 같이 1 이상주게 되면 리스트 박스 형태로 나온다  Multiple 이란 속성을 사용하면 다중선택이 가능  optgroupt  옵션들을 그룹으로 묶어서 사용한다  Label 이란 속성을 사용하면 어떤 종류로 묶였는지 나 타낼수있다.  option  Select박스의 하위 항목 value 속성을 가질 수 있다.  Selected 속성을 사용하여 맨 처음에 노출시킬수있음
  • 12.
     여러줄 글상자 입력받을 수 있는 텍스트 수는 제한이 없다  영역크기는 cols=“영문a의 경우 a가 가로로 들어가는 숫자” , rows=“a가 세로로 들어가는 숫자” 로 정한다.  웹 브라우저나 글꼴에 따라서 달라질 수있으므로 CSS에서 크기를 지정한다.
  • 13.
     인풋요소의 타입과같지만 좀더 유연한 디자인이 가 능하다.  Image 이미지 버튼 (기본속성은 submit)  Button 그냥 텍스트 기본버튼  Submit 전송 버튼  Reset 취소 버튼
  • 14.
     아닙니당  Button요소의경우 스스로 어떤콘텐츠인지를 알려주 기때문에 레이블이 필요없다.(콘텐츠 자체를 요소로 가짐)  Input type=“submit” , input type=“reset”은 value 속성 으로 대체할 수 있다.  Type=“image”인 경우 alt 속성이 대체용으로 사용됨  숨김input type=“hidden” 도 필요없다.  label을 사용하지 못할경우 title로 대체할 수도있다.
  • 15.
     웹표준 핵심가이드북 xhtml+css Html5에서는 폼요소가 많이 추가가 되었습니다. 꼭 확인하고 공부하세염..