웹이란?

World Wide Web (WWW, W3)은 인터넷에 연결된 컴퓨터를 이용해 사람들과 정보를 공유하는 공간이다.

 

Photo by Lachlan on Unsplash

 

하나의 사이트나 다른 사이트와의 관계가 거미집처럼 복잡하게 얽혀 있기 때문에 웹이라고 부른다. 인터넷 상의 정보를 하이퍼텍스트 방식과 멀티미디어 환경에서 검색할 수 있게 해주는 정보검색 시스템이다 - 위키 백과

• 웹사이트 Web Site: 웹 서비스를 제공하는 기관이나 장소
• 웹 서버 Web Server: 웹 서비스를 제공하는 호스트 컴퓨터

 

세계 최초의 웹사이트 (팀 버너스 리 경)

The World Wide Web project

 

하이퍼텍스트

출처: The World Wide Web project

 

• 하이퍼링크를 통해 독자가 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트
• 기존의 문서가 순차적이면서 서열형 구조라면, 하이퍼텍스트는 링크에 따라 그 차례가 바뀌는 임의적이면서 나열형인 구조 - 위키 백과

 

---

 

웹의 3요소:
URL(Uniform Resource Locator), HTTP(HyperText Transfer Protocol), HTML(HyperText Markup Language)

 

웹의 3요소: 1. URL: Uniform Resource Locator

 

URI

• 통합 자원 식별자(Uniform Resource Identifier)

• 인터넷에 있는 자원을 나타내는 유일한 주소 / 중복이 없는 주소

• URI의 하위 개념으로 URL, URN이 있다. - 위키 백과

 

URL-Uniform Resource Lacator

• 흔히 웹 사이트 주소로 알고 있지만, URL은 웹 사이트 주소뿐만 아니라 컴퓨터 네트워크 상의 자원을 모두 나타낼 수 있다. - 위키 백과

 

URN-Uniform Resource Names

• 콘텐츠의 위치, 프로토콜, 호스트 등과는 상관없이 각각의 콘텐츠에 이름을 부여한 것으로, 개별 콘텐츠에 식별자를 부여하게 되면, 콘텐츠의 위치, 프로토콜, 호스트와 관계없이 콘텐츠의 위치를 파악할 수 있으며, 관련 정보도 함께 담을 수 있다는 장점이 있다.

• URL은 어떤 특정 서버에 있는 웹 문서를 가리키는 반면, URN은 웹 문서의 물리적인 위치와 상관없이 웹 문서 자체를 지시한다. 따라서 웹사이트에 있는 어떤 웹 문서가 다른 웹 서버로 이동하거나 주소가 바뀌더라도 URN은 여전히 그 문서를 가리키고 있기 때문에 사용자는 그 문서에 대한 URN을 갖고 있으면 그 문서가 어떤 웹 서버로 이동되어 있더라도 그 문서를 찾을 수 있는 것이다.

• 영어로 주소를 쓰는 개념이 아닌, 숫자 또는 암호에 해당되는 유일한 주소를 의미한다.

• 주소를 몰라도 접근할 수 있는 방법이며, 지금은 거의 사용되지 않는 개념

 

 

웹의 3요소: 2. HTTP: HyperText Transfer Protocol

 

HTTP(하이퍼 텍스트를 주고받기 위한 약속)

• 웹 상에서 정보를 주고받을 수 있는 프로토콜 (프로토콜=하나의 약속)

• 주로 HTML 문서를 주고받는 데에 쓰인다.

• HTTP는 'Request 요청'과 'Response 응답'으로 구성되어 있고, 클라이언트(ex. 내 컴퓨터/요청을 하는 쪽)가 요청을 하면 서버(ex. 네이버 컴퓨터/요청을 받는 쪽)가 응답을 하는 구조로 되어 있다. → 서버가 죽었다: 외부에서 요청을 받고, 요청에 대한 응답을 해주는 컴퓨터가 죽었다는 의미 한다.

• http://는 이 프로토콜을 사용해서 정보를 교환하겠다는 표시

 

HTTPS(HyperText Transfer Protocol over Secure Socket Layer)

• HTTP의 보안이 강화된 버전

• HTTPS를 사용하려면 신뢰성이 엄격하게 공인된 기업으로부터 증명서를 구입해야 한다. (증명서=서버에 대한 증명서)

• 증명서의 역할: 클라이언트가 접속한 서버가 클라이언트가 의도한 서버가 맞는지, 서버와 통신을 할 때 사용할 암호 키에 대한 정보를 담고 있다.

• 암호화하고 복호화하는데 시간이 걸린다.(몇 밀리세컨드 정보 되기 때문에 사용자 입장에서는 느껴지지 않는 시간)

 

HTTP / HTTPS

HTTP를 통해 간단한 웹 뷰잉/서핑이 아닌, 자료나 민감한 정보를 주고받는 경우라면, 심각한 개인 정보 유출로 이어질 수 있다. 보안 측면뿐만 아니라, 마케팅 측면에서도 검색어 상단에 노출되려면 HTTPS를 사용할 때 상위로 노출이 되기 때문에 HTTPS를 사용하는 것이 좋다.

HTTPS as a ranking signal  |  Google 검색 센터 블로그  |  Google Developers

 

참고하면 좋은 글) HTTP와 HTTPS의 차이? 한 글자로 달라지는 보안 - by ssongzaka

http와 https의 차이? 한 글자로 달라지는 보안

 

참고하면 좋은 글) 보안 고려한 웹기획을 위한 http와 https 차이와 SSL 인증서 이해 - 모그니

보안 고려한 웹기획을 위한 http 와 https 차이와 SSL 인증서 이해

 

 

웹의 3요소: 3. HTML: HyperText Markup Language

 

HTML (HyperText Markup Language)

웹 페이지의 모습을 기술하기 위한 규약, 웹 페이지의 모습을 기술하기 위한 마크업 언어(→ 마크업: 이런 글자를 쳤을 때 이런 모양이 나올 거야와 같은 약속된 언어.) HTML은 프로그래밍 언어가 아니며, HTML은 마크업 단어이다. (→ EX. HTML은 웹사이트의 뼈대를 만드는 작업이다.)

HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 그리고 이미지와 객체를 내장하고 대화형 양식을 생성하는 데 사용될 수 있다. - 위키 백과

 

CSS (Cascading Style Sheets)

마크업 언어가 실제 표시되는 방법을 기술하는 언어 (→ EX. CSS는 집을 예쁘게 인테리어 하는 작업이다.) HTML을 시각적으로 꾸며주는 역할을 하며, HTML 요소들이 각종 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어이다. - TCP School

 

JavaScript

웹 페이지와 상호작용 하도록 만들어진 스크립트 언어 (→ EX. JS는 집이 집으로서의 기능을 다 할 수 있도록 전기를 연결하고 수도를 연결하는 작업이다.) 자바 스크립트는 동적으로 콘텐츠를 바꾸고, 멀티미디어를 다루고, 움직이는 이미지 그리고 꽤나 많은 다른 일(물론, 전부는 아니지만 몇 줄만의 자바스크립트 코드로 얻는 결과는 놀라울 것이다.)들을 할 수 있는 스크립트 언어이다. 자바스크립트는 HTML과 CSS가 결합되고 웹페이지 상에서 올려진 후, 브라우저의 자바스크립트 엔진에 의해 실행된다. 이는 페이지의 구조와 스타일등을 정해놓고, 자바스크립트가 실행된다는 것과 같은 의미이다. - MDN Web Docs

 

HTML - CSS - JS의 차이점을 잘 보여주는 사이트

HTML CSS JavaScript