안녕하세요! 필자입니다.
간단히 정적 웹 문서와 동적 웹 문서가 무슨 차이인지 알려드리고자 합니다.
한자로 풀이하자면
정적은 '정적(靜的)' 이라고 합니다. 아무리 페이지를 열어도 가만히 멈춰있으며 그저 똑같은 내용만 보여주는 웹 문서를 의미합니다.
동적은 '동적(動的)'이라고 합니다. 페이지를 열면 매번 새로운 페이지가 나타나고 내용도 바뀔 수 있는 페이지를 의미합니다.
◆ 정적 웹 문서란
정적 웹 문서는 흔히 영문으로 'static'으로도 불리는데요.
다시 말씀드리자면 아무 작동도 안하는 웹 문서입니다. 언제든지 동일한 값을 표시하는 역할만 수행합니다.
예를들면 필자가
<body>
Ohayou, Sekai!
</body>
라는 값을 웹 문서에 저장시켜서 실행시키면 변함없이 'Ohayou, Sekai!'만 출력합니다.
또한, 정적 웹 문서는 두가지 방식으로 실행됩니다.
모든 작업은 로컬에서나 웹 서버에서 수행된다는 건데요.
로컬에서는 브라우저에서 바로 웹 문서로 접속해서 페이지 내용을 가져옵니다.
즉, 로컬안에서 접속해서 로컬 안에서 끝납니다.
서버에서도 마찬가지인데요. 로컬에서 접속한 방법과 다른점은 http 프로토콜을 사용하여 접속한다는 것 뿐 다를건 없습니다.
로컬과 서버단에서 정적 웹 페이지는 주로 '클라이언트 사이드 언어(웹 브라우저가 해석할 수 있는 언어)' 로 제작되는데요.
HTML, XML, CSS, JavaScript 등이 정적 웹 문서에 포함됩니다.
이미 사이트에 저장되어 있는 HTML 페이지를 보여줄때 보통 정적이라고 표현합니다.
자바스크립트 등으로 사이트를 동적으로 제작하여도, 이는 동적인 페이지 일 뿐이지, 결국 사용자는 똑같은 웹 페이지를 보기 때문에 정적 웹 문서로 칭합니다.
요즘은 html 단일 페이지만으로 사이트를 개발하지 않기 때문에, 정보제공목적이나 기타 목적이 아닌 이상 잘 안쓸거라 생각합니다.
추가로 사이트에 추가 내용이 있는 경우 모든 내용을 소스를 작성하여 웹 개발자가 삽입해야해서 번거롭습니다.
질의사항 - 자바스크립트에서 사용 가능한 Ajax의 경우 동적으로 봐야하는지 정적으로 봐야하는지 애매한 부분입니다.
아시는 분은 댓글 달아주시길 부탁드리겠습니다.
필자의 견해로는 동적 웹 문서의 내용을 그대로 카피하여 웹 페이지를 변조하는 것으로 동적으로 봐야할듯 싶습니다.
솔직히, 자바스크립트의 애니메이트나 css의 애니메이트나 동적인 웹 페이지를 만든다고 사용하는데, 문서나 페이지나 말이 거기서 거기다보니..
◆ 동적 웹 문서란
동적 웹 문서는 영문으로 흔히 'Dynamic'으로 불립니다.
항상 동일한 값을 표시하는게 아닌 매번 웹 페이지를 불러올 때마다, 새로운 내용을 표시하는 웹 페이지입니다.
흔히 네이버의 뉴스나 로그인 페이지 혹은 게시판 등에 사용되는 웹 문서인데요.
이 방식은 '서버 사이드 언어(Server-Side)'로 만들어집니다.
즉, 다시 말하면 동적인 웹 문서는 로컬의 웹 브라우저에서 실행할 수 없습니다.
동적 웹 문서는 특정 소스 코드 해독기를 반드시 필요로 합니다.
동적 웹 문서는 실시간으로 새로운 정보를 추가시킬 수 있고, 웹 개발자가 소스코드를 추가하지 않아도 운영되는 장점을 가지고 있습니다.
또한, 웹 문서 페이지 내용을 그대로 사용자에게 전달하는게 아니라, HTML코드 혹은 브라우저가 읽을 수 있는 형태로 전달합니다.
즉,
정적 웹 페이지는 소스코드가 보이며, 동적 웹 페이지는 소스코드가 보이지 않습니다.
또한 페이지 처리방식도
해당 방식으로 진행되기 때문에 정적 페이지와 차이가 있습니다.
마지막 정적 페이지 전달이란, 동적 페이지 자체를 웹 브라우저에서는 볼 수 없기 때문에 정적 페이지 형태로 출력해 주는 것을 의미합니다.
솔직히 자신의 아이디 비밀번호가 어떤식으로 암호화 되는지 보이면 소름끼치지 않나요?? => 특히 평문 그대로 저장..ㅡㅡ;;
동적 웹 문서에는 브라우저 헤더에 여러 요소를 추가시킬 수 있는 등 여러가지 역할을 합니다.
보통 이 웹 사이트 애플리케이션 해독기가 없으면 정적인 페이지로 봐야합니다.
그럼 여기서 마칠게요!
감사합니다.
아래의 사랑표(하트)버튼을 눌러주시면 블로그에 매우 큰 도움이됩니다. 히히
Copyright © 이동마이의 컴퓨터 하루 & 이서현(myskys2) All Rights Reserved.
'Program' 카테고리의 다른 글
| [CSS] RSS용 CSS파일 배포 (0) | 2017.03.30 |
|---|---|
| [less]1부 - 스타일 시트와 동일한 less에 대하여 알아보자 (0) | 2017.02.16 |
| [JSP]JSP에서 다른 사이트로 리다이렉션을 해보자 (JSP 페이지 리다이렉션) (0) | 2013.09.15 |
| [JSP]JSP로 간단한 계산을 해보자~ (0) | 2013.09.15 |
| [JSP]JSP 기본 문법 파해치기 (0) | 2013.09.11 |
댓글