[WEB] WEB 이란? 웹 사이트의 구성요소 및 웹 사이트 개발 환경 설정

WEB이란?

웹 사이트란 브라우저를 통해서 접속하는 웹 페이지(문서)들의 모음

웹 페이지는 글, 그림, 동영상 등 여러가지 정보를 담고 있으며, 마우스로 클릭하면 다른 웹 페이지로 이동하는 ‘링크’들이 있다. ‘링크’를 통해 여러 웹 페이지를 연결한 것을 웹 사이트라고 한다.

웹 사이트의 구성 요소 : HTML, CSS, JavaScript

• HTML → 구조, 뼈대
• CSS → 표현, 보여지는 부분
• JavaScipt → 동작

웹 사이트와 브라우저

• 웹 사이트는 브라우저를 통해 동작한다.
• 브라우저마다 동작이 약간씩 다르기 때문에 문제가 생기는 경우가 많다. 이를 파편화라고 한다.
• 이러한 문제를 해결하기 위하여 w3c에서 제시한 웹 표준이 등장하게 되었다.

웹 표준

• 웹 표준은 웹에서 표준적으로 사용되는 기술이나 규칙을 말한다.
• 어떤 브라우저든 웹 페이지가 동일하게 보이도록 한다.(크로스 브라우징)

브라우저별 호환성 체크 : Can I use?

이 브라우저에서 특정한 기능을 사용할 수 있을까?라는 궁금증이 생긴다면 Can I use? 를 통해 브라우저별 호환성 체크를 할 수 있다.

개발 환경 설정

Visual Studio Code

• HTML/CSS 코드 작성을 위한 Visual Studio Code 추천 확장 프로그램
  • Open in browser
    • HTML 파일을 브라우저에서 쉽게 열기 위한 확장 프로그램 (alt + b)
  • Auto rename tag
    • 태그 수정 시 일치하는 태그도 한번에 수정하기 위한 확장 프로그램
  • Highlight Matching Tag
    • 일치하는 태그를 하이라이팅 해주는 확장 프로그램
  • Live Server
    • 웹 페이지 실행 결과를 바로 보여주는 프로그램