여러분이 사용하고 계신 브라우저는 HTML5를 지원하지 않기 때문에 몇몇 요소가 제대로 보이도록 JScript를 사용하고 있습니다. 하지만 여러분의 브라우저 설정에서 스크립트 기능이 꺼져있으므로, 현재 페이지를 제대로 확인하시려면 스크립트 기능을 켜주셔야 합니다. How To - 웹사이트 만들기 및 보기

How To – 웹사이트 만들기 및 보기

2주전 작성

w3.css

웹사이트 만들기 및 보기

컴퓨터에서 웹 페이지를 만들고 보는 방법을 알아보자.

1단계

메모장(Windows PC) 열기

Windows 8 이상:

시작 화면을 연다(화면 왼쪽 하단에 있는 Windows 기호). 검색창에 Notepad를 입력한다 .

Windows 7 또는 이전 버전:

시작 > 프로그램 > 보조 프로그램 > 메모장을 연다.

텍스트 편집기(Mac) 열기

Finder > 응용 프로그램 > 텍스트 편집기를 연다.

또한 일부 기본 설정을 변경하여 응용 프로그램이 파일을 올바르게 저장하도록 한다. 기본 설정 > 형식 > “일반 텍스트”를 선택한다.

그런 다음 “열기 및 저장”에서 “HTML 파일을 서식 있는 텍스트가 아닌 HTML 코드로 표시”라는 상자를 체크한다.

그런 다음 새 문서를 열어 코드를 삽입한다.

2단계: HTML 작성

다음 HTML 코드를 메모장에 쓰거나 복사한다.

예제
<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

3단계: HTML 페이지 저장

파일을 컴퓨터에 저장한다.

⭐ 파일 확장자로 .htm 또는 .html을 사용할 수 있다. 차이는 없다.

Windows PC

메모장 메뉴에서 파일 > 다른 이름으로 저장을 선택한다.

파일 이름을 “index.html”로 지정하고 인코딩을 UTF-8 (HTML 파일에 가장 적합한 인코딩)로 설정한다.

Mac

텍스트 편집기 실행 중 메뉴 막대에서 파일 > 저장을 선택한다.

파일 이름을 “index”로, 파일 포맷을 웹페이지(.html)로 설정한다.

4단계: 브라우저에서 HTML 페이지 보기

원하는 브라우저에서 저장된 HTML 파일을 연다.

Windows PC

파일을 두 번 클릭하거나 마우스 오른쪽 버튼을 클릭하고 “다른 프로그램으로 열기”를 선택한다.

Mac

파일을 두 번 클릭하거나 키보드의 Control을 누르고 있는 상태로 클릭하고 “다음으로 열기”를 선택한다.

온라인 편집기

무료 온라인 편집기를 사용하면 HTML 코드를 편집하고 브라우저에서 결과를 볼 수 있다.

코드를 빠르게 테스트 하고 싶을 때 완벽한 도구다. 또한 색상 코딩과 다른 사람과 코드를 저장하고 공유할 수 있는 기능이 있다.


참고

Mingg`s Diary
밍구
밍구
공부 목적 블로그