웹개발20 HTML <meta> 태그: 웹사이트 성능 향상과 검색 엔진 최적화를 위한 핵심 요소 META 태그란? 태그는 HTML 태그는 태그 사이에만 존재할 수 있는 태그입니다 메타데이터가 하나 이상이라면 태그를 여러번 사용할 수 있어요 태그의 속성 name, contect : 메타데이터의 이름과 내용을 적습니다. name의 종류는 "description", "keywords", "author", "robots" 등이 있습니다. 이 모든 메타데이터는 검색엔진이 내 웹페이지를 잘 검색할 수 있도록 도와줍니다. description : 웹페이지의 주제와 요약 내용을 적습니다 keywords : 웹페이지가 어떤 키워드를 담고 있는지 적습니다 author : 웹페이지를 만든 사람 이름을 적습니다 robots : 검색 엔진 크롤러에게 색인 여부와 방식을 알려줍니다. index, follow라고 적으면 크롤.. 2023. 6. 1. 웹페이지의 메타데이터와 스타일을 정의하는 HTML <head> 태그 HEAD 태그란? 2023. 6. 1. 웹 페이지 구성을 위한 HTML <section> 태그 SECTION 태그란? HTML에서 section 태그는 웹 페이지의 구획을 나누는 데 사용됩니다. 이렇게만 얘기하면 무슨 소리지? 라고 생각될텐데요. 저도 이런 태그는 있으나 없으나 똑같은 것 아닌가? 라고 생각했습니다. 그런데, 검색엔진은 이런 구획 나누는 태그를 좋아한다고 하네요. 시맨틱 구조이기 때문이죠. 안에 가 들어가고, 안에 이 들어가겠죠? 은 안에 들어가는 태그입니다. 사용법 컨텐츠가 A 내용, B 내용으로 구분된다면 각각 태그로 그룹핑합니다 예시 소개 회사 소개 내용... 서비스 서비스 1 서비스 2 서비스 3 위의 코드에서는 첫 번째 section 태그에는 "소개"라는 제목과 회사 소개 내용이 포함되어 있습니다. 두 번째 section 태그에는 "서비스"라는 제목과 목록 형태로 서비스 .. 2023. 5. 31. HTML 리스트 생성 <ol> 태그 - 순서가 존재하는 목록 생성 OL 태그란? OL (Ordered List) 태그는 정렬된 목록을 생성하는 도구입니다. 태그가 마커로 정렬하는 것과 달리 은 순서대로 정렬하는 태그입니다. 기본값은 숫자이지만 알파벳을 이용할 수도 있지요. 태그 역시 li (List) 태그와 항상 함께 다닙니다. 사용법 List 1 List 2 List 3 태그를 엽니다. 앞으로 순서가 존재하는 리스트를 만들거라고 선언한거죠 다음 줄에 들여쓰기를 한 뒤 태그를 만듭니다. 원하는 만큼 만들면 됩니다. 태그 사이에 원하는 목록을 추가합니다. 태그를 써서 닫습니다. 예시 See the Pen OL by 40's Programmer (@40sProgrammer) on CodePen. UL 태그의 속성 ol 태그에서 자주 사용하는 2가지 속성 type, star.. 2023. 5. 30. 이전 1 2 3 4 5 다음