0004_웹브라우저를 열어보자.
웹브라우저는 우리가 흔히 마주치는 인터넷 익스플로어, 크롬, 사파리 등이다. 이러한 웹브라우저가 어떤 것인지에 대해서 전에는 전혀 관심이 없었다. 주소와 검색, 그리고 앞으로 가기와 뒤로가기 정도를 사용하고 마지막으로 즐겨찾기 정도 쓰는 수준이다. 그런데 이제 HTML을 공부하려고 하니 이 웹브라우저라는 것에 대해서 흥미가 생긴다. 그래서 이번에는 웹브라우저라는 것에 대해서 몇가지 호기심을 채워보려고 한다.
웹브라우저는 무척 간단한 쓰임새를 가지고 있지만 다양한 자료가 웹브라우저에 올라온다. 우리는 웹브라우저를 통해서 예쁘게 꾸며진 웹페이지의 글, 동영상, 음악, 사진 등등을 보고 듣고 즐긴다. 갑자기 브라우저의 다재다능함이 어느 정도 수준인지 호기심이 생겨서 이것저것 실험을 해보고 싶어졌다.
여러 HTML 관련 교재를 읽어보니 브라우저에 무엇인가를 쓰는 방법은 매우 간단했다.
우선 메모장(Notepad)을 열고 거기에 쓰고 싶은 내용을 쓴다. 그리고 저장할 때 확장자를 .txt가 아닌 .html로 저장한다.
그래서 아래의 그림처럼 만들어서 저장해보았다.
그랬더니 이 파일의 아이콘이 웹페이지 아이콘으로 나타났다. 그리고 그 파일을 크롬하고 인터넷 익스플로어의 두 종류의 웹브라우저로 열어보았다.
크롬과 인터넷 익스플로어의 웹브라우저에 Hello World! 라고 쓰여진 문장이 보인다.
평소 URL을 보여주던 주소입력 부분에는 파일 경로가 나타난다. (URL과 파일의 경로가 어느 정도 유사한 개념인가 보다?)
탭 부분은 크롬에서는 파일명을 보여주고 있지만, 인터넷 익스플로어에는 파일경로가 들어간 것이 조금 다르다.
메모장으로 확장자를 .html로 만들어서 저장하면 해당 파일이 브라우저에서 열린다는 사실을 알게 되었다.
그런데 또 궁금하다. .html로 뒤이어 붙여야만 되는 것일까?
그냥 메모장에 .txt로 쓴 것도 웹브라우저가 읽을까?
이번에는 메모장(Notepad)에 Text 방식으로 다음과 같이 적어 보았다.
저장하면서 start002.txt 라고 저장하니 더블 클릭을 하면 메모장만 열리지 웹브라우저가 열리지 않는다.
그래서 웹브라우저를 열고 거기에 start002.txt 파일을 드래그해서 집어넣으니 훌륭하게 다음과 같이 읽힌다.
(여기서 확장자라는 것은 컴퓨터에게 이 파일을 열 때 어떤 프로그램을 쓰는지 가르쳐주는 것일뿐 해당 파일의 내용을 좌지우지 하는 것은 아니라는 점을 처음으로 알게 되었다.)
이번에는 메모장에서 굵게, 기울임꼴 등.... 여러 가지 서식을 적용해보고 이를 웹브라우저로 읽어보았지만 웹브라우저에는 해당 서식은 전혀 적용되지 않고 그냥 위의 그림처럼 평면적인 텍스트만 보여주었다.
그 외에도 평소 자주 사용하는 다양한 파일을 드래그해서 웹브라우저에 넣어 보았다.
한글2010 파일과 MS의 파워포인트, 워드 파일은 전혀 열리지 않았다.
사진은 바로 화면에 표시되고 음악은 바로 플레이되지만 동영상은 열리지 않았다.
요약하면 이렇다.
웹브라우저에서는
- 메모장의 텍스트는 바로 읽지만 서식은 반영되지 않는다.
- 사진과 음악은 바로 열리고 실행된다.
- 동영상, Office, 한글 파일 등은 열리지 않는다.
이와 같은 몇가지 실행을 통해 추정해 볼 수 있는 점이 이것이다. 사진과 음악, 그리고 서식이 적용되지 않은 텍스트는 웹브라우저에서 바로바로 해당 파일을 읽어서 표시할 수 있는 형식이다. 하지만 특별한 글의 서식이나 화면 분할, 동영상 같은 것은 웹브라우저에서 쓰는 방식과 다른 워드프로세스 프로그램, 동영상 프로그램에서 쓰는 방식과는 차이가 있는 것 같다. 그렇다는 이야기는 웹브라우저에서 서식을 지정하고 동영상을 플레이함에 있어서 몇가지 제약이 있을 것으로 추정된다.
이번 앙키로그(Ankilog)는 실습이자 실험이므로 간단하게 해당 실습을 환기할 수 있는 수준의 간단한 Anki 파일로 만들었으니 이점 참고하시고 아래의 파일을 다운받기 바랍니다.
Anki 학습 파일 : 0004_웹브라우저를 열어보자..apkg
'Anki로 공부하기 > HTML공부' 카테고리의 다른 글
0006_태그의 구성방식 살펴보기 (0) | 2017.12.26 |
---|---|
0005_웹페이지의 구조와 태그 (0) | 2017.12.22 |
0003_HTML에 대한 간단한 소개 (0) | 2017.12.17 |
0002_웹의 구조와 HTML의 역할 (0) | 2017.12.16 |
0001_HTML_공부_시작의_글 (0) | 2017.12.14 |