본문 바로가기

꾸준한 독학

코딩 독학하기1 : HTML 기본개념 정리 (조코딩 유튜브로 공부하기)

HTML의 기본 구조에 대한 조코딩 유튜브를 보고 공부한 내용을 올립니다.

원래 조금은 알고 있던 내용이지만 정리해보았습니다.

 

기본적인 개념 정리 내용이므로,
좀 더 자세하게 기본적인 부분을 배우고 싶다면,

'코드카데미' HTML&CSS 무료 실습 강의
https://www.codecademy.com/learn/paths/learn-how-to-build-websites?coursePageWithSignup=true

or

'생활코딩'의 무료 HTML 수업 영상

https://opentutorials.org/course/2039

을 활용하세요.


 

💻HTML이란?

HyperText (링크)

Markup (구조를 표시하는)

Language (언어)

웹의 Front-end를 구성하는 언어

웹페이지의 구조가 전체적으로 어떻게 되어 있는지를 알 수 있는 언어

다양한 기능을 가진 태그를 쌓아 페이지의 모습을 완성

 

ex)

<태그이름> 내용 </태그이름>

 

 

 

💻웹 구조 이해하기

웹 사이트는 특정 블록으로 나눌 수 있습니다.

헤더, 기사, 배너 등

이렇게 구분 된 블록을 다시

기사 영역 내 제목, 내용으로 나눌 수 있습니다.

 

💻HTML 코드로 나타내기

<div class = "기사">
  <div class = "제목">
    <h1>구글 따라잡기 쉽지 않네...네이버 웨일, 이용자 확보에 '끙끙'</h1>
  </div>
  <div class = "기사내용">
    <b>네이버 웨일 PC 브라우저 .....(기사 머리말)</b>
    <img src = "이미지 주소">
    <p>기사 본문</p>

</div>

 

 

 

*아래 링크 내용을 공부하며 정리한 내용입니다.

https://www.youtube.com/watch?v=JMLBBv05ORw