개발도구 HTML을 이용해서 웹 페이지를 만들 때 도와주는 전문화된 프로그램 종류 윈도우 : 메모장 Mac(맥) : Text Edit Atom(아톰) sublime text Bracket Atom(아톰) 설치 설명 Emmet 기능 : 코드 자동완성 기능 Emmet 기능 태그입력 + Tab : 꺾쇠()자동 완성 ol>li*4 + Tab : 순서형 리스트 완성 ctrl + alt + 오른쪽 화살표 (→) : 다음 편집 포인트(지점)로 워프
웹사이트 만들기 연결된 웹사이트 만들기 index.html 파일 생성 링크 마련하기 ( 태그 사용) -> 각각의 링크 완성 index.html 을 다른이름으로 저장해서 각각 1,2,3,4.html로 생성 1,2,3,4.html 의 내용을 변경하고 저장
DOCTYPE 자신이 작성한 HTML코드가 어떤 방식의 HTML 코드로 작성됐는지를 브라우저에게 알려주는 문자 DOCTYPE Document type declaration : 문서 타입 선언 브라우저에게 이 문서는 어떤 표준을 따르고있는 태그들인지 알려주는 것 이라고 작성하면 됨 더 알아보기
문서의 구조 태그들도 문서의 구조가 다 같진 않습니다. 부가적인 정보(문서를 꾸며주는 것)와 본문(본질적인 정보)로 나뉩니다. HTML 태그 head태그와 body태그를 감쌉니다. 맨 위에 위치합니다. 본문이 아닌 부가적인 정보입니다. head 태그 본문이 아닌 태그들은 태그 아래에 들어갑니다. ( ex : title, meta ) 본문이 아닌 부가적인 정보입니다. meta 태그 웹 페이지의 글씨가 깨지는 경우에는 태그를 만들면 됩니다. 태그 밑에 위치합니다. body 태그 본문인 태그들은 태그 아래에 들어갑니다. ( ex : h1~6, ol, ul … ) 태그안에 본문이 들어갑니다. 제목() 태그 제목으로 표시하고 싶은 곳에 태그를 붙이면 됩니다. 태그 밑에 위치합니다. 본문에 위치합니다.
태그의 중첩과 목록 리스트 만들기 라는 태그를 통해 리스트를 만들 수 있습니다. 각각의 글씨를 >, 태그를 이용하여 감싸줍니다. 리스트를 구별하고 싶을 때 ul, ol태그를 이용하여 그룹으로 묶어줄 수 있습니다. 가독성을 높이기 위해 Tab이나 Spacebar로 띄어쓰기/들여쓰기를 해줍니다. (1,2,3… 등) 순서가 있는 리스트 만들기 ul을 ol태그로 바꾸면 li들 앞에 숫자가 붙습니다. 각각 리스트 태그들의 뜻 ol : Ordered List [순서가 있는] ul : Unordered List [순서가 없는] li : List [목록 / 명단]
이해의 용이성 (1) - 이해의 용이성을 높이기 위한 검사항목 중 기본언어 표시를 이해하고 콘텐츠를 제공할 수 있습니다. - 사용자 요구에 따른 실행 항목을 이해하고 콘텐츠를 제공할 수 있습니다 기본 언어 표시 가. 기본 언어 표시의 이해 (1) 기본언어 표시의 개념 주로 사용하는 언어를 명시해야 함 나. 기본 언어 표시의 필요성 (1) 목적 다양한 언어 공부하거나 이용하는 사용자에게 중요한 지표 다. 기본 언어 표시의 검사항목 해설 검사항목 17.(기본 언어 표시) 주로 사용하는 언러를 명시해야 합니다. 중간에 언어가 바뀌는 경우 lang 속성 통해 언어를 바꿔주면 더 이해하기 좋은 사이트가 됨 "기본 언어 표시는 화면 낭독 프로그램과 같은 보조기기에서 기본 언어에 맞는 TTS(Text To Sppec..