웹 개발자 도전기

웹 표준은 HTML , CSS , JavaScript를 작성할 때 W3C에서 정한 공식 문법과 구조 규칙을 따르는 것을 말합니다. 시멘틱 태그를 써야 하는 이유div 하나만 너무 많이 사용하지 말고 의미 있는 태그를 적절히 사용해야 합니다.검색엔진 최적화(SEO)HTML 구조를 분석해 콘텐츠의 내용을 파악한다.이때 시멘틱 태그를 사용하면 페이지의 구조와 의미를 더 명확히 전달할 수 있어 검색 결과에 긍정적인 영향을 줄 수 있다.스크린 리더 호환시멘틱 태그는 스크린 리더가 콘텐츠 구조를 올바르게 파악하고 사용자에게 의미 있는 정보를 순서에 맞게 전달할 수 있도록 도와준다.유지보수 편리시멘틱 태그를 사용하면 이름만 봐도 그 영역의 역할을 쉽게 파악할 수 있기 때문에 여러 명이 협업할 때 구조를 이해하기 쉽..

1. 폼 태그 ( )폼은 사용자와 상호작용하여 정보를 입력받고 서버로 전송하기 위한 양식입니다. 주요 속성 :action : 폼 데이터를 전송할 서버의 URLmethod : 전송 방식 (get 또는 post)name : 폼의 이름target : 응답을 표시할 위치autocomplete : 자동 완성 기능 (on 또는 off)  2. 레이블 태그 ( )폼 요소에 이름을 붙이는 데 사용합니다. 접근성 향상에 도움이 됩니다. 사용 방법 : 레이블명 레이블명  3. 입력 태그( )다양한 유형의 사용자 입력을 받는 데 사용됩니다. 주요 type 속성값 : text : 한 줄 텍스트 입력password : 비밀번호 입력checkbox : 다중 선택radio : 단일 선택number : 숫자 입력range : ..

HTML 기본 구조HTML 문서는 이러한 기본 구조를 가집니다 : 문서가 HTML5로 작성되었음을 브라우저에 알립니다. : HTML 문서의 루트 요소입니다. : 문서의 메타데이터를 포함합니다(제목 , 스크립트 , 스타일 등). : 브라우저 탭에 표시될 페이지 제목을 정의합니다. : 웹 페이지에 표시될 실제 내용을 포함합니다. 1. 블록 요소와 인라인 요소HTML 요소는 블록 레벨 요소와 인라인 요소로 나뉩니다블록 요소 : 새로운 줄에서 시작하며 가능한 전체 너비를 차지합니다.예 : , , ~ , , , 인라인 요소 : 줄 바꿈 없이 내용의 흐름을 유지합니다.예 : , , , ,  2. 텍스트 관련 태그 a) 제목 태그 : ~ 태그는 웹 페이지의 제목을 나타냅니다. 이 가장 중요한 제목..

HTML은 웹에서 다양한 정보를 웹 브라우저에서 이해하기 쉽게 문서화하기 위해 사용하는 마크업 언어입니다.HTML은 웹 문서의 구조와 내용을 구성하는 데 사용되며 여기에서 Hypertext는 문서와 문서를 서로 연결해 주는 링크를 의미하고 Mark-up Language는 정보를 구조적으로 표현할 수 있는 언어를 뜻합니다. HTML의 역사1991 : Tim Berners-Lee 가 HTML 1.0을 최초 발표.1993 : 최초의 그래픽 웹 브라우저 Mosaic 출시.1995 : W3C에서 HTML 2.0 표준 발표.1999 : HTML 4.0.1 발표.2001 : XHTML 1.0 발표.2014 : HTML5 발표, 현재 HTML의 표준으로 자리잡음. HTML의 주요 구성 요소태그(Tag) : HTML은 ..

Auto Rename Tag  HTML 작성 시 시작 태그와 닫는 태그를 동시에 수정 가능하다.   Auto Close Tag  HTML 파일 작성 시 닫는 태그를 자동 완성한다.  Highlight Matching Tag • HTML 작성 시 일치하는 해당 태그 클릭 시 닫는 태그를 자동 하이라이트 한다.  Image preview • HTML 작성 시 이미지 경로에 마우스를 올리면 이미지를 미리 볼 수 있다.   ESLint  소스 코드 작성 시 실수를 하면 오류 메시지를 알려주기 때문에 디버깅 시간을 단축할 수 있다.    ES6 Code snippets  화살표 함수 등 자동 완성할 수 있는 코드 템플릿을 제공한다.    Live Server  웹 서버 설치 없이 현재 작성하..