프로그래밍 이야기 -네 번째 이야기(HTML)

HTML ?

웹 프로그래밍에는 HTML 을 기초로 설계가 가능합니다. 모든 문서들은 이 HTML 을 포함하고 있고, HTML 만으로도 멋진 웹페이지 구성이 가능합니다. 한 페이지를 만들 능력이 있으면 200~300개의 웹페이지도 구현이 가능하다는 뜻이죠. (물론 관리의 측면에서 개인이 하기엔 어렵겠지만 )

HTML 의 기본 구조는 head와 body로 구성이 됩니다. 하이퍼 링크와, 문자구조, 이미지 설정 등으로 이루어지며, 웹페이지 상에 표현하기 위한 언어입니다. 미국인에게 무언가 정보를 전달해주려면 영어로 전달해주어야겠죠? 말 그대로 컴퓨터에게 접속하는 사람에게 웹으로 이러이렇게 표현해달라고 말하는 것이 HTML ( Hyper Text Markup Language ) 가 되겠습니다.

위와 같이 HTML 은 구조를 가지고 있습니다. CSS는 무엇일까요 ? CSS는 Cascading Style Sheet로 쉽게 얘기해서 디자인 속성을 한데 모아 놓은 것이라고 생각하시면 됩니다. tag속성은 id, class 이름을 가지며 (div도 동일) 이 태그 id나 class값을 CSS에서 뭐 배경색은 무엇이고 글자색은 무엇이고 등등의 디자인 속성을 적어주면 그대로 스타일이 반영되는 것입니다. 태그마다 다 디자인 속성을 태그 안에 설정해 놓은다면 나중에 웹페이지가 많아졌을 때 과연 쉽게쉽게 스타일의 변신이나 오류수정이 가능할까요 ? 디버깅은 참으로 어렵습니다. 그만큼 효율적으로 해주는 것이 이 CSS입니다.

웹사이트도 폴더의 하나

웹사이트라고 해서 거창한 것이 아닙니다. 여러분이 C드라이브에 폴더를 만들고 파일을 넣는 것 처럼 웹사이트 또한 웹에 접속하는 사람이 서비스를 제공하고 있는 제컴퓨터(제 홈페이지가 서비스 중이라는 가정) 에 제가 정해놓은 website 폴더에 접속해서 main.aspx라는 페이지를 보게 되는 것이죠. 이 폴더에 그 웹페이지에서 표현하고 싶은 이미지와 각종 동영상, html 파일, css파일이 들어가게 되는 것이죠. 이해가 가시나요~!?

웹프로그래밍의 툴

주로 사용하는 것이 visual studio라는 툴을 사용하실 겁니다. 이 visual studio에 대해 알아보면,
웹을 동적으로(화려하게) 구성이 가능하고 silverlight(XAML) Ajax, 등의 많은 언어를 지원하며, CLR을 기반으로 만들어집니다. 윈도우 프로그램이나 웹프로그래밍이 가능하며, 디자인부분과 코딩부분이 나누어져 있어서 조금은 쉽게 코드를 모두 모르더라도 만들수 있는 프로그램이라 할 수 있겠습니다 ( 동작 부분은 자바스크립트로 직접 구현을 하셔야겠죠?^^ )
디자인 부분을 조금 더 쉽게 하기 위해서 Expression Blend, Web, Design 등도 같이 MS에서 출시한 툴이 되겠습니다. javascript와 ASP.NET 스크립트를 통해서 디자인부분에서 제가 expression blend로 직접 제작한 버튼을 누를 때 어떤 명령이 실행될 건지 명령을 만들어 주게 됩니다.

다섯째 시간에서 뵐께요.