"> 'HTML/기초' 카테고리의 글 목록
본문 바로가기

HTML/기초

 (19)
[18. 웹 서버(Apache) 설치 - 1] 웹 서버 Apache란? 세계에서 가장 많은 점유율을 갖고 있는 웹 서버 중 하나이며, HTTP 언어 서버이다. Aapche재단에서 만든 HTTP 서버로 다양한 기능을 추가할 수 있고, 구축이 쉽다는 이유로 많이 사용된다. 단점으론 서버가 무거우며 'Sloworis' 취약점이 발견되었다. 장점으론 무료로 제공하는 서버이기 때문에 중소기업들이 많이 사용한다. Apache 설치 아파치 서버를 윈도우에 직접 설치하기엔 까다롭기 때문에 보조 프로그램을 통해서 설치해보겠습니다. 여러 개의 보조 프로그램이 있는데 우리는 'Bitnami WAMP Stack' 프로그램을 설치하겠습니다. 검색 엔진에 'Bitnami WAMP Stack'라고 입력하면, 홈페이지가 뜹니다. On my Computer 항목에 주황색 버튼을 ..
[17. 웹 호스팅(GITHUB)] 웹 호스팅이란? 웹 호스팅이란 무엇일까요? 설명하기 전에, 웹 서버의 역할을 하는 컴퓨터는 항상 가동되어야 합니다. 24시간 가동되지 않는다면, 사용자는 웹 서버가 꺼져있는 시간에 웹 브라우저를 통해서 정보를 얻을 수 없기 때문입니다. 만약 개인이 웹 서버를 운영한다면, 서버 컴퓨터를 24시간 작동해야 하기에 서버를 운영하기에 어려움이 따릅니다. 이러한 문제점을 해결하기 위해 웹 서버를 대행해주는 업체들이 있습니다. 그 업체들을 '웹 호스팅 업체'라고 불립니다. │호스팅이라고 하는 이유는 컴퓨터 한 대를 호스트라고 하며, 컴퓨터를 빌려주는 사업을 호스팅이라고 하기 때문입니다. 수많은 호스팅 업체들이 있는데 우리는, 그중에서 많은 프로그래머들이 사용하는 무료 업체인 GITHUB 서비스를 이용할 것입니다. ..
[16. 웹 사이트 제작] 웹 사이트 제작 웹 사이트가 무엇인지 간단하게 설명하자면, 웹 사이트는 웹 페이지들의 집합체입니다. 웹 페이지(문서)들이 여러 개 모여서 하나의 웹 사이트를 만들고, 그 웹 사이트는 웹 브라우저를 통해서 우리에게 정보를 전달해줍니다. 이번에는 우리가 배운 태그들을 이용해 웹 페이지를 생성하고, 웹 페이지들을 모아서 하나의 웹 사이트를 만들어 웹 브라우저 화면상에 출력이 될 수 있도록 문서 파일들을 만들어 볼 것입니다. HTML 언어만을 사용해서 제작하는 사이트이기 때문에, CSS나 JavaScript언어를 이용한 웹 사이트들 보다는 조잡할 수 있지만, 사이트를 만들 수 있다는 것에 중점을 두고 시작해보겠습니다. https://web-n.github.io/web1_html_internet/ WEB1 - W..
[15. 링크 태그(A)] 링크 태그(A Tag) HTML 언어에서 HyperText 단어의 의미를 갖는 태그. 문서에서 문장에 링크를 걸어 다른 웹 사이트로 이동할 수 있게 해주는 태그이다. 링크를 적용할 문장 a 태그의 속성 href 링크의 주소 값을 가지고 참조한다. (필수로 같이 사용해야 하는 속성!) target 링크의 출력형태를 변경한다. (속성 값으로 _blank, top, _self, _parent 등이 존재) title 링크 툴팁 기능 제공 링크 태그 사용 에디터에서 'HTML elements~' 문장에 a태그를 사용해서 네이버의 주소를 링크 걸어줍니다. ※ 필독 a태그는 기본 태그만으로는 링크를 거는 역할만 할 뿐, 링크의 주소 값을 알지 못하기 때문에 href 속성을 사용해서 링크의 주소를 참조해야 합니다. 웹..
[14. 메타 태그(Meta)] 메타 태그(Meta Tag) meta태그는 웹 문서에 대한 메타데이터를 웹 브라우저나 검색엔진에게 전달하는 태그입니다. 웹 문서의 메타데이터에는 문자 인코딩, 검색 키워드, 저자, 페이지 초기 설정 등이 있습니다. 모든 메타데이터는 하나의 meta 태그 안에 속성들로 이루어져 있습니다. meta태그에 어떤 속성들이 있는지 알아보겠습니다. 속성 & 속성 값 설명 charset 문서의 인코딩 방식 name, content 문서의 메타데이터를 설정(같이 사용됩니다.) http-equiv, content 전처리 구문 지시자(content 속성과 같이사용) 페이지를 새로고침 하는 리로드 시간을 줄 때 주로 사용된다. 주로 사용되는 속성들을 정리해봤습니다. 한 가지 주의할 점은 meta 태그를 사용할 시, cont..
[13. 웹 페이지 제목 태그(TITLE)] 웹 페이지 제목 태그(TITLE Tag) 웹 페이지(문서)에 대한 제목을 변경할 때 사용하는 title 태그에 대해 알아보겠습니다. title 태그는, 검색엔진이 웹 페이지를 분석할 때 가장 중요하게 생각하는 태그입니다. 제목이 명확하게 설정되어 있어야 사용자가 검색엔진을 통해 원하는 정보를 쉽게 접근할 수 있기 때문이죠. 제목 이름 title 태그는 태그 안에 속하는 태그입니다. 왜냐? 웹 브라우저에게 전달하는 '문서의 제목'이기 때문입니다. 웹 브라우저에게 전달되는 내용들은 모두 태그 안에 들어갑니다. TITLE 태그 사용법 에디터에서 현재 작성 중인 문서(웹 페이지)에 대한 제목을, HTML Study라고 지정합니다. 실제로 웹 브라우저를 통해 페이지의 제목을 확인해보니 변경된 것을 확인할 수 있습..
[12. HTML 언어 구조] HTML 언어 구조 HTML 언어의 기본 틀은 위와 같은 형식으로 이루어져 있습니다. 웹 브라우저에게 정보를 전달하는 태그이다. 브라우저 화면상에는 보이지 않지만, 웹 브라우저에게 전달할 내용들은 모두 태그 사이에 사용되는 주요 태그들을 몇 가지 알아보자면, title, meta 태그들이 있다. title 태그는 문서의 제목, meta 태그는 문서의 키워드 및 요약정보와 인코딩을 담당한다. 실제 웹 브라우저 화면상에 출력되는 태그이다. 웹 브라우저 화면에 출력할 내용을 갖는 태그들이 태그 안에 속해있다. , , 태그 등등
[11. 목록 태그(li,ul,ol)] 목록 태그(LI Tag) li 태그는 목록을 나타낼 때 사용하는 태그이며, 부모 태그로 같이 사용하는 ui, ol 태그가 존재합니다. ※ 사용 방법 목록 이름 태그 사용 시, 목록 이름 앞에 ● 특수문자가 붙어서 정렬됩니다. 부모 목록 태그(UL Tag) li 태그의 부모 태그로, li 태그 간의 구분을 지을 때 사용합니다. 다른 부모 태그인 ol 태그와 다른 점은, 목록 앞에 순번이 없습니다. ※ 사용 방법 목록 이름 부모 목록 태그(OL Tag) li 태그의 부모 태그로, li 태그 간의 구분을 지을 때 사용합니다. ul 태그와 다른 점은, 목록에 번호를 붙여 정렬하므로 관리하기 용이합니다. 순번이 지정된 목록을 삭제 시, 다른 문장들의 번호를 재정리해서 표현합니다. ※ 사용 방법 목록 이름 태그 사..

티스토리툴바