분류 전체보기 640

잊어야 할 태그(tag)들

1. 이 태그들은 왜 안 쓰는 게 좋은가? 2014년에 HTML5가 나온 후, HTML5에서 지원되지 않는 태그들이 있다. 이 태그들을 사용할 경우 웹페이지가 잘못 표시될 수 있을 뿐 아니라 또한 방문자가 많더라도 콘텐츠 확인이 불가하여 사이트에 좋지 않은 영향을 주고, seo (검색엔진 최적화)에 불리하다. 2. HTML5에서 지원하지 않는 태그 종류. , (구) 축약어 표시에 사용되던 것 - 이것 대신 로 사용. 예) 나는 간다 → 나는 간다 (참고) 위 에디터 입력 내용을 크롬 등 브라우저로 열고 → 나는 간다에 마우스를 올리면 "이제 그만 잊어다오"가 나타난다. 위 처럼 사라져 가고 있는 태그에는 다음과 같은 것들이 있다. 애플릿 정의에 사용 → 이것 대신 사용. (구) 문서의 기본 글꼴 정의 →..

코딩/HTML 2021.04.08

속성(attributes)과 요소

1. attributes의 뜻 = 속성; …에 귀착시키다; … 의 덕분으로 돌리다; …에 돌리다. 2. 속성의 표시 방법 1) 속성, 속성 값, =, "따옴표" 표시 속성 이름="속성 값(value)"의 형식으로 표시한다. : 일반적으로 큰 따옴표로 묶지만, 큰 따옴표 대신 작은따옴표를 사용해도 된다. 그러나 속성 값 자체에 큰 따옴표가 포함된 경우에는 값을 작은따옴표로 묶는다. (예 :value='kk"Kim"gg') (실제, HTML5 표준에서는 따옴표 사용을 강제하진 않는다고 한다) (그러나 오류가 발생될 수 있으므로, 따옴표를 쓰는 게 좋다) 2) 대, 소문자 구분 속성 값은 특정 속성(id 및 class속성 등)을 제외하고 대소문자 구분하지 않는다. 그러나 W3C (World Wide Web C..

코딩/HTML 2021.04.07

요소(element)의 요소 5가지

1. element의 뜻 : 요소, 구성 요소, 원소, 성분 2. html과 요소(element)의 관계 html의 구성요소가 요소(element)이다.(시작 태그부터 종료 태그까지의 한 묶음) → html = 이 요소들의 집합으로 이루어져 있다. 3. 요소(element)의 구성요소는 무엇인가? 다음 5가지이다. 즉 요소란 다음 다섯 가지의 집합이다. 1) ①시작 태그(②속성 이름, ③속성 값을 포함) 2) ④내용(content) 3) ⑤종료 태그 4. 요소(element)의 시각화 시작 태그(start tag)는 opening tag라고도 한다. 종료 태그(end tag)는 closing tag라고도 한다. 종료 태그(closing tag)가 없는 경우도 있다 5. 위 구문의 예외 종료 태그가 없는 ..

코딩/HTML 2021.04.07

DOCTYPE html은 생략해도 될까?

1. 은 무엇인가? Doc=Document의 준말. 즉 Document Type을 정의(Define)하는 것이다. 지금 작성하는 html 코드에 대한 어떤 방식의 html 코드인지를 브라우저에게 알려주는 선언이다. (즉, DTD=Document Type Definition 문서형식 정의) 2. 이 선언을 해야하는 이유. HTML의 발달 역사 때문이다. Html은 1989년 Tim Berners-Lee가 처음 고안했을 때부터 지금까지 버전 변화가 있었다. 그리고 버전 별로 태그(tag)의 변화가 있었다. 이 선언을 하지 않으면 웹브라우저(크롬, 엣지, 익스플로러, 사파리 등)가 어느 버전의 문서인지 헷갈려서 해야 할 일을 제대로 못한다. 버전별로 선언 형식이 다르기 때문이다. 3. 버전 변화 과정 1) T..

코딩/HTML 2021.04.06

html 문서 구조의 시각화

1. html 구조의 시각화. 정의하다= define 브라우저에 표시되는 내용 : body 속의 내용. 브라우저의 문서 제목 표시줄(페이지 탭)에 표시되는 내용 : title의 내용. 2. Html 문서 구조의 설명 1) 먼저, 문서 유형의 선언으로 시작된다. = 이 문서는 HTML5 문서로 작성되었습니다 (문서의 맨 앞에 한 번만 사용, 대소문자 구분하지 않음) 2) = 이것은 html 문서입니다. = html 문서 끝났습니다. 3) = 문서의 head가 끝났습니다. 이 곳에서 html 문서에 대한 데이터를 정의(define)한다. (문서 제목, 스타일, 링크, 스크립트 등) 4) = 문서의 본문이 시작됩니다. (/body> = 본문이 끝났습니다. 문서 본문의 내용을 정의(define)한다. (제목, ..

코딩/HTML 2021.04.06

html 문서의 기본 구조 2단계

1. 크게 다음과 같다. ( 1,2,3은 요식행위, 실제 구조는 4,5의 두 단계이다) 1) 2) 3) 4) 5) 2. 에디터 입력 모습 tag란 태그(tag)= 꼬리표; 정가표; = 꼬리표, 즉 설명 태그는 꺽쇠(angle bracket)로 감싸기로 약속 (다시 다른 태그로 감싸 중첩하여 사용 가능) 태그는 꺽쇠와 슬러쉬 꺽쇠의 한쌍으로 표현한다 (그러나, 단독사용 가능한 태그도 있다; img, br/ 등) 주로 많이 쓰는 태그: 약 30개 3. 크롬 브라우저 출력 모습 1) tytle의 내용은 크롬 창 상단에 문서 제목으로 나타난다.(아래 그림) 2) body 속의 내용이 크롬 창 안에 나타난다.(아래 그림) 4. 결론 : html은 너무나 간단한 문서 구조이다.

