seop's study seop's study

와이어 프레임 와이어프레임(’골격’이라고도 함)은 제품을 구성하는 서로 다른 레이아웃을 정적인 로우 피델리티 상태로 재현한 것으로, 간단한 모양만을 사용하여 인터페이스를 시각적으로 묘사한 것입니다(와이어프레임은 이름에서 알 수 있듯이 와이어로 설계된 모양입니다). 와이어프레임은 구조(페이지 요소의 구성 방식), 콘텐츠(페이지에 표시될 내용) 및 기능(인터페이스의 작동 방식)을 설명하는 데 사용됩니다. 핵심은 와이어프레임이 미래에 대한 스토리라는 점입니다. 와이어프레임을 통해 디자인 팀은 디자인의 현재 진행 상태, 향후 비전, 작업 경로 등을 서로 공유할 수 있습니다. 와이어 프레임을 제작하는 목적 와이어프레임은 디자이너가 작업을 시작하고 크리에이티브 팀의 작업 방향을 설정하는 기초 역할을 합니다. 와이어..

그리드 시스템 그리드 시스템(Grid System)에서 ‘Grid’는 격자나 바둑판 모양의 눈금을 뜻하며 일반적으로는 수직과 수평으로 면이 분할된 것을 의미합니다. 그리드 시스템은 디자인의 레이아웃에 규칙을 부여하는 수단입니다. 편집디자인(인쇄물)에서 시작해 현재 웹 개발 분야에도 적용하여 웹 페이지를 제작하는 기초 단계에서 그리드 시스템을 사용하면 제작을 쉽고 빠르게 진행할 수 있습니다. 그리드 시스템의 장점 디자인 레이아웃은 모든 측정값이 동일한 규칙을 따르면 자동으로보다 일관된 UI를 얻게 됩니다. 그리드 시스템은 균일한 요소와 간격을 사용하여 플랫폼, 환경 및 화면 크기에 일관성을 부여하고 그래픽 요소의 체계적인 배열을 도와줍니다. 또한 협업의 목적으로 내부의 기준을 정하는 것에 도움이 되며, 또..

시맨틱 태그 시맨틱(Semantic)은 "의미의, 의미론적인"이라는 뜻으로 의미를 가지는 태그가 시맨틱 태그입니다. 즉, HTML5에 도입된 시맨틱 태그는 개발자와 브라우저에게 의미있는 태그를 제공하게 됩니다. 종류 태그는 머리말 영역으로 문서 또는 섹션의 헤더를 나타낼 때 사용합니다. 태그는 내비게이션를 나타낼 때 사용합니다. 태그는 문서의 주요 컨텐츠를 나타낼 때 사용합니다. 태그는 사이드에 위치하는 공간을 나타낼 때 사용합니다. 태그는 주제별 그룹의 컨텐츠 섹션을 나타낼 때 사용합니다. 태그는 문서 본문 중 독립된 콘텐츠(개별 뉴스 기사, 게시물)를 나타낼 때 사용합니다. 태그는 꼬리말을 나타낼 때 사용합니다. 태그는 컨텐츠 작성자나 사이트 소유자의 정보등을 부가적으로 담을때 사용합니다. 태그는 제..

웹표준 웹표준이란? 월드 와이드 웹(W3C)의 측면을 서술하고 정의하는 공식 표준이나 다른 기술 규격을 가리키는 용어입니다. 웹에서 표준적으로 사용되는 기술이나 규칙을 의미하며, 웹사이트에 접속한 사용자는 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동해야 함을 의미합니다. 웹 접근성 웹 접근성이란? 웹 접근성은 장애를 가진 사람과 장애를 가지지 않은 사람 모두가 웹사이트를 이용할 수 있게 하는 방식을 가리킵니다. 사이트가 올바르게 설계되어 개발되고 편집되어 있을 때 모든 사용자들은 정보와 기능에 동등하게 접근할 수 있습니다. 웹 호환성 웹 호환성이란? 웹 호환성은 표준 웹 기술을 사용하여 운영체제, 브라우저 등 어느 한쪽으로 최적화되거나 종속되지 않도록 공통 요소를 ..

기초 문법 HTML이란? HTML은 Hyper Text Markup Language의 약자입니다. 웹 페이지는 HTML 문서라고도 불리며, HTML 태그들로 구성됩니다. 각각의 HTML 태그는 웹 페이지의 디자인이나 기능을 결정하는데 사용됩니다. HTML 태그(tag) HTML 태그는 태그 이름을 꺾쇠 괄호()로 감싸서 표현합니다. 문법 1. // 시작 태그 2. //종료 태그 HTML 태그는 보통 시작태그(start tag, opening tag)와 종료 태그(end tag, closing tag)의 한 쌍으로 구성됩니다. 종료 태그는 시작 태그와 전부 똑같지만,태그 이름 앞에 슬래시(/)가 존재합니다. 태그에 따라 시작 태그만 있고 종료 태그가 없는 태그도 존재합니다. 등과 같이 종료 태그 없이 시작..