본문 바로가기

Today I Learned/HTML4

[HTML] Meta 태그로 SEO 최적화 1. title문서 제목2. description문서 설명3. robots크롤러 또는 로봇의 동작을 지정값설명index페이지 색인 가능noindex페이지 색인 금지follow페이지 내부 하이퍼링크 추적 가능nofollow페이지 내부 하이퍼링크 추적 금지all=(index, follow)none=(noindex, nofollow)noarchive페이지를 캐시에 포함 금지nosnippet검색엔진 결과에 어떠한 설명도 표시 금지noimageindex페이지 이미지 색인 금지nocache=noarchive4. charset문자 인코딩 정의5. viewportviewport 초기 사이즈 설정 (mobile only) 2025. 3. 16.
[HTML] TabIndex - 에이블런 프론트엔드부트캠프 25일차 TabIndex로 키보드 포커스 여부와 우선순위 제어를 할 수 있다. 1. 키보드 포커스웹은 상호작용 가능한 요소는 기본적으로 키보드 포커스가 잡힐 수 있도록 구현되어있다. 대표적으로 input, select 와 같은 form 관련 요소나 a 요소를 예로 들 수 있다. 2. tabindex='0'상호작용이 불가능한 div나 span과 같은 요소에도 키보드 포커스가 잡히도록 구현하고 싶을 경우에는 tabindex의 값을 0으로 바꾸어주면 키보드 포커스가 잡히는 것을 볼 수 있다.홈으로 연락처 이름: 이메일: 제출 3. tabindex='-1'상호작용이 가능한 요소가 키보드 포커스에 잡히지 않게 하기 위해서는 .. 2024. 8. 19.
[HTML] FORM, TABLE- 에이블런 프론트엔드부트캠프 6일차 1. Formform 태그는 사용자로부터 특정 정보값을 입력 받기 위해 사용된다. form 태그의 속성으로는 action과 method가 있다. action은 입력정보들을 보낼 위치를 지정하고 method는 입력정보들을 보내는 방식을 지정할 수 있다.  form 태그 안에는 fieldset 태그를 사용해 입력정보를 그룹화 해야한다. 또한 그 안에는 legend 태그를 통해 form의 정보를 명시해야 한다. Form 정보  2. Inputinput 태그를 통해 사용자로부터 입력을 받을 수 있다. 일반적으로 input 태그는 form 태그 내부에서 사용된다.input 태그가 사용가능한 타입으로는 다음과 같다.속성명buttoncheckboxcolordateemailfilehidde.. 2024. 7. 22.
[HTML] HTML 태그 - 에이블런 프론트엔드 부트캠프 1일차 HTML은 웹 페이지를 구성하는 텍스트, 이미지, 링크 등 모든 요소를 구성하고 구조를 정의하는 언어이다. 이 언어를 활용하여 웹 페이지의 내용을 채우고 사용자에게 정보를 제공할 수 있다. 오늘은 HTML의 태그에 대해서 공부했다. 1. 시멘틱 태그시멘틱 태그는 콘텐츠의 특정 의미를 정의하고 목적을 갖는 태그이다. HTML 5로 버전업 되면서 div 태그가 아닌 시멘틱 태그를 활용해 HTML을 구성한다 시멘틱 태그의 종류는 다음과 같다종류설명header웹 문서의 머리말 영역nav웹 문서에서 메뉴 영역 ( 링크 등 )figure웹 문서에서 다양한 미디어를 담는 영역main웹 문서의 본문 영역aside웹 문서의 본문과 연관성이 적은 외부 영역section웹 문서의 특정 영역을 그룹화article웹 문서에서 .. 2024. 7. 15.