32

웹의 주요 프로그래밍 언어 3가지

웹 개발을 위해 사용하는 표준화된 프로그래밍 언어를 사용하면 화면에 표시되는 내용과 웹 사이트의 동작을 제어할 수 있다. 첫번째 언어는 'HTML'이며, 'Hypertext Markup Language'의 약어이다. 웹 사이트의 실제 내용과 구조를 만드는데 사용한다. HTML이 없을 경우 화면상에 아무것도 나타나지 않는다. 단, 기본적인 스타일은 많이 없기 때문에 단순한 형태를 띈다. 두번째 언어는 'CSS'이며 'Cascading Style Sheets'의 약자로 웹 사이트의 스타일을 정의한다. 엄밀히 따지면 선택 사항이지만, CSS에 따라 웹의 디자인적인 요소가 천차만별이 될 만큼 중요하다. 세번째 언어는 'JavaScript'이다. 웹사이트에 상호작용을 추가하는 언어이며 정적인 홈페이지를 동적으로 ..

2023.11.04

당신이 몰랐던 웹 이야기

1969년 냉전시대에 미국에서는 중요 군사 정보를 어떻게 관리해야 하는지에 대해서 고민을 했었다. ※ 냉전시대는 직접적인 충돌은 발생하고 있지 않았으나 군사 동맹, 무기 경쟁, 첩보전, 체제 선전, 그리고 우주 진출과 같은 기술 개발 경쟁의 양상을 보이며 서로 대립하였던 시기를 말한다. 어떤 위치에서 정보를 관리한다고 해도 하나의 문제. ‘핵 미사일이 이 요새를 공격한다면?’ 에 대해서는 해결책이 없었고, 그래서 여러 곳에 서버를 분산 설치한 뒤 이를 서로 연결하여, 일부 서버가 공격 당하더라도 나머지 서버들로 관리하는 방안이 제시되었다. 4곳의 대학을 네트워크로 연결하여 패킷교환 방식으로 데이터를 관리하는 것으로 하고 이렇게 탄생한 것이 ARPANET으로 인터넷의 시초이다. ※ 패킷 교환 방식이란? 데..

2023.11.04

웹 개발과 웹 작동방식이란?

웹 개발자들은 일반적으로 웹 사이트를 만든다. ※ 웹이란? - 웹은 인터넷에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 전 세계적인 정보 공간을 말한다. - www(world wide web)로 말하기도 한다. 웹 사이트에 접속하기 위해서는 웹 브라우저가 필요하다. ※ 웹 브라우저란? - 웹 서버에서 쌍방향으로 통신하고 HTML 문서나 파일을 출력하는 프로그램이다. naver.com 같은 인터넷 주소를 도메인이라고 한다. ※ 도메인이란? - 외우거나 식별하기 어려운 IP 주소(예:240.10.20.1)를 example.com처럼 기억하기 쉽게 만든 것이다. 청와대의 영문 웹사이트 주소는 https://eng.president.go.kr/인데 아래와 같이 분석할 수 있다. ※ 도메인의 위치별 의..

2023.11.03

del, ins, code, kbd

1. del, ins 태양계의 행성은 수성, 금성, 지구, 화성, 목성, 토성, 천왕성, 해왕성, 명왕성으로 구성한다. 명왕성은 행성 분류에서 제외되었다. : 삭제(delete)를 뜻하는 줄임말과 삽입(insert)을 뜻하는 줄임말의 태그입니다. 특정한 내용의 변경점을 추적하는데 사용할 수 있습니다. 1.1 cite : 변경점의 출처나 URL을 기재합니다. 1.2 datetime : 변경이 발생한 일시. 시간 등을 지정합니다. 2. code 함수 selectAll()는 입력 필드의 모든 텍스트를 선택하므로, 사용자가 복사 혹은 삭제를 손쉽게 할 수 있습니다. : 짧은 코드 조각을 나타내는 요소로 인라인 형태로 출력됩니다. 3. kbd 새로운 문서는 키보드 단축키 Ctrl+N으로 만들 수 있습니다. : 키..

웹/HTML 2022.10.12

mark, small, sub, sup

