▶본래 블로그는 Web 과 Log 의 줄임말로, 자신의 관심사를 자유롭게 서술하는 1인 미디어로 시작했습니다. 전문지식 없이 누구나 쉽게 시작할 수 있고, 평범하지만 필요한 정보들을 손쉽고 압축적으로 공유할수 있죠. 제 블로그는 이러한 본래 블로그의 목적에 맞게 양질의 정보를 공유하는데 목적이 있습니다 :)
# 글, 사진 및 이미지 위용준#
#일부 이미지는 퍼왔음을 밝힙니다.#◀
이전 포스팅에 이어 HTML을 통한 화면 구성에 대해 본격적으로 알아보도록 하자.이를 세부적인 카테고리로 나누면 다음과 같다. 세세하게 공부하기 전에 전체적인 개요에 대해서 알아두는게 효율적 이다.
각 주제별 간단한 요약
Elements HTMl 요소에 대한 이해
Attributes 요소에 대한 속성에 대하여
Headings 제목에 관한 태그
Paragraphs 각 단락에 대한 태그
Styles Html 태그의 스타일 속성에 대한 공부. 글꼴, 크기, 텍스트 색상, 텍스트 정렬등이 여기에 속한다.
Formatting Styles 와 더불어 텍스트 속성에 관한 태그로 기울임, 진하게, 윗 첨자, 큰 글씨, 작은 글씨 등이 여기에 속한다.
Quotations "인용"에 관한 태그로 글의 인용 출처와 들여쓰기 따옴표등에 관련된 태그가 여기에 속한다.
Comments 사용자의 웹상에서는 표시되지 않지만 작성자에게 도움이 되는 주석을 다는 태그 입니다.
Colors 색상에 관련된 태그. 텍스트 색깔과 같은 속성 태그를 말하는게 아니라 '색'자체를 표현하는 태그들을 말한다.
Links 말 그대로 링크에 관련된 태그들 이다. 이미지 링크, 텍스트 하이퍼 링크, 페이지 내 이동 태그등이 존재한다.
CSS HTML요소가 화면등 각 매체에 표시되는 방법을 설명하는 태그들. 따로 공부할정도로 분량이 크다.
Images 이미지에 관련된 태그. 간단한 이미지 속성 태그부터, 이미지 링크, 이미지를 분활 하여 영역 별로 사용 가능한 맵 태그등이 있다.
Tables 테두리, 셀, 캡션, 테이블 속성등 표에 관련된 태그
Lists 리스트에 관한 태그, 순서의 유무에 따른 분류와 속성에 부여된 리스트에 관한 예제 태그들을 다룬다.
Blocks 블록 태그는 주로 '지정된 범위'의 속성을 결정하는 태그들을 사용한다.
Classes '이름'을 부여하는 태그들이라고 생각하면 이해하기 편하다. 예로 무지개라는 이름의 태그는 빨간색이다. 이 태그는 무지개 태그 속성을 따른다 식으로 사용.
Iframes 웹페이지내에서 또 다른 웹페이지를 표현하는 태그를 다룬다.
Javascript Script 태그의 핵심. 이미지를 조작 하거나 동적인 컨텐츠를 이용하는등 사용자와 웹페이지에 상호작용과 관련된 태그. 따로 공부할정도로 분량이 크다.
File Paths 파일의 경로를 지정하는 기본적인 규칙에 관련된 내용이다.
Head 헤드 태그는 <HTML> 태그와 <body>태그 사이에 있는 태그로 전체 페이지 정보에 대한 정보라 할 수 있다. 자세한건 내용에서 다루자.
Layout 신문, 잡지 글, 논문등 한 페이지에 여러 내용이 표시 될 때, 각 페이지의 다른 부분을 구분하여 정의하는 태그들 이다.
Responsive 뷰 포트 즉 웹페이지를 사용하는 사용자의 플랫폼에 따라 최적화 시켜주는 태그를 말한다. 작은 화면에서 보면 전체적으로 축소 시켜주고 반대또한 최적화 시켜주는 역할을 한다.
Computercode 주로 컴퓨터 입출력에 관한 내용을 '표현'하기 위한 태그 이다. 컴퓨터 코드나 키보드의 입력등이 여기에 해당 된다.
Entities 대표적으로 < 는 태그를 이용할때 사용되지만 3>X 라 하면 X는 3보다 작다 라는 표현에 쓰이기도 한다. 이 때 >를 쓰지 말고 & # 60; 식으로 쓰자 와 같은 것.
Symbols 키보드에 존재하지 않는 수많은 기호를 표기 하기 위한 태그.
Charest 어떤 문자 인코딩을 따를것인가 에 대한 태그
URL Encode 앞에서 www등에 관한 URL 체계에 대해서 언급 했었다. 서버에 입력해 사용되는 URL 문자 인코딩을 ASCII 배열에 맞도록 인코딩을 시켜줘서 서버에 보내는것을 말한다.
XHTML Html5가 나왔기 때문에 자세히 알 필요는 없지만 왜 나왔는지는 알고 넘어가자. 한마디로 기존의 Html 보다 더 엄격한 형태를 가진 Html이라 보면 된다. 이전의 Html 작성이 굉장히 느슨한 문법으로 작성되는 경우가 많았는데 이것이 문제를 일으키자 Html 4 이후 나온 체계.
뭔가 잔뜩 나열해서 머리가 어지러운가? 하지만 이런 태그에 대한 소 카테고리를 공을 들여 먼저 외우는것이야 말로 가장 빠르게 공부하는 법이다. 자세하게 살펴보면 전혀 말도 안되게 어려운것이 아닌 그냥 화면상 어떤것을 표현하는 태그구나 라고 쉽게 외울수 있다.
각 예제에 대한 빠른 암기는 힘들다. 하지만 주제별 의미를 외우고 예제를 통해 숙달하면 금방 배울 수 있다. 오늘은 각 태그가 뭘 의미하는지 익숙해지고 또 가능하다면 최대한 암기하도록 노력 해보자.
다음 포스팅에는 이 순서에 따라 하나씩 언급해보도록 하겠다.
'여러가지 정보 > HTML CSS 와 블로그' 카테고리의 다른 글
| HTML CSS 기초부터 배우기 6 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.04.18 |
|---|---|
| HTML CSS 기초부터 배우기 5 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.04.17 |
| HTML CSS 기초부터 배우기 3 (홈페이지 제작, 블로그 꾸미기 ) (0) | 2017.03.28 |
| HTML CSS 기초부터 배우기 2 (홈페이지 제작, 블로그 꾸미기 ) (1) | 2017.03.23 |
| HTML CSS 기초부터 배우기 1 ( 홈페이지 제작, 블로그 꾸미기 ) (4) | 2017.03.22 |
