HTML Semantic Web

SEO(Search Engine Optimization / 검색엔진 최적화) 같은 마케팅 도구를 사용하여 검색엔진이 본인의 웹사이트를 검색하기 알맞은 구조로 조정하기도 하는데 이것은 검색엔진이 웹사이트 정보를 어떻게 수집하는지 아는 것으로부터 시작된다. 검색엔진은 로봇(Robot)이라는 프로그램을 이용해 전세계 웹사이트 정보를 수집한다(크롤링이라 하며 검색엔진의 크롤러가 이를 수행한다) 그리고 검색 사이트 이용자가 검색할 만한 키워드를 미리 예상하여 검색 키워드에 대응하는 인덱스(색인)을 만들어 둔다.(이것을 인덱싱이라 하며 검색엔진의 인덱서가 이를 수행한다.) 인덱스를 생성할 때 사용되는 정보는 검색 로봇이 수집한 정보인데 결국 웹사이트의 HTML 코드이다. 즉, 검색 엔진은 HTML 코드만ㅇ느로 그 ..

2022.04.29

HTML의 기본 문법

HTML ( Hyper Text Markup Language)은 웹페이지를 기술하기 위한 마크업 언어이다. 웹페이지의 내용(content)과 구조(structure)을 담당하는 언어로써 HTML 태그를 통해 정보를 구조화 하는 것. HTML5 문서는 반드시 으로 시작하여 문서 형식(document type)을 HTML5로 지정한다. 실제적인 HTML document은 2행부터 시작되는데 과 사이에 기술한다. 사이에는 document title, 외부 파일의 참조, 메타데이터의 설정 등이 위치하며 이 정보들은 브라우저에 표시되지 않는다. 웹브라우저에 출력되는 모든 요소는 와 사이에 위치한다. HTML document는 요소(Element)들의 집합으로 이루어진다. HTML 요소는 시작 태그(start ta..

2022.04.29

HTML Image & Multimedia tag: audio, video

: 이미지를 문서 내 삽입할 때 사용하는 태그 src 이미지 파일 경로 alt 이미지 파일이 없을 경우 표시되는 문장 width 이미지의 너비 (CSS에서 지정하는 것이 일반적) height 이미지의 높이 (CSS에서 지정하는 것이 일반적) : 오디오를 문서 내 삽입할 때 사용하는 태그 src 음악 파일 경로 preload 재생 전에 음악 파일을 모두 불러올 것인지 지정 autoplay 음악 파일을 자동의 재생 개시할 것인지 지정 loop 음악을 반복할 것인지 지정 controls 음악 재생 도구를 표시할 것인지 지정. 재생 도구의 외관은 브라우저마다 차이가 있다. : 비디오를 문서 내 삽입할 때 사용하는 태그 src 동영상 파일 경로 poster 동영상 준비 중에 표시될 이미지 파일 경로 preload..

2022.04.09

[HTML] form tag

0. 흐름 form 태그는 클라이언트에서 서버로 데이터 전송을 위해 사용한다. 프론트엔드에서 HTML의 구조와 전반적인 흐름은 아래와 같다. 태그의 가장 중요한 두 속성(attribute)은 action(수신 대상), method(전송 방식)이다. 사용자에게 데이터를 입력받기 위한 input 태그 : 사용자가 텍스트 필드에 글자를 입력하거나 체크박스나 라디오 버튼을 클릭하기 위한 입력 양식을 넣어주기 위하여, form 태그 하위에 input, textarea, button, select, checkbox, radio button, submit button 등의 태그를 포함. 입력받은 데이터를 서버에 전송하기 위한 input type=”submit” : submit button이 클릭되면 input 태그에..

2022.04.09

HTML 텍스트 관련 태그

1. 제목 (Headings) 태그 제목 지정 태그: ~ 2. 본문 태그 단락 표시 태그: 문자를 그대로 표시하는 태그: 줄바꿈 태그: (empty tag) 수평줄 태그: (empty tag) 짧은 인용문(quotation) 태그: 긴 인용문(blockquote) 태그: 3. 글자 형태 (Text Formatting) 태그 굵은 글꼴 태그: 글꼴 중요도 태그: (Semantic tag) 글꼴 기울임 태그: 글꼴 중요도 태그: (Semantic tag) 약자를 나타내는 태그: 윗첨자, 아래첨자 태그: , 하이라이트 태그: 중첩 밑줄 태그: 밑줄 태그: h1 h2 h3 h4 h5 h6 안녕하세여 김예진 이에여. 방가 안녕 하세요 pre태그는 띄어쓰기나 엔터가 가능 하다. daum site hello worl..

2022.03.30