개발하는 기획자

IT & 프로그램 개발/홈페이지 만들기 → (18)건

[HTML] h1, h2, h3, h4, h5, h6 태그 사용 - 제목 정의

h 태그(Tag) 사용 " 태그는 제목을 정의하는데 사용하는 태그" 통칭해서 태그라고 표현했지만, 1~6까지 중요도 순으로 구분이 가능한 태그입니다. 일반적으로 html에서 제목을 정의하는데 사용된다고 표시가 되어 있고, 부터 중요도 순서대로 까지 6개의 태그가 비슷한 동작을 합니다. 한마디로 가장 중요한 제목을 정의할 때는 태그를 사용하고 중요도가 제일 낮은 제목을 정의할 때는 을 사용하는 형태입니다. 아마 지금 티스토리 글쓰기를 사용하시는 분들은 '기본모드'로 글쓰기를 사용하시는 사람들이 많을 것입니다. 여기서 화살표를 눌러 html 버전으로 돌려본다면 조금 더 쉽게 이해가 가능하지 않을까 합니다. 제일 첫줄의 'h 태그(Tag) 사용'은 제가 글쓰기 에디터를 사용하면서 '제목 1'으로 입력한 부분입..
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 28. 14:47

[HTML] script 태그 사용 - html과 Java script의 만남

script 태그(Tag) 사용 " 여기서 'document.write('contents');' 는 Java script에서 글자를 출력해주는 함수입니다. 사실 html에서 글자를 출력해주는 다른 함수도 있지만 Java script는 동적으로 웹페이지에서 동작을 하고 있어 일부 괄호 안의 내용에 따라 출력해주는 결과값이 달라질 수 있습니다.
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 27. 21:06

[HTML] a 태그(Tag) 사용해보기 - href, title, target 속성 사용해보자

본 카테고리는 이전 포스팅에서 소개한 웹페이지에서 가장 많이 사용되는 HTML 요소들에 대해서 하나씩 소개할 수 있도록 하겠습니다. 상위 5개의 요소 html, head, body, title, meta는 기본적인 요소와 눈에 직접 보이지 않는 부분이 포함이 되어 있어 추후에 사용하면서 따로 설명을 드릴 수 있도록 하겠습니다. 그리고 요소라 불리는 것으로 알고 있는데, 대부분의 검색이 태그로 표현을 하고 있는거 같아 검색에 편한 태그란 용어를 우선 사용하겠습니다. a 태그(Tag) 사용 " 태그는 웹페이지에서 링크를 통해 다른 페이지로 이동하거나 해당 문서 내에서 이동할 수 있는 태그" 기본적으로 태그에는 다음과 같은 속성을 포함하고 있습니다. href(Hypertext Reference) : 하이퍼텍스..
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 26. 20:51

HTML 요소(Element)와 태그(Tag) - 어떻게 공부를 시작해야 될까?

HTML은 어떻게 공부해야 될까? 지난 포스팅에서 설명한 것과 같이 HTML 언어는 요소(Element)로 구성이 되어 있습니다. 이 요소(Element)에서는 시작 태그(Opening Tag)와 종료 태그(Closing Tag) 마지막으로 속성(Attribute)를 포함해서 요소의 시작과 끝을 확인하고 포함되어 있는 컨텐츠의 특성을 부여할 수 있는 구조입니다. 설명은 되게 간단해보이지만, 사실 하나의 웹사이트에 이런 요소들은 엄청나게 많이 포함되어 있습니다. 간단한 예시로 다음의 메인화면의 웹사이트 코드를 확인해볼 수 있는데요. 먼저 인터넷 브라우저를 통해 다음의 메인화면으로 이동한 뒤에 키보드의 [F12] 버튼을 눌러보시면 아래 조그마한 창이 나타납니다. 이 창에서 다음 메인화면의 HTML 코드를 확..
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 24. 21:15

HTML이란? - HTML 기본 구조 알아보기

