안녕하세요.
교수님께서 시중에 나온 html책중에 가장 잘 만들어진 책이라고 극찬하신 책으로 공부하다 궁금점이 있어 질문합니다.
1. editplus를 이용해서 html파일을 만들어 utf-8 인코딩으로 저장했습니다. internet explore로 열고 보기에서 인코딩-유니코드(UTF-8)로 설정해야 한글이 안깨지고 나오는데
이렇게 하는것이 올바른 방법인가요?
그리고 앵커만들때 id 태그를 사용한다고 배웠는데
2. 앵커 만드는 이유가 링크를 이용해서 이동을 쉽게 하려고 하는게 전부인가요?
3. 예제 3-2에 보면 하이퍼링크도 없이 앵커(figure id="1-1">)가 나온거 같은데 무슨 기능인가요?
4. 예제 3-2 아래 설명 'alert() 함수에 대한 ... 를 하나의 그림으로 블록화하기 위해 <figure>를 사용한 예를 보여준다. 에서 블록화가 뭔가요?
1. HTML파일을 UTF-8로 인코딩하여 저장하면 텍스트가 모두 UTF-8의 코드 체계로 저장됩니다. 하지만, 익스플로러가 HTML 페이지가 utf-8의 코드 체계로 저장되었는지 확인하지 않고 현재 브라우저의 설정그대로 디코딩하여 출력합니다(설정이 utf-8로 되어있지 않으면 한글이 깨져 보이지요). 그러므로 '보기' 메뉴에서 인코딩은 utf-8로 잡아주는 것은 맞습니다. 이런 문제를 피하려면 HTML 파일의 <head> 태그 안에 <meta charset="utf-8"> 태그를 넣어주면, 이를 참고하여 익스플로러뿐 아니라 모든 브라우저가 utf-8로 자동 디코딩합니다. 설정이 어떻게 되어 있든 utf-8로 디코딩하지요. <meta> 태그에 대한 설명은 책 p.75에 있으니 참고하십시오. 그리고 크롬 같은 경우는 <mata> 태그 없이도 자동으로 인지하여 utf-8로 디코딩합니다. 또한 HTML페이지가 웹 서버에 있는 경우(로컬 컴퓨터가 아니고), 웹 브라우저가 서버로부터 웹 페이지를 로드할 때, 웹 서버는 HTML5 문서이므로 디폴트로 utf-8 인코딩되어 있음을 알려주기 때문에, 익스플로러를 포함하여 거의 모든 브라우저들은 utf-8로 저장된 HTML 파일에서 utf-8f로 디코딩하여 한글을 잘 출력합니다.
2. 앵커를 만드는 이유는 링크를 이용하여 이동을 쉽게 하려는 목적 맞습니다.
3. 태그의 id 속성은 용도가 다양합니다. 앵커를 만들기 위한 것 이전에, 태그를 구분하기 위한 목적이죠. 그래서 HTML 페이지에 동일한 id 값을 가진 태그가 여럿 있어서는 안됩니다.
id는 앵커를 만들기 위해서도 사용되고, 자바스크립트 코드로 특정 id 값을 가진 태그를 찾기 위해서도 사용되고, CSS3 역시 특정 id 값을 가진 태그에 스타일을 꾸미는 셀렉터로도 사용됩니다.
예제 3-2에서 앵커로 사용하지 않는데 id를 사용한 것은 CSS3나 자바스크립트에 이 태그를 유일하게 구분하여 꾸미거나 자바스크립트 코드를 적용하기 위해 습관적으로 사용하는 것입니다. 만일 id값이 같은 태그가 여럿 있다면 웹 페이지에 먼저 나오는 것이 우선 찾아지게 됩니다. 자바스크립트나 CSS3에서도 마찬가지입니다. CSS3의 id 셀렉터를 설명하는 p.169와 8장의 getElementById()메소드를 설명하는 p.354 상단에서 id 속성을 사용하는 설명이 있습니다.
4. 그림이라고 하면 하나의 이미지라고 생각하게 됩니다. 하지만, 책이나 문서에서 말하는 그림은 단순히 이미지 하나만을 나타내지 않습니다. 예를 들어 컴퓨터 책에서 그림 1-1 인터넷이라는 그림이 있다면 이 그림에는 인터넷 이미지와 약간의 설명 그리고 손으로 그린 화살표 등 여러 요소들을 모아 일컫는 용어 입니다. <figure> ..</figure> 태그를 사용하여 어디부터 어디까지가 그림을 구성하는 요소(태그)들인지 나타내며, 이를 블록화라고 하지요. 다시 말하면 <figure>태그는 그림 블록을 구성하는 시작태그이고 </figure>는 그림 블록을 구성하는 종료태그입니다. 아마도 블록이란 단어가 생소해서 이해하기 힘들었던 것 같습니다. 좀더 쉬운 단어가 있으면 좋겠네요.
설명이 적절한지 모르겠네요, 글 쓰기는 항상 어렵네요.