WEB1 - HTML & Internet

웹사이트 완성

 

 

---

 

 

지금까지 웹페이지를 만드는 방법을 배웠습니다.


또 페이지와 페이지를
링크라는 길로 연결하는 방법도
배웠습니다.

 

 

링크는
본드,
실과 같은 것으로도
비유할 수 있습니다.

페이지가 모이면 책이 되듯이
웹페이지를 링크로 모으면
일종의 책이 만들어집니다.

이렇게
링크를 통해서 서로 결합되어 있는
웹페이지들의 그룹을
웹에서는 책이라고 하지 않고
웹사이트(web site)라고 합니다.

 

 

지금부터
웹사이트를 만들어 봅시다.

 

 

코딩을 시작하기 전에
완성된 결과물을 먼저 봅시다.
https://web-n.github.io/web1_html_internet/

 

 

웹사이트를 만들 때는
순서가 중요합니다.
어떤 순서로 작업을 진행할 지 잘 따져 보세요.

 

 

우선 이 웹페이지 전체를 대표하는
큰 제목을 만들겠습니다.
(동영상 참고 : https://youtu.be/w5S0GACgL3U?t=48)

 

 

그리고 각 부분에 링크를 걸어서
다른 페이지와 연결을 시키겠습니다.
아래 그림을 링크로 연결될 웹페이지의 파일명입니다.

 

 

우선 1.html 의 내용을 수정해서 링크를 거세요.
변경된 소스 보러가기

 

 

1.html 파일을 복제해서
index.html, 2.html, 3.html을 만듭니다.
그리고 각각의 파일에 맞게 내용을 수정합니다.
전체소스코드 다운로드

 

 

이렇게 하면 완벽하게 동작하는 웹사이트가 만들어집니다.
https://web-n.github.io/web1_html_internet/
잘 되나요? 축하드립니다. ^^

 

 

갈 길이 조금 남아 있기는 하지만,
우리는 지금 산의 정산에 올라왔습니다.
산에 정상에 올라왔는데
경치도 안 보고 내려간다면 얼마나 손해인가요?
잠깐 멈춰서서
우리가 만든 것을 보면서
'우와 내가 이런 것을 했다니'
이런 즐거운 기분을 음미하면서
천천히 하산 준비를 해 주세요.

 

다시 한 번 축하합니다!

 

댓글

댓글 본문
작성자
비밀번호
  1. 감사합니다. 작은 움직이지만 계속해서 꾸준히 움직여보겠습니다.
  2. ㅇㅇ
    완료ㅎㅎ
  3. 둥치둥치아재
    Enter를 안 친 글(위키피디아에서 긁어온 글)이 오른쪽 화면을 넘어가면

    View - Toggle Soft Wrap 누르세요

    알맞게 정렬됩니다

    Toggle : 껐다 켰다 하다

    Soft : 킬링 미 부드럽게

    Wrap : 감싸다, 비트 주세요
  4. lovejun
    완료
  5. 민새로이
    완료!!
  6. 화이트워커
    3.22 완료
  7. 김집사
    완료 화이팅
  8. 돌멩이
    2020 03 19
    완료
  9. Song.Paul
    위쪽 메뉴 바에서 View -> Toqqle Tree View 선택 하시면 됩니다
    단축키는 ctrl + k 입니다
    대화보기
    • 하나로야
      완료
    • khi0211
      완료
    • coorrdding
      이거 왼쪽의 project부분을 닫아버렸는데 어떻게 다시 여나요? 아시면 답글좀 달아주세요ㅠㅠ
    • MINTO
      3.15 완료
    • 아이야
      감사합니다. 다만 본문에 올려주신 1html 소스코드 리스트에 href 연결이 잘못 되어있는 것 같아요. 순서대로 "1.html", "2.html", "3.html"이 되어야 하지 않나요? 다른건 다 이대로 되어있어서요^^
    • OneJae EE
      20.03.12 목 / 37세 비전공자 / 완료 / 힌트없이 결과물만 보고 스스로 시도 후 완성까지 40분.
    • 아롱범
      생활코딩님과 함께 공부하면 개발의 참맛을 알수있네요 ㅎㅎ
    • 단고구마
      따로 만들어 봤는데 링크를 누르면 404not found가 뜨는 이유가 뭘까요?
    • 완료
    • 수성구코딩유망쥬
      완료
    • YOUNG
      완료
    • 이혜원
      완료!
    • login
      서버가 필요해서 우리는 아직 웹사이트가 아닌 코드를 가진 사이트를 만들고 있습니다.
    • lilyri
      완료
    • flytodk
      complete
    • asdzxc1822@naver.com
      감사합니다.
    • 우뿌
      가즈아!!
    • 감사감사
      왼쪽 project 코너처럼 파일 목록을 볼 수 있도록 하는 건 어떻게 하나요?ㅠㅠ
    • 코딩의 마술사
      Thanks!
    • Yohanesty
      완료
    • 짱아찌
      완료
    • Horang
      뿌덧
    • 승현
    • Pleasure of Learning
      감사합니다.
    • 정해영
      감사합니다!
    • 완료. 감사합니다.
    • 강냉
      완료입니다 감사합니다
    • 감사합니다!
    • 완료
    • 차츠
      감사합니다.
    • 갑사합니다!
      대화보기
      • 익명의답변자
        File - Add Project Folder (저는 Ctrl + Shift + A 입니다)
        대화보기
        • 왼쪽에뜨는 project창은 어떻게 실행하나요?
        • 완료
          규몽
        • 정말 감사합니다.!!
        • 김시은
          하다가 웹브라우저 창을 실수로 닫았는데,(코드는 모두 그대로 저장되어 있습니다!) 다시 열려고 하니 원격 프로시저를 호출하지 못했습니다 라는 문구만 계속해서 뜨네요ㅠㅠ 어떻게해야 제가 쓴 코드를 브라우저에서 다시 볼 수 있나요..? 한 번 나가면 볼 수가 없는 건가요..?ㅜㅜ
        • 뉴빈
          차근차근하니까 되네요! 감사합니다~
        • 김진현
          완료
        • 이도엽
          완료
        • 눈누난나
          완료
          보람있네요
        • 이고잉이고잉이고양잉님
          하하하하하핫!!! 이고잉님 감사합니다.
        버전 관리
        egoing
        현재 버전
        선택 버전
        graphittie 자세히 보기