코딩/HTML 2021.04.05

코딩에 대한 기본적인 질문

1. 코딩이란 무엇인가? code + ing = 즉, code의 ing이다. 2. 그럼, code는 뭔데? 스파이 영화에서 못 봤나? code = 부호, 기호, 암호를 뜻하며 여기서는 html 언어, css 언어, C 언어, JAVA(자바), Python(파이썬) 등 프로그래밍 언어를 말한다. 3. 언어(프로그래밍 언어)를 왜 코드라고 하는가? 그러게 말이다. html 등 이 언어들은 사람과 컴퓨터 간의 언어이므로 code(즉, 사람과 컴퓨터 간 사전 약속된 부호)이기도 하다. 대충, 쓱 봐도 이들은 모두 코드처럼 생겼다. 4. cording(cord + ing)은 프로그래밍인가? 좁게 보면 아니다. 넓게 보면 맞다. 프로그램 제작을 위하여 코드를 입력하는 작업 = 코딩. 프로그램 제작을 위한 기획 단계..

코딩 2021.04.04

도메인 구매, 호스팅 케이알, 티스토리 연결

도메인 구매, 호스팅 케이알, 블로그 연결 도메인 구매에서 블로그 연결까지의 과정에 관한 글. 도메인은 호스팅 케이알에서 구매하고 블로그는 티스토리로 연결하는 내용임. 1. 도메인 구매에서 블로그 연결까지의 업무 흐름도 1) 도메인 구매 사이트 선택 2) 도메인 구매 3) 블로그 연결 신청(도메인 업체 홈페이지에서) 4) 개인 도메인 연결 신청(블로그에서) 5) 보안 접속 인증 확인 2. 구체적인 구매 절차 1) 도메인 구매 사이트 후이즈, 카페 24, 가비아, 닷홈 등 국내 많은 기업들이 도메인을 팔고 있다. 그중에서 호스팅 케이알은 저렴하다는 특징이 있다. 2) 회원 가입 및 도메인 구매 회원가입 후 아래 붉은 박스에 구입하고 싶은 도메인 주소를 입력한다. 구입을 희망하는 주소(naver.com 등)..

pc/블로그 2021.04.02

마우스 자동 번역 기능 Cool Tooltip Dictionary 14

1. 필요한 분야 이 프로그램은 시간이 황금같이 귀한 사람(혹은 학생들)에게 조금 필요하다. 과거의 다음 꼬마 사전처럼 문서나 웹 브라우저에서 마우스만 올리면 자동으로 영어, 일어, 중국어 단어 해석이 필요한 사람. 즉, 사전을 별도로 찾으려니 시간이 너무나 아까운 사람에게 유용한 앱이다. 과거에 다음 꼬마 사전(마우스를 갖다 대면 자동으로 번역되는 pc 프로그램)이 있었지만 지금은 없어졌다. 인터넷 상에 옛날 버전이 떠돌고 있지만, 악성 코드 위험이 크고, 설치해도 Window 10에서는 거의 실행이 안 된다. 그것을 대체할 프로그램이 2가지 혹은 그 이상 있는 것 같다 첫째, 크롬 확장 프로그램인 Cool Tooltip Dictionary 14 둘째, 크롬 확장 프로그램인 네이버 툴바. 2. 두 프로..

pc/유용한 앱 2021.03.27

구글 드라이브 pc 설치 방법

설치 방법에는 다음 3가지가 있다. 1) 설치 없이 크롬 브라우저에서 그냥 실행. 크롬 첫 화면에서 아래 1, 2를 클릭하면 구글 드라이브가 열린다. 2) 직접 설치 (1) 크롬 홈페이지에서 아래 1, 을 클릭하고 2를 클릭한다. (2) 아래 페이지 우측 상단 톱니바퀴를 누른 후 펼쳐지는 아래 window용 백업 및 싱크 다운로드를 클릭한다. (3) 아래 창이 열리면 다운로드 클릭한다. (4) 그러면 아래 방법 3)와 만나게 된다. 3) 검색 사이트 이동 후 직접 설치. (1) 검색창에 "구글 드라이브"를 검색한다. (2) 여러 주소 창 중에서 구글 주소를 찾아 들어간다. (3) 페이지 하단 백업 및 동기화를 찾아 클릭한다. (4) 아래 화면에서 동의 및 다운로드한다. (5) 다운로드 후 시작화면이 열린..

pc 2021.03.22