[web] HTML 개념 공부 정리

바닐라코딩 사전 학습 가이드 따라 다시 차근차근 쌓아 올려보는 웹 공부.

HTML

HTML(hypertext markup language) 이란, 태그로 웹페이지의 내용이나 구조를 나타낸 마크업 언어 입니다. HTML 도큐먼트는 .html 확장자를 갖는 순수한 텍스트 파일로, 메모장, editor, IDE(통합개발환경)을 사용해서 편집이 가능합니다.

• IDE : 코딩, 디버깅, 컴파일, 배포가 하나의 프로그램에서 같이 처리할 수 있는 환경을 제공하는 소프트웨어

HTML의 가장 중요한 특징은 link이다. 텍스트 등의 정보가 동일 선상이 아니라, 다중으로 연결되어 있어, 사용자가 원하는대로 위치를 이동해가며 정보를 취득할 수 있다. 이를 하이퍼링크(hyper link) 라고 한다.

브라우저, 검색엔진, 개발자 모두에게 콘텐츠의 의미를 명확히 설명해주기 위해선 시맨틱 태그 를 사용해라. 적절한 시맨틱 태그 사용은 SEO 마케팅에 효과적이다.

• SEO(Search Engine Optimization) : 검색엔진 최적화

익숙하지 않은 text 태그 기록

• <em></em> : 이탤릭체
• <mark></mark> : 하이라이트 텍스트 지정
• <del></del> : 삭선
• <ins></ins> : 아래 밑줄
• <sub></sub> : baseline보다 아래에 쓰이는 text
• <sup></sup> : baseline보다 위에 쓰이는 text
• <pre></pre> : 형식화된 텍스트 지정
• <q></q> : 인용문 지정, ""
• <blockquote></blockquote> 긴 인용문 블록 지정, 들여쓰기

알아두면 좋을 기록

• fragment identifier
  • 북마크처럼, <a herf="#top"> 한다면, id="top" 를 가진 태그로 이동이 가능하다.
  • 포트폴리오에 써봐야지.
• target attribute
  • target="_blank" : 새로운 탭에서 연결 문서 오픈
• table
  • border-collapse: collapse;
  • border-collapse: separate;
  • rowspan , colspan

좋은 링크

학습 링크_html(1-10)

애플이 플래쉬를 버리고 html5를 채택한 기술적 이유

어떻게 http가 작동하나요?