물론 - 어떻게 웹 사이트를 만드는 방법

Treehouse

프로그램 설명

공식 설명 읽기

물론 - 어떻게 웹 사이트를 만드는 방법

Treehouse

어떻게 웹 사이트를 확인하는 방법

이전에 웹 사이트를 구축 적이 당신은 어떤 코딩이나 디자인 경험이없는 경우에, 이것은 시작하는 장소입니다. 이 프로젝트에서 우리는 데스크톱, 태블릿, 모바일 장치에 대한 현대 포트폴리오 웹 사이트를 구축하는 방법에 대해 알아 봅니다. 우리는 기본적인 HTML과 CSS 구문을 시작합니다. 다음으로, 우리는 이미지 갤러리 및 연락처 페이지와 사용자 정의 웹 페이지를 구축하는 방법에 대해 알아 봅니다. 마지막으로, 우리는 웹에서 라이브 웹 사이트를 공유하는 방법을 걷는다.

당신은 학습 내용

  • 기본 HTML을 작성하는 방법
  • CSS와 웹 페이지의 스타일을하는 방법
  • 방법 도메인 구입 호스팅
  • 파일을 업로드하는 방법

HTML과 CSS를 시작

이 빠른 튜토리얼에서, 우리는 우리가 구축하는 것을 목표로하고 최종 웹 프로젝트의 예를 확인할 수 있습니다. 그런 다음, 우리는 우리의 웹 사이트의 구조를 형성하는 데 도움이됩니다 우리의 첫 번째 HTML 요소를 코딩하는 방법을 배울 수 있습니다. 마지막으로, 우리는 몇 가지 간단한 CSS와 함께 우리의 웹 사이트를 스타일링하여 마무리합니다. 이 두 가지 언어로, HTML과 CSS는, 모든 웹 프로젝트의 기본 빌딩 블록을 형성한다.

HTML 먼저

HTML 문서의 구조를 설명하는 특별한 컴퓨터 언어이다. HTML, 우리는 텍스트, 이미지 및 콘텐츠의 다른 많은 유형을 포함하는 웹 페이지를 만들 수있다. 첫째, 우리는 짧은 역사 수업을 시작합니다. 그 다음 우리는 간단한 페이지 구조를 만들어 HTML의 최신 발전을 파고 있습니다.

HTML 콘텐츠 만들기

웹 사이트를 구축 할 때, CSS로 이동하기 전에 가능한 한 HTML 구조를 많이 작성하는 것이 좋습니다. 실제로, 당신은 HTML과 CSS,하지만 쉽게 처리 할 것이다 첫번째 구조의 대부분을 건물 사이를 앞뒤로 이동합니다. 먼저 우리는 우리의 사이트에 대한 탐색을 작성하여 시작합니다. 그런 다음, 우리는 이미지 갤러리 및 기타 페이지의 콘텐츠를 구조화로 이동할 수 있습니다. 마지막으로, 우리는 우리의 HTML 페이지에 CSS 파일을 포함하여 마무리합니다.

CSS : 캐스 케이 딩 스타일 시트

CSS는 우리가 잘 조직과 아름다운 디자인을 할 수있는 언어입니다. HTML은 정보의 구조를 설명하는 동안, CSS는 정보를 시각적으로 제시하는 방법을 설명합니다. 우리는 우리의 사이트에 대한 CSS 코딩을 시작하기 전에, 우리는 CSS의 구문에 대한 학습 시간을 보낼 것입니다.

색상 및 글꼴을 사용자 정의

CSS에서 색상을 16 진수라는 특수 코딩 형식을 필요로한다. 우리는 먼저 16 진수에 대해 배울 것입니다, 그리고, 우리는 우리의 색상 값에 사용할 수 있습니다. 그런 다음, 우리는 웹 페이지에 글꼴을 포함하는 방법뿐만 아니라 허가 된 글꼴을 찾는 방법을 배울 수 있습니다.

스타일링 웹 페이지 및 탐색

이미지 갤러리뿐만 아니라 수평 탐색 스타일링에 필요한 기술은 실제로 아주 유사하다. 첫째, 우리는 이미지의 그룹을 스타일과 우리의 이미지 갤러리를위한 행과 열로 변환하는 방법을 배우게됩니다. 그 후, 우리는 정렬되지 않은 목록에서 가로 방향 탐색을 만들 비슷한 CSS 기술을 사용합니다.

웹 사이트에 페이지 추가

다수의 웹 페이지를 함께 연결되는 경우, 페이지는 총괄적 사이트로 공지된다. 홈 페이지는 모두 우리의 연락처 페이지 및 페이지에 대한 템플릿 역할을합니다. 두 페이지에서 우리는 몇 가지 새로운 CSS 기술을 배우게됩니다.

반응 형 웹 디자인 및 테스트

현대 웹 사이트 염두에 모바일 및 데스크톱 사용자와 내장되어 있습니다. (대신 고정 된 픽셀) 유체 비율로 사이트를 구축함으로써, 우리는 좋은 출발입니다. 그러나 상기 경험을 향상시키기 위해 미디어 쿼리 불리는 특별한 CSS 규칙을 추가 할 수있다. 반응 형 디자인을 추가 한 후, 우리는 약간의 장치에서 사이트를 테스트합니다.

웹 사이트 공유

우리는 우리의 웹 사이트를 코딩을 마친 지금은 다른 사람들이 볼 수 있도록 웹에 살고 배포 할 수있는 시간이다. 첫째, 우리는 우리의 도메인과 호스팅을 구입합니다. 그 후, 우리는 우리의 서버로 파일을 배치하는 파일 전송 프로토콜 (FTP)을 사용한다.

HTML과 CSS 문제를 디버깅

웹 사이트를 만들 때, 문제 해결 능력은 필수적이다. 첫째, 우리는 우리의 코드 문제를 찾기 위해 개발자 도구에 액세스하는 방법을 배우게됩니다. 그 후, 우리는 몇 가지 일반적인 HTML과 CSS 문제를 통해 안내합니다 얼마나 신속하게 해결하기 위해.

선생

닉 페티트

닉 트리 하우스에서 교사와 독립적 인 게임 개발자이다. 그의 트위터 핸들 @nickrp입니다.

이 학교가 제공하는 프로그램은 :
  • 영어
기간 및 가격
이 과정은 온라인
Start Date
시작일
공개 입학
Duration
기간
시간제
전일제
Information
Deadline
Locations
미국 - USA Online
시작일 : 공개 입학
원서제출기한 학교와 연락
종료일 학교와 연락
Dates
공개 입학
미국 - USA Online
원서제출기한 학교와 연락
종료일 학교와 연락