RCGF

요즘 제작되는 거의 모든 웹표준 양식을 지키는 웹페이지들은 ul ol li 태그를 이용하여 목록 정리를 하여 이미지나 텍스트를 집어 넣고 하여서 기존에 카테고리 역할만 하던 부분에서 크게 확장되었다고 볼수 있습니다. 그래서 위의 태그들의 구조를 잘 알아두어야 웹페이지들의 구조를 확인하고, 자신의 블로그나 웹사이트를 간단히 조작하는데도 큰 도움이 된답니다. 태그 코드를 집어넣은 모습을 구현했을때의 모습은 어디서 많이 봤을듯 싶습니다. 홈페이지 접속에 에러가 나거나 접속하는 시간이 오래 지연되서 오류가 났을때 정상적인 홈페이지 모습이 아니라 우측과 같은 이미지를 많이 확인 해보셨을거라 생각되는데요. css 의 스타일 적용이나 이미지들이 넘어오지 않기 때문에 제일 빠른 html 태그정보와 텍스트만 넘어와서 위..

Html 에서 time 태그는 일반 텍스트에다가 날짜와 시간정보라는것을 알려주는 태그 역할을 합니다. 웹표준을 지향하고 있는 HTML5 를 지원하는 브라우저들은 이 time 태그를 통해서 텍스트가 날짜나 혹은 시간이라는 것을 알게 됩니다. 예를 들어 " 2017.04.25 이후 요금임 " 이렇게 적어 넣게 되면 실제로 보이는것은 " 2017.04.25 이후 요금임" 이라고 표시될 뿐이지만 웹브라우져 에서는 2017.04.25 를 날짜 정보로 인식하게 되고 사용되집니다. 날짜 말고도 날짜와 시간 모두 인식하게 할것인지 아니면 시간과 날짜를 따로 따로 인식하게 하기위해서는 datetime 속성을 사용하여 만듭니다. 사용방법은 이런 구조로 사용되어집니다. yyyy = 연도 / MM = 월 / DD = 일 / ..

기존의 HTML4 방식 으로 작성된 웹페이지들은 전부다 상중하 구조로 이루어져서 만들어져 있습니다. 그리고 이런 구역들은 태그를 통해 구역을 나누어놓고 id 속성으로 조정하고 했습니다. 그런데 HTML5 에 와서는 대부분의 웹페이지 구조가 상단에 웹페이지 제목 중간에 내용 하단에 웹페이지 정보나 회사 정보등이 들어 있는 공통된 구조로 되어 있다고 판단하고 이것을 규칙화 하게 되었습니다. 상하좌우 본문 영역에 각각의 태그를 만들어 버린것이지요. 그동안 태그로도 이런 구역 설정이 가능했고, 출력되는 이미지 또한 다르지가 않습니다. 그런데 왜 이런 태그를 만들어 냈을까요? 그이유에는 웹표준방식에 의한 제작방식에 있습니다. 모든 소스들은 알기쉽게 제작해야 한다는 의미의 웹표준방식으로 만들어진 시맨틱 태그들은 그..

이번 시간에는 html 에 사용되는 태그중에 가장 많이 사용되는 태그들을 한번 나열해볼 생각입니다. 이 태그들 몇가지만 알아둬 자신의 블로그나 사이트를 뒤져볼때 이부분이 이런 구조로 되어 있구나라는 감을 얻을수 있을거라 생각됩니다. 1. 태그 이 태그는 주로 제목을 표시할때 주로 글자를 진하고 크기를 키워주는 태그입니다. HTML body 영역에서 바로 사용되지는 않지만 가끔 강조하는 문구에 사용되어지곤 합니다. css 에서 주로 글자 크기를 줄이고 늘리는데 쓰이지요. h 뒤에 숫자를 1~6까지 붙이는것에 따라 위에처럼 글자의 크기가 결정되어집니다. 2. 태그 p 태그는 굉장히 간단하면서도 중요한 태그라고 할수 있습니다. 이태그는 반응형 웹페이지 안에서 어떠한 사이즈의 기기안에서도 흐트러짐이 없이 보이게..

웹페이지의 코드의 모습은 보통 로 언어를 선언한뒤 태그 안에 내용들이 들어 있기 마련입니다. 대부분의 경우 html 안에는 title 태그 와 body 태그로 나뉘어 집니다. ▦ title 태그 title 태그는 그 웹페이지의 이름을 지정하게 됩니다. 과거에는 title 이름을 적어 넣으면 웹브라우저 상단에 title 이름이 나오곤 했습니다만 요즘에는 웹페이지 title 관심을 가지는 사람들이 없기 때문에 그냥 웹페이지의 설명정도로만 치부되고 있습니다. ▦ meta 태그 head 태그 안에 포함되어 있는 메타 태그는 문자 인코딩과 문서 키워드 요약정보등에 사용됩니다. 그래서 보통 로 아주 간단한 코드로 한글을 보여지게끔 만듭니다. 과거 html4 시절에는 인코딩방식이 너무 안좋아서 어디서는 글씨가 깨지곤..

기본적으로 직접 html 이나 css 같은 코드를 건드는 행위를 하드코딩이라고 말을 합니다. 전문적인 프로그래머가 아닌이상에야 간단한 코드수정은 메모장으로 작업한뒤에 저장해도 되지만 노트패드 같은 프로그램을 사용하면 어시스턴트를 도움받고 코드들의 구분이 편해지기 때문에 하드코딩하는데 도움이 되는 편입니다. 그래서 이번시간에는 간략하게 노트패드를 설치하고 기본 웹페이지를 셋팅하는 방법을 살펴보도록 하겠습니다. 노트패드 ++ 는 네이버에서 프리웨어 프로그램으로 간단히 다운받을수 있기 때문에 다운받은뒤 설치를 하면 됩니다. 그런데 막상 설치하고보니 최신버전이 있기때문에 버전 업그레이드 할거냐고 묻는군요. 그래서 저는 버전업을 했습니다. 버전업을 했냐 안했냐에 따라서 보이는 모습은 다를수도 있습니다. 노트패드를..

웹프로그래밍 언어로 HTML 과 CSS 가장 접근하기 쉬운 프로그램언어라고 할수 있습니다. 그래서 전문적으로 프로그래밍 업을 하는 분들에게는 참 귀엽게만 느껴질수도 있을텐데요. 저 같이 평범한 사람들에게는 장벽에 굉장히 높게만 느껴질수밖에 없을텐데요. 요즘에는 티스토리 블로그 네이버 블로그 좀더 들어가면 인터넷 태그 유튜브 워드프로세서 등 웹페이지들의 구조를 파악하고 자신이 원하는대로 조작하기위해서는 어느정도 구조를 읽을 줄알아야 하는데요. 그렇기 때문이라도 HTML 이나 CSS 를 알아두는것이 큰 도움이 된다고 할수 있습니다. 그래서 저는 이 블로그 안에 HTML 과 CSS 의 정보를 공부하면서 정리하면서 크게 웹프로그래밍과 관련된 정보들과 웹디자인을 사용하는 CG 프로그램 및 동영상 편집 프로그램들의..