지난 시간에 마음대로 만들어봤었던 웹사이트를 이해하려면 HTML 언어를 이해하셔야 됩니다. 이번 포스팅에서는 기본적인 HTML에 대한 정보를 공유하겠습니다. HTML이란? Hyper Text Mark-up Language의 약자인 HTML은 언어의 한 종류입니다. 기본적으로 웹사이트를 개발하는데 사용되는 언어로 웹사이트에 포함되어 있는 영상, 이미지, 음향 또는 문자에 대한 정보를 연결하는 특성을 가지고 연결된 하이퍼테스트를 만들 수 있도록 지원되고 있습니다. HTML은 프로그래밍 언어라고 불리기보다는, 마크업 언어로 표현됩니다. 함수나 동작과 같은 기능을 구현하는 프로그래밍 언어의 특징보다는 웹사이트가 어떻게 구성되어 있는지에 대한 구조나 형태에 대한 표현을 하기 위해 사용됩니다. "HTML 기본 요소..
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 24. 09:27

서브라임텍스트 맛보기 - 시작이 반, 웹페이지 만들기

서브라임텍스트로 웹페이지 만들기 "시작이 반이다!" 그래서 오늘은 딱 반만해볼까 합니다. 일단 웹페이지를 만드는 것이 전문 지식이 필요하고 엄청나게 복잡한 과정을 거쳐서 만들어질까요? 아니죠. 세상은 그렇게 어려운 것 투성이 아닙니다. 웹페이지 자체는 굉장히 쉽게 만들 수 있습니다. 어려운 것은 예쁘고 화려한 웹페이지를 만들고, 그걸 관리하고 실제 방문자가 들어올 수 있도록 도메인을 추가하고 뭐 이런 과정이 굉장히 복잡하고 어려운 것이죠. 그래서 오늘은 정말 딱 반. 시작. 간단한 웹페이지의 형태를 만드는 것을 해보겠습니다. 일단 예전에 다운로드 받았던 '서브라임텍스트'를 실행시켜주시기 바랍니다. 그런 뒤에 바탕화면에 프로젝트를 보관할 폴더를 만들어주시면 되겠습니다. 물론 폴더명은 영어로 지어야 됩니다...
IT & 프로그램 개발/홈페이지 만들기 2020. 3. 19. 09:22

웹사이트 개발 환경 준비하기 - 서브라임 텍스트 설치하기

웹사이트 개발 환경 설치하기 웹 사이트는 기존의 개발 방법과 최근에 파이썬을 이용하는 등 다양한 방법으로 개발이 가능합니다. 하지만 저는 전통적으로 개발되고 있는 방법인 HTML, CSS, 자바 스크립트 이 3가지를 활용하여 개발하는 방식을 선택해서 진행할 계획을 가지고 있습니다. 아 물론 저게 전통적인 방식인지 정확하게는 알지 못합니다. 기본적인 개발 프로그램은 다양하게 있습니다. 서브라임텍스트(Sublime Text), 웹스톰(WebStrom) 에디트 플러스(EditPlue) 등이 있는데, 해당 개발 프로그램들은 무료로 사용이 가능한 프로그램도 있고, 유료로 사용할 수 있는 프로그램들도 있습니다. 개발 도구를 선정하는데에는 여러가지 고려사항이 있지만, 가장 중요한 점은 본인의 손에 얼마만큼 잘 맞는지..
IT & 프로그램 개발/홈페이지 만들기 2020. 2. 27. 09:10

홈페이지 만들기 도전 - 제 2의 수익원을 창출해보자!

다들 비슷하시겠지만 새해가 되고 나서 정말 많은 결심들을 했습니다. 스스로의 목표도 설정하고 조금 더 좋은 습관을 기르기 위해서 다짐하며 좀 더 성장할 수 있는 정성적인 목표를 세운 것도 있습니다. 그리고 실제 수익을 내는 부분이나 실질적인 수치로 환산할 수 있는 정량적인 목표까지 하나씩 계획을 하면서 어느새 벌써 한 달이 지났습니다. 홈페이지 만들기는 그 결심 중 하나로 개인적인 공부 및 새로운 수익창출을 위한 활동입니다. 왜 홈페이지 개발인가? 저는 2019년에 이직을 해서 '기획자'라는 직업을 가지게 되었습니다. 처음 전공한 것과 실무를 배운 것은 '전자공학의 임베디드 개발자'였습니다. 이직을 하면서 꾀나 삶의 많은 부분들이 바꿨습니다. 우선 6시 칼퇴근이 가능해져 계획적으로 하루를 보낼 수 있으면..
IT & 프로그램 개발/홈페이지 만들기 2020. 2. 5. 20:51
◀ 1 2 ▶
-->

티스토리툴바