HTML, CSS, JS(JavaScript)의 정의

웹사이트는 크게 아래와 같이 3가지 요소(HTML, CSS, JS)로 구성된다.

 

HTML(Hyper Text Markup Language)

• 하이퍼 텍스트 마크업 언어

  • 하이퍼 텍스트 : 참조(하이퍼링크)를 통해 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트

  • 마크업 언어 : 문서의 구조를 표현하는 역할

• 웹페이지를 만들기 위하여 사용하는 언어

• 웹페이지에서 제목, 이미지, 동영상, 문단, 표, 등을 정의하고 그 구조와 의미를 부여하는 정적 언어

• 웹의 구조를 담당

 

 

CSS(Cascading Style Sheets)

• 캐스캐이딩 스타일 시트

  • 캐스캐이딩 : '계단식, 위에서 아래로 흐르는'을 의미

  • 스타일 시트 : 글꼴의 크기, 모양, 컬러, 문단 설정 등 미리 정의해 스타일로 만들었다가 웹 문서의 본문에서 그 스타일을 참조하여 사용하는 기능

• 마크업 언어(HTML, XML, XHML 등)가 실제 표시되는 방법(색상, 레이아웃, 크기, 폰트 등)을 지정하여 콘텐츠 구조를 꾸며주는 정적 언어

• 웹의 시각적인 표현을 담당

 

 

JS(JavaScript)

• HTML 문서의 정적이고 단조로운 한계를 극복하기 위해서 넷스케이프(Netscape)사가 만든 LiveScript가 이름을 달리 한 것으로 브라우저 자체에서 내장된 해석기능을 이용한 클라이언트 기반의 일종의 스크립트 언어(Java와 연관 없음)

• 콘텐츠를 바꾸고 움직이는 등 페이지를 동적으로 꾸며주는 역할을 하는 프로그래밍 언어

• 웹의 동적 처리를 담당한다.

 

 

HTML과 CSS가 정적언어라고 한다면 JS는 동적언어

(JS : 프로그래밍 언어이기도 하면서 HTML, CSS로 만들어진 정적인 페이지를 동적으로 만들어주는 언어)

 

 

 

정리하면...

HTML로 웹페이지의 뼈대를 만들고

CSS로 웹페이지의 옷을 입히고,

JS로 기능을 추가한다!

 

 

cf) 웹페이지, 웹사이트, 웹애플리케이션(웹앱)

• 웹에서는 결과를 웹페이지

• 웹페이지가 모여있으면 웹사이트

• 기능이 좀 많으면 웹애플리케이션(웹앱)

 

junghn.tistory.com/entry/htmlcss-HTMLCSSJavascript-%EC%9D%98-%EC%A0%95%EC%9D%98%EC%99%80-%EC%B0%A8%EC%9D%B4%EC%A0%90

[html/css] HTML/CSS/Javascript 의 정의와 차이점

velog.io/@i01029407043/TIL.-FrontEnd-HTMLCSSJavaScript%EC%9D%98-%EC%A0%95%EC%9D%98%EC%99%80-%EC%97%AD%ED%95%A0

FrontEnd : HTML/CSS/JavaScript의 정의와 역할

www.inflearn.com/course/%EC%A0%9C%EC%A3%BC%EC%BD%94%EB%94%A9-%EC%9B%B9%EA%B0%9C%EB%B0%9C-30%EB%B6%84%EC%9A%94%EC%95%BD/lecture/63252?tab=note&mm=close

HTML, CSS, JS, Python 30분 요약강좌 - 인프런

opentutorials.org/course/3084/18445

코딩과 HTML - 생활코딩