HTML은 홈페이지를 만드는데에 사용되는 기본적인 언어이다.
서버에 접속하면(요청:Request 을 던지면) 서버는 요청에 대한 파일을 읽어 필요에 따라 처리를 한 후 던져준다(응답:Response 한다). 동적인 웹 사이트를 위해 대부분의 서버에서는 서버 사이드 스크립트 언어를 지원하게 되는데, 대표적으로 PHP JSP ASP Perl등이 있다. 서버 사이드 스크립트 언어는 응답을 보내기 전 기존에 기술해놓은데로 적절한 처리(DB에서 데이터를 읽는 등)를 지원하여 동적인 웹 사이트를 만드는 데 도움을 준다.

요청에 대해 적절한 처리후 응답을 던져주면 웹브라우저는 HTML소스를 읽고 파싱하여 화면에 뿌려주게 된다. 대부분의 브라우저는 어느정도 잘못 작성된 HTML소스도 적당히 표현해주지만 표준웹표기법에 맞게 작성하는 습관이 중요하다.

딱딱하게 시작해서 벌써 하품이 나오는 사람이 있을 관계로 좀 더 부드럽게 가겠습니다.

HTML은 화면을 표현하기 위해 사용되는 언어로서 벌거숭이라 할 수 있겠습니다. 화면의 틀은 HTML로 구성합니다.

스타일시트:CSS(cascading style sheet)는 HTML에 옷을 입혀주는 존재입니다. 기존에 HTML에 디자인과 관련된 속성들을 몽땅 때려넣는 방식은 구시대적인 발상이므로 더이상 설명조차 하지 않겠습니다. 잘못된 방법을 가르쳐봤자 제 손만 아플 따름입니다.

옷을 입혀준다니 그게 대체 무슨소리일까요? 똑똑한 분들이라면 글자의 색을 변화시킨다던지 배경색을 지정한다던지 테두리 선을 준다던지 라는 것을 짐작하실 겁니다. 즉 HTML은 레이아웃을 잡아주고 CSS는 디자인을 입혀줍니다. 이를 통해 레이아웃과 디자인의 분리라는 멋진 말이 태어난 겁니다. 간단한 조작으로 고정된 레이아웃에 다양한 디자인을 보여줄 수도 있습니다.

자바스크립트는 클라이언트 사이드 스크립트 언어입니다. CSS가 HTML에 옷을 입혀주는 것이라면 자바스크립트는 날개를 달아주는 것입니다. 우리가 살아가는데 있어 날지 못한다고 큰 불편함을 격지는 않습니다만 만약 날아다닐 수 있다면 환상적일 것입니다. 서버사이드언어가 동적인 HTML 및 데이터를 만들어준다면 클라이언트 사이드 언어는 우리가 보고 있는 브라우저에서 역동적인 화면을 보여주는 멋진 녀석입니다. 홈페이지에 접속을 하면 골치가 아픈 팝업광고창도 자바스크립트의 산물이죠. 마우스가 올라가면 버튼이 변한다던지 색상이 변하는 것도 자바스크립트로 하고 있습니다(사실 W3G 웹 표준안에 따르면 CSS로 이게 가능해야 합니다. 하지만 브라우저가 지원하지 않는 경우가 많습니다.)

추상적인 HTML과 CSS 그리고 자바스크립트를 간단히 알아보았습니다. 추상화 단계가 높을 수록 사람은 골치가 아픕니다. 붕 떠있는 구름을 잡으려 해도 도통 잡을 수 없죠. 좀 더 구체화 된 CSS와 Javascript로 들어가보도록 하겠습니다.

다음 글에서 봅시다!


이 게시물을...
profile

넷두리 업데이트 준비중...