Web's study ! 지선

연산자란? 초등학교 때 덧셈, 뺄셈, 곱셈, 나눗셈과 같은 연산을 해본 적이 있죠? 컴퓨터에서도 다양한 연산자를 통해 계산 작업을 합니다. 자바스크립트 프로그래밍에서 사용하는 연산자에는 산술, 문자결합, 대입(복합대입), 증감, 비교, 논리, 삼항 조건 연산자가 있습니다. 예를 들어 자신의 평균 체중을 구할 때 빼고 곱하는 작업 등은 산술 연산자를 이용합니다. 그리고 이렇게 빼기, 더하기, 나누기, 비교등을 하는 일련의 작업을 연산 작업이라고 합니다. 산술연산자 산술 연산자에는 산수 시간에 배운 더하기(+), 빼기(-), 곱하기(*), 나누기(/), 나머지(%)가 있습니다. 산술 연산자로 연산을 하기 위해서는 연산 대상 데이터가 반드시 2개 있어야합니다. 다음은 산술 연산자의 종류와 기본형을 정리한 표입..

Block Block 속성은 Inline과 달리 한 줄에 나열되지 않고 그 자체로 한 줄을 완전히 차지합니다. 대표적인 블록 요소로 태그가 있습니다. display 속성이 block으로 지정된 엘리먼트는 전후 줄바꿈이 들어가 다른 엘리먼트들을 다른 줄로 밀어내고 혼자 한 줄을 차지합니다. 대표적인 block 엘리먼트로 이나 , 태그 등을 들 수 있습니다. 예를 들어, 여러 개의 block 엘리먼트 다음과 같이 마크업하면 매번 줄바꿈 되어 여러 줄에 보이게 됩니다. block은 height와 width 값을 지정 할 수 있다.margin과 padding을 지정 할 수 있다. InLine Inline 속성이란, 쉽게 말해 줄을 바꾸지 않고 다른 요소와 함께 한 행에 위치하려는 성향입니다. display 속성..

그리드 시스템 그리드 시스템(Grid System)이란, 페이지 콘텐츠를 논리적이고 일관성 있는 질서와 구조로 디자인할 수 있도록 돕는 그래픽 시스템을 말합니다. 여기서 그리드(Grid)는 사전적 의미로 '격자무늬' 또는 '격자판'을 의미하며, 디자이너는 아래 그림과 같이 격자 선에 맞춰 디자인에 규칙을 부여하여 페이지를 더 보기 좋고, 알기 쉽게 제작하는 데 도움이 됩니다. 웹 디자인에서 그리드 시스템은 페이지의 디자인 영역을 나누고, 각 영역에 디자인 요소를 배치하는 데 사용됩니다. 그리드 시스템은 웹 디자인에 있어 아래와 같은 긍정적인 역할을 합니다. 컬럼 단위로 요소를 구성하므로 많은 양의 콘텐츠도 정돈된 느낌을 준다. 격자 형식에 따르므로 블록을 쌓듯 디자인이 편리하다. 일관되고 통일성 있는 아..

SEO (검색엔진최적화) SEO(Search Engine Optimization, 검색엔진 최적화)란 웹사이트의 정보를 크롤링 하고, 순위를 매기는 방식에 맞도록 웹사이트를 수정, 조율을 하여 최적화 작업을 하고, 이를 통해 검색 결과(SERPs)의 상단에 타겟 웹사이트를 구글 상위 노출을 시켜 트래픽(방문자)을 높이는 디지털 마케팅 전략을 지칭합니다. SEO 설명 웹 페이지 검색엔진이 자료를 수집하고 순위를 매기는 방식에 맞게 웹 페이지를 구성해서 검색 결과의 상위에 나올 수 있게 한다. 웹 페이지와 관련된 검색어로 검색한 검색 결과 상위에 나오게 된다면 방문 트래픽이 늘어나기 때문에 효과적인 인터넷 마케팅 방법 중의 하나이며 비용처리 없는 마케팅이라고 할 수 있다. 기본적인 작업 방식은 특정한 검색어..

UI/UX 콘셉트 도출 도출된 아이디에이션(Ideation)의 프로토타입 검증 결과에 따라서 확정된 UI/UX 콘셉트를 결정할 수 있다. 도출된 UI/UX 콘셉트를 반영하여 목표 고객인 페르소나(persona)를 추출할 수 있다. UI 설계를 위해서 UI/UX 콘셉트에 적합한 시나리오(scenario)를 작성할 수 있다. 페르소나(persona) 페르소나는 사용자의 목적(goals)과 행동(behaviors)을 대표하는 실제 타깃 사용자 그 룹을 가상의 캐릭터(artificial person and archetypical users)로 형상화하는 목적 지향적인(goal-directed) 인터랙션 디자인의 방법이다. 핵심적인 캐릭터의 구성요소는 니즈(motivations and needs), 목적, 환경(..

시멘틱 태그 시멘틱(Semantic) 태그란 의미에 맞게 태그를 작성하는 것을 의미합니다. 의미에 맞게 태그를 작성하여 브라우저나 개발자가 그 태그의 사용의미를 잘 받아들일 수 있도록 코딩하는 것이 중요합니다. 시맨틱 태그에 의해 컴퓨터가 HTML 요소의 의미를 보다 명확히 해석하고 그 데이터를 활용할 수 있는 시맨틱 웹이 실현될 수 있다. 시맨틱 웹이란 웹이 존재하는 수많은 웹페이지들에 메타데이터를 부여하여 기존의 잡다한 데이터 집합이었던 웹페이지를 의미와 관련성을 가지는 거대한 데이터 베이스로 구축하고자 하는 발상이다. 종류 태그명 설명 여러 문단을 묶는 태그, 독립적인 콘텐츠를 정의할 때 사용합니다. 콘텐츠나 페이지의 외곽에 위치한 요소들을 묶는 태그, 보통 퀵메뉴나 스크롤탑버튼등에 사용합니다. 일..

웹표준 이란? 최근 국내 웹 관련 업계에서는 웹 접근성 수준 향상에 대한 요구로 인해 웹 표준에 대한 관심이 고조되고 있습니다. 이처럼 웹 접근성 이슈를 통해 웹 표준이 주목을 받고 있는 이유는 웹 접근성 수준을 향상시킬 수 있는 다양한 방법론의 중심에 웹표준이 있기 때문입니다. 웹접근성 수준 향상의 최적의 방법론으로 관심을 모으고 있는 웹 표준이란, ‘웹에서 표준적으로 사용되는 기술이나 규칙’을 의미하는데, 이는 우리가 흔히 생각하는 표준(standard)과는 조금 다릅니다. 웹에서의 표준은 W3C의 토론을 통해 나온 권고안(recomendation)을 말하며, 권고안 이외 단계 수준의 스펙은 비표준이거나 독자확장 요소를 의미하기 때문에 구분하여 사용해야 합니다. 웹접근성 웹 사이트에서 제공하는 정보를..

CSS란? CSS(Cascading Style Sheets)은 HTML을 꾸며주는 디자인 언어입니다. CSS 주석 표시 주석 표시는 프로그램에 영향을 미치지 않으며, 설명이나 메모를 목적으로 사용합니다. {/* CSS 주석 */ {/* CSS 주석 */ CSS 선언 방법 내부 스타일 내부 스타일 : head 태그 안에 설정하는 방법입니다. 외부 스타일 외부 스타일 : 외부 파일을 연결하는 방법입니다. 인라인 스타일 인라인 스타일 : 요소에 직접 설정하는 방법입니다. style='background-color:#00f; color:ff0'>즐거운 하루!