1. mark 여러 종의 도롱뇽은 태평양 북서부의 온대 우림에 서식합니다. : 형광펜을 사용해 중요해 보이는 책에 강조 표시를 추가하는 것처럼 생각하면 됩니다. 단, 표시를 위한 용도로는 mark가 아니라 CSS를 적절히 사용해야 합니다. 현재 행동과 관련이 있는 키워드를 강조 표시할 때 사용할 수 있습니다. 기본적으로 스크린리더에서는 를 강조해서 표현하지 않습니다. 2. small MDN Web Docs는 웹 기술과 웹을 구동하는 소프트웨어를 위한 학습 플랫폼입니다. 콘텐츠는 Creative Commons Attribution-ShareAlike 2.5 일반 라이선스에 따라 라이선스가 부여됩니다. : 덧붙이는 글이나, 저작권과 법률 표기 등의 작은 텍스트를 나타냅니다. 단순히 글씨크기를 줄이고자 할 때..

웹/HTML 2022.10.10

abbr, address, bdo

1. abbr 2022년 신조어 중 무물보라는 말이 있다. : 약어(abbreviation)를 뜻하는 태그로 줄임말, 또는 머리글자를 나타냅니다. 선택 속성인 title을 사용하면 줄임말의 전체 뜻이나 설명을 확인할 수 있습니다. 용어나 개념에 익숙하지 않은 사람, 언어를 새로 접한 사람, 인지력 문제를 겪고 있는 사용자에게 큰 도움이 됩니다. 1.1 dfn HTML is a markup language used to create the semantics and structure of a web page. A Specification (spec) is a document that outlines in detail how a technology or API is intended to function and..

웹/HTML 2022.10.10

figure, figcaption

figure, figcation : 독립적인 콘텐츠를 표현하고, 요소를 사용해 설명을 붙일 수 있습니다. An elephant at sunset 1.1 img : 이미지를 삽입하며 설명을 붙일 수 있습니다. 1.2 문장 Bid me discourse, I will enchant thine ear, Or like a fairy trip upon the green, Or, like a nymph, with long dishevell'd hair, Dance on the sands, and yet no footing seen: Love is a spirit all compact of fire, Not gross to sink, but light, and will aspire. Venus and Adonis, ..

웹/HTML 2022.10.09

blockquote, q

blockquote, q : 둘 다 인용문(quote)을 작성할 때 사용하는 태그입니다. 인용문은 다른 사람이나 자신의 말 또는 글을 직,간접적으로 끌어다 쓰는 출처가 있는 문장을 의미합니다. 문장길이, 또는 배치에 따라 , 를 각각 사용합니다. 1. blcokquote Avian carriers can provide high delay, low throughput, and low altitude service. The connection topology is limited to a single point-to-point path for each carrier, used with standard carriers, but many carriers can be used without significant i..

웹/HTML 2022.10.09

정의리스트 dl, dt, dd 태그

: 여러가지 HTML 책을 가지고 있는데 그중에 정의리스트는 반쪽으로 설명된 경우도 있었고, 심지어 아예 설명이 없는 경우도 있었습니다. 처음에는 '정의 리스트는 별로 중요하지 않구나' 라는 생각이었는데 의외로 자주 사용하는 것을 발견해 기록하고 싶었습니다. MDN에서는 정의 리스트를 크게 2가지 용도로 사용한다고 합니다. HTML 요소는 설명 목록을 나타냅니다. 은 로 표기한 용어와 요소로 표기한 설명 그룹의 목록을 감싸서 설명 목록을 생성합니다. 주로 용어사전 구현이나 메타데이터(키-값 쌍 목록)를 표시할 때 사용합니다. - MDN 1. dl (Definition List, Description List) : ol, ul과 같은 리스트 태그처럼 dl 태그는 리스트를 묶어주는 역할을 합니다. dl 태그..

웹/HTML 2022.07.26

HTML이란?

HTML이란? HTML이란 무엇인가요? HTML(하이퍼 텍스트 마크업 언어)는 웹 페이지 표시를 위해 개발된 지배적인 마크업 언어다. 또한, HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 출처 : 위키백과 프로그래밍 언어는 아니고, 우리가 보는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어입니다. 출처 : MDN MDN에서도 HTML은 프로그래밍 언어가 아니고 마크업 언어 라는 정의를 찾을 수 있었는데요. 프로그래밍 언어와 마크업 언어의 차이는 무엇일까요? 왜 프로그래밍 언어가 아닐까요? 무슨 차이가 있을까요? 마크업 언어? 문서가 화면에 표시..

웹/HTML 2022.07.10