이제하네

- 다양한 정보 입력받기 태그는 type속성을 다르게 지장하여 다양한 입력 형태로 만들수있다. type = " text" - 텍스트 입력받기 아이디 ==> 타입을 text속성으로 지정 type = " password" - 비밀번호 입력받기 비밀번호 ==> 타입을 password속성으로 지정 type = " checkbox" - 체크 박스 선택하기 복수선택 가능 취미 스포츠 ==> 타입을 "checkbox" 속성으로 지정 게임 요리 type = " radio" - 라디오 박스 선택하기 복수선택 불가능 직업 UI/UX 디자이너 ==> 타입을 "radio" 속성으로 지정 프론트엔드 개발자 백엔드 개발자 type = " file" - 파일 선택하기 첨부 파일 ==> 타입을 "file"속성으로 지정 type = ..

- 순서가 없는 목록 만들기 태그는 순서가 없는 메뉴를 목록으로 만들때 사용 태그를 사용할때는 자식태그인태그를 같이사용 내가 좋아하는 과일 딸기 바나나 사과 - 순서가 있는 목록 만들기 성적 순위, 번호등과 같이 순서가 중요할떄 사용 태그와 작성법은 비슷 --> 변경 태그 목록은 앞에 숫자가 표시 A반 시험 석차 김영희 박철수 홍길동 이하나 김길동 ,, - 정의형 목록 만들기 정의형 목록을 만들때 사용 부모태그인 안에 자식태그인,를 넣음 에는 정의할 제목, 에는 정의할 내용 입력 정의한 내용은 자동으로 들여쓰기하여 나타냄 IT 직군 UI 디자이너 기능성과 심미성을 고려한 UI 디자인 프론트엔드 개발자 사용자가 직접 이용하는 프런트 화면 개발 백엔드 개발자 사용자 화면 뒤에 있는 웹 서버나 데이터베이스의 ..

~ - 문서의 제목 지정하기 ~태그는 제목 태그로 숫자가 커질수록 제목의 중요도가 떨어짐 제목1 제목2 제목3 제목4 제목5 제목6 - 문단 지정하기 태그는 문단 태그로 문장 여러 개를 문단으로 지정 Lorem ipsum, dolor sit amet consectetur adipisicing elit. Optio, beatae! Fugit, quisquam. Repellendus laboriosam ex nam amet, dolore corrupti optio assumenda quasi tempora consectetur, sequi totam dolorum molestias minima aliquid. - 콘텐츠 그룹화하기 태그는 그룹 지정 태그로 콘텐츠를 그룹화 Lorem ipsum dolor si..

태그 상위 콘텐츠를 나타내는 태그 주로 웹 페이지 상단에 보여줄 로고, 메뉴등을 포함 태그 메뉴를 그룹화 하는 태그 링크를 포함한 메뉴를 그룹화 할때 사용 하지만 모든 링크와 메뉴를 일일이 태그로 지정해줄 필요는 없음 태그 멀티미디어 콘텐츠를 그룹화하는 태그 동영상이나 음악 같은 멀티미디어 콘텐츠를 그룹화 할때 사용 주로 메인 페이지의 이미지 슬라이더나 인터랙티브한 콘텐츠 영역을 지정 태그 특정 웹 페이지에서 중요한 콘텐츠를 그룹화하는 태그 메인 페이지뿐 아니라 서브 페이지에도 중요한 영역을 지정할때 사용 태그 부가 콘텐츠 영역을 지정하는 태그 태그와 반대로 웹 사이트와 연관성이 적은 부가 콘텐츠를 그룹화할떄 사용 ex) 광고의 팝업창 등 태그 콘텐츠 여러개를 그룹화 하는 태그 주로 연..

태그 브라우저가 웹 문서를 잘 이해할수 있도록 콘텐츠를 목적에 맞게 분류한 규칙 내용 부분이 여는 태그이고 부분이 닫는 태그 -->닫는 태그는 슬래시를 넣어 구분 부모 태그와 자식 태그 태그는 들여쓰기를 이용하여 중첩 관계로 만들수 있다. 여기서이 부모태그 DOCTYPE html> └> 웹 표준 문서라고 선언 └>웹 문서의 인코딩 방식 └>디바이스종류별로 화면에출력한방식을 지정 viewport가 있어야 반응형 웹 페이지를 제작할때 모바일 화면에 결과물을 출력가능 Document └>문서의 제목을 작성, 이 사이에 작성한 내용은 웹 브라우저 상단 탭에 표시 에디터에서 HTML 파일 수정하기 안녕하세요 !!! 태그에는 웹 브라우저에 출력할 내용을 작성 저렇게 변경한후 Ctrl + s 를 누르고 저장한후 마우..

비주얼 스튜디오로 기본 폴더와 HTML 파일을 만들어보겠습니다. 그다음에는 바탕화면에 아무 빈 폴더를 만든 후 먼저 비주얼 코드를 실행하면 File 에 Open Folder를 클릭 그 다음 그 빈 프로젝트를 선택한 후 이런 창이 뜨면 끝!! 그다음에는 새로운 HTML 파일 만들기 MY_PROJECT밑에 마우스 오른쪽 클릭 후 New File 클릭 index.html를 입력하고 만들면 html파일이 하나 생성 그리고 index.html을 클릭하면 코드를 입력하는 창이 생성 그 창에 html 만 입력해도 밑에 자동완성으로 html:5가 나오는데 그걸로 엔터를 입력하면 ==> "en" 을 "ko" 로 변경 이 코드가 자동 생성 여기서 "en"을 "ko"로 변경 이렇게 되면 웹 페이지 제작에 필요한 재료를 모두..

인터랙티브UI/UX UI(user interface) 사용자가 특정 콘텐츠를 이용할때 만다는 접점, 즉 사용자 환경을 의미 UX(user experience) 사람들이 특정 콘텐츠를 사용 할떄 UI에서 느낄수 있는 사용자 경험을 의미 예를 들면 게시판에 접근할때 A 웹 페이지에서는 메뉴를 3회를 클릭해야 하는데 B 웹 페이지에서는 1회만 클릭해도 접근이 가능하다면 B 웹페이지가 사용성(usability)이 더 좋다고 할수있다. 이처럼 특정 UI를 이용하여 콘텐츠를 사용할 때 느끼는 모든 사용자 경험을 UX라고 한다. 인터랙티브(interactive) UI/UX 사용자와 상호 작용하는 여러 모션과 동적인 콘텐츠를 사용하는 환경을 의미 간단히 생각하면 인스타나 페이스북 같이 SNS을 사용할때 페이지 형식으로..