ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 생활코딩 WEB1 - HTML & Internet
    Web/Web 2018. 10. 9. 16:53

    생활코딩 WEB1 - HTML & Internet

    웹의 개념을 잡기 위해서 생활코딩 이고잉씨의 강의를 들었다.

    https://opentutorials.org/course/3084 

    위의 홈페이지 내용이 알차다.

    한 챕터당 강의시간은 8분~13분정도로 이동시 듣기에도 부담이 없다.

    목소리도 참 좋으시고 팬될듯


    통계에 기반한 학습

    현재 전세계에 150개 이상의 태그가 있지만 제일 많이 쓰는 태그는 25개 정도이다.


    줄바꿈

    <br>태그와 <p>태그가 있다.

    <br>의 특징은 닫는 태그가 없고 중복사용이 가능하다.

    <p>태그는 닫는 태그가 필요하다.

    css에서 여백을 나타내는 <p style="margin-top:40px;"> 등의 코드가 있다.


    html이 중요한 이유

    검색엔진은 웹페이지를 다운받아 html코드를 분석한다.

    제목과 내용을 태그를 근거로 정리한다. 

    이에 따라 <h1>태그 안에 내용을 넣는지 다른곳에 내용을 넣는지에 따라 노출빈도가 다르다.

    이미지 글도 검색엔진에는 존재하지 않기에 큰 손실을 준다.

    웹페이지 소스코드는 누구나  볼수 있고 저작권이 없는 순수한 공공재이다.

    accessibility- 신체적인 장애가 있는 사람들도 정보로부터 소외되지 않도록 노력해야 한다.


    최후의 문법 속성

    속성 attribute

    속성은 위치는 상관이 없다.

    tag이름만으로 정보가 부족할땐 더 많은 의미를 부과 할 수 있다.


    부모 자식과 목록

    <li> 리스트 

    <ul> 리스트의 부모

    ul을 ol로 변경시 자동 넘버링이 된다.

    ordered List

    Unordered LIst


    문서의 구조와 슈퍼스타들

    정보가 많아짐에 따라 정보를 정리하기위한 구조가 필요하기에 구조 만드는 방법을 살펴본다.

    <title> 제목설정

    <meta charset="utf-8"> 리로드시 한글 로딩됨

    title meta 둘다 본문을 설명하는 방식.


    html을 만드는 사람들은 본문을 <body>로 묶기로약속

    body를 설명하는 코드는 head로 묶기로 했다.

    바디와 헤드를 감싸는 최고 코드는 html이다.

    html을 감싸는 것은 <!doctype html>이라고 써주면 된다.


    테그의 제왕

    <a> 닻을 뜻함

    링크걸고싶은곳을 <a>태그로 감싸면 된다.

    <a href="링크" target="_blank">새 테크로 열리는것

    title="html5 speicification"> 마우스 올렸을때 설명


    웹사이트의 완성

    link를 길로 비유 했지만 실이라고 비유도 가능하다.

    index.html파일로 이동


    원시앱

    지도없이 여행하는 기분이 들거에요.

    하나의 가설이 있다. 웹의 역사를 거슬러 올라가

    웹이 처음 생겼을때를 생각한다면 본질이 나올것이다.

    30년의 시간동안 인터넷은 천천히 확성된다.

    웹의 시작은 스위스 이다. 


    서버와 클라이언트

    하나는 웹브라우져, 하나는 웹서버

    두개는 인터넷으로 연결되어 있다.

    클라이언트가 서버에 요청(request)을 하면 서버에선 응답(response)을 한다.

    웹서버에는 파일이 저장되어 있다.


    웹호스팅

    컴터가 있어야 하며 컴이 항상 켜져 있어야 웹서버가능

    웹호스팅 업체를 많이 사용한다.

    깃허브

    static web hosting


    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

    <script>

      (adsbygoogle = window.adsbygoogle || []).push({

        google_ad_client: "ca-pub-8173708222709538",

        enable_page_level_ads: true

      });

    </script>



    반응형

    'Web > Web' 카테고리의 다른 글

    [web] GET과 POST란?  (0) 2019.07.09
    [web] Servlet이란?  (0) 2019.07.08
    [web] 이클립스 톰캣 서버 환경설정  (0) 2019.07.08
    HTTP란?  (0) 2018.10.12
    Disqus 디스커스 사용방법  (4) 2018.10.10

    댓글

Designed by Tistory.