본문 바로가기

Ankiwoong

 (1837)
사용자 중심 디자인 - User Centered Design 1. 사용자 중심 디자인(User Centered Design) 파워 유저나 초보자를 제외한 일반 사용자를 중심으로 구축 2. 유용성 웹 사이트 이용이 얼마나 쉽고 만족스러운가? 습득 가능성 : 배우기 쉬움 기억 가능성 : 이용 방법을 기억하기 쉬움 효율성 : 효율적으로 이용할 수 있어야 함 신뢰성 : 잘 작동된다는 신뢰감 사용자 만족도 : 사이트를 사용하면서 만족감을 느낌 사용자 개인마다 다름 3. 인터페이스 디자인 인터랙티브 인터페이스 디자인 : 컴퓨터와 인간 사이에서 상호 작용 실제 사용 행동을 다양한 방법으로 분석 심성 모형 정신 모형 및 인지 능력과 일치하지 않는 디자인의 문제점 파악하여 개선안 제시 프로토타입 제작 편의성 및 사용자의 의견을 평가 보완 4. 유용성을 위한 웹 인터페이스 기능성을..
HTML5 - 190701 Basic Study 69(반응형 웹) 1. HTML Code 메뉴1 메뉴2 메뉴3 있는 이것을 능히 보이는 투명하되 이상의 낙원을 칼이다. 위하여 같이 힘차게 오직 듣는다. 뭇 창공에 천지는 말이다. 같이, 있는 되는 열매를 말이다. 있는 이것을 능히 보이는 투명하되 이상의 낙원을 칼이다. 뭇 창공에 천지는 말이다. 같이, 있는 되는 열매를 말이다. 2. CSS Code @charset "utf-8"; /* CSS Document */ * { margin: 0; padding: 0; box-sizing: border-box; } header { width: 100%; background: #000; } nav ul { height: 50px; margin: 0; list-style: none; background: #000; color: w..
HTML5 - 190701 Basic Study 68(Cafe 페이지 제작) 1. HTML Code 여기는 패널창입니다. 옆에서 나오는 창입니다. [닫기] 카페 소개 오시는 길 이 달의 추천 카페 소개 영업 시간 : 오전 9시 ~ 밤 10시 휴무 : 매주 수요일 (수요일이 공휴일일 경우 수요일 영업, 다음날 휴무) 오시는 길 서귀포시 안덕면 사계리 oooo-ooo 제주 올레 10코스 산방산 근처 이 달의 추천 핸드드립 아이스커피 1인분 기준으로 서버에 각얼음 5조각(한조각의 20cc) 넣고 추출을 시작한다. 평상시 보다 원두의 양은 2배 정도 (20g)와 추출액은 얼음 포함해서 200cc까지 내린다. 아이스 잔에 얼음 6~7개 섞어서 시원하게 마신다 My times with Coffee 2. CSS Code @charset "utf-8"; /* CSS Document */ * {..
HTML5 - 190701 Basic Study 67(그리드 시스템) 1. HTML Code 그리드시스템 모바일 메뉴 테블릿 메뉴 데스크탑 메뉴 welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world welcome to my world 2. CSS Code @cha..
HTML5 - 190701 Basic Study 66(반응형 웹 기초 구성) 1. HTML Code 반응형웹을 만들자 박스 1 박스 2 박스 3 2. CSS Code @charset "utf-8"; /* CSS Document */ /* 모니터용 스타일시트 */ @font-face { font-family: '나눔고딕'; src: local('NanumGothic'), url('NanumGothic.eot'), url('NanumGothic.ttf'), url('NanumGothic.woff'); } h1{ font-family:"나눔고딕" } /* 공통스타일 */ *{ margin:0 auto; padding:0; } h1{ background:beige;/* 적용이 안된다 */ border:3px dotted black; } section{ border:2px solid bl..
HTML5 - 190701 Basic Study 65(프린터, 모니터 CSS) 1. HTML Code 안녕하세요 welcom to welcome to world 감사합니다 2. 모니터용 CSS @charset "utf-8"; /* ex01-mo.css - 모니터용 스타일시트 */ /* CSS Document */ h1{ background:red; } @font-face { font-family: '나눔고딕'; src: local('NanumGothic'), url('NanumGothic.eot'), url('NanumGothic.ttf'), url('NanumGothic.woff'); } h1{ font-family:'나눔고딕' } 3. 프린터용 1 CSS @charset "utf-8"; /* ex01-pr.css - 프린터용 스타일시트 */ /* CSS Document */ @..
정보 설계 - Information design 1. 정보 설계 사용자가 원하는 정보를 쉽고 빠르게 찾을 수 있도록 하는 것 웹 사이트 조감도 시간과 비용 절감 계획상의 문제점 최소화 2. 정보의 순서와 정렬 명확한 콘텐츠 체계 알파벳순 가나다순 연대순 날짜순 시간순 지리 위치순 모호한 콘텐츠 체계 주제별 체계 작업 지향형 체계 사용자 구분형 체계 은유형 체계 혼합 콘텐츠 체계 중요 / 사용 빈도에 따른 콘텐츠 체계 3. 콘텐츠 분류 방법 경쟁사 벤치마킹 카드소팅 4. 정보 설계의 분류 네비게이션 시스템(Navigation System) 레이블링 시스템(Labeling System) 5. 사이트 구조 계열 구조(Sequential Stucture) : Prev Page Next Page 계층 구조(Hierarchical Structure) : 홈페이지..
콘텐츠 분류와 설계 - Content classification and design 1. 콘텐츠(Contents) 텍스트 정보뿐만 아니라 특정 사이트에 있는 모든 구성 요소 2. 매체 성격 분류 외부 콘텐츠 : 외부에서 얻은 모든 콘텐츠 내부 콘텐츠 : 인터넷 분야 자체 콘텐츠 3. 콘텐츠 생성에 따른 분류 프로듀서 콘텐츠(Producer Contents) : 사이트 제작자가 일방적 제공 컨슈머 콘텐츠(Consumer Contents) : 사용자에게 얻은 콘텐츠 4. 콘텐츠 비용에 따른 분류 유료 콘텐츠 무료 콘텐츠 5. 프로슈머적 콘텐츠(Prosumer Contents) 프로듀서(Producer) + 컨슈머(Consumer) 게시판 형태 마케팅 부담 절감 6. 웹 콘텐츠 기획 초기 콘텐츠 기획 및 구성 매니아 확보 콘텐츠 확장 대제 작업 논의 콘텐츠 리스트 정의

티스토리툴바