HTML, CSS, JavaScript란 무엇이며 필요한 이유

June·2021년 12월 16일

🚀 CS

목록 보기

2/3

HTML(Hyper Text Markup Language)

: 웹 브라우저에서 문서 및 웹 페이지가 표시되는 방법을 규정하는 언어이며, 어떠한 웹사이트에서든 블록(block)을 구성하는 데 사용되는 언어이기도 합니다. HTML을 이용하면, 웹사이트의 구조를 만들 수 있습니다.

HTML로 무엇을 할 수 있나?

HTML을 알아야 하는 주된 이유는 웹사이트를 운영자가 사이트의 기본적인 구조를 만들 수 있기 때문입니다. 웹사이트의 기본적인 구조를 만들고 나면, 다른 코딩 언어를 사용해서 디자인을 보강할 수 있습니다.

– HTML에 대한 내용을 기본적으로 이해하고 있다면, 웹사이트에 대한 제어와 유연성을 크게 높일 수 있습니다.
– HTML 코드에 대한 지식을 갖고 있다면, 사용자가 직접 변경할 수 있습니다.
– 웹 개발을 도와주는 플랫폼들은 웹사이트 디자인에서 필요한 복잡한 기능들은 자동으로 구현하는 경우가 많기 때문에, 일부 사소한 변경사항은 사용자가 HTML을 활용해서 직접 처리할 수 있습니다.

CSS(Cascading Style Sheets)

: HTML로 만들어진 문서의 (컬러, 폰트 스타일, 레이아웃, 반응형 특징 등의) 스타일을 지정하는 방식을 규정하는 유명한 스타일 시트 언어입니다. CSS는 웹사이트를 시각적으로 보다 매력적으로 만드는 기능을 제공합니다.

CSS로 무엇을 할 수 있나?

CSS는 주로 정적인 시각효과를 만드는데 사용되기는 하지만, 이 언어의 최신 버전에서는 아주 간단한 애니메이션 효과를 만드는 기능도 일부 제공하고 있습니다.

– 웹 페이지에 있는 일부 텍스트의 색상을 변경하고 싶다면, 기초적인 CSS만으로도 기존의 웹 페이지에 구현되어 있는 HTML 코드에 “스타일” 코드를 추가해서 원하는 작업을 처리할 수 있습니다.
– HTML로 표시된 내용에 더해서 CSS를 사용하면, 웹사이트의 레이아웃과 포맷을 변경할 수 있습니다.
– CSS의 기본에 대해서 알고 나면, 웹사이트의 모습은 물론이고 기존의 디자인에 적용된 모든 HTML을 개선할 수 있을 것입니다.

자바스크립트(JavaScript)

: 웹사이트가 로딩된 이후에 CSS와 HTML 구성요소들을 변경할 수 있게 해주며, 이를 통해서 웹사이트를 보다 인터랙티브(interactive)하게 만들고 사용자의 참여율도 높일 수 있습니다.

자바스크립트는 웹사이트를 보다 인터랙티브 하게 만들고 싶은 운영자들에게는 가장 중요한 프로그래밍 언어입니다. 그리고 이번 글에서 소개하는 세 가지의 기본적인 프로그래밍 언어들 중에서는 가장 복잡한 언어이기도 합니다.

HTML은 웹사이트의 구조를 제공하고 CSS는 웹사이트가 표시되는 모습을 제어하게 해준다면, 자바스크립트라는 프로그래밍 언어는 웹페이지에 포함되어 있는 다양한 구성요소들의 동작을 변경할 수 있는 도구를 제공해줍니다. 이러한 도구를 활용하면, 웹사이트의 CSS와 HTML 구성요소들이 동작할 수 있도록 하는 기능을 추가할 수 있습니다.

요즘에 볼 수 있는 대부분의 웹사이트에서는, 어떤 버튼을 클릭하면 새로운 메뉴가 펼쳐지면서 사용자가 웹사이트를 쉽게 탐색할 수 있게 만들어져 있습니다. 메뉴 버튼은 페이지의 옆쪽에 작은 메뉴 형태로 표시되며, 이것 만으로도 페이지에 인터랙티브 요소가 더해지게 됩니다. 이런 기능들은 모두 자바스크립트에 의해서 가능한 것이며, 웹사이트를 보다 정교하면서도 최신 버전으로 보이게 만들어줍니다.

자바스크립트에 대한 기본적인 내용을 이해하고 있으면, 웹사이트에 있는 여러 가지의 인터랙티브 기능들을 조작해서 다양한 범위의 작업을 수행할 수 있습니다. 웹사이트의 디자인과 기능을 완전히 제어하려면, 자바스크립트와 관련된 코딩을 어느 정도는 알고 있어야 합니다.