노마드코더에서 코코아톡 클론코딩을 시작했다.
모션그래픽에도 시간을 쓰고 싶고 지브러쉬도 더 써보고 싶고 마블러스 디자이너도 이 기회에 배워보고 싶어서 이걸 이번 학기에 시작해도 되나? 다른 과제들을 하면서 마무리할 수 있을까? 망설이던 차에 COVID-19 경보 단계가 레드로 격상되면서 학교 컴퓨터에 액세스가 없어도 할 수 있는 코딩을 하기로 결정했다.

사실 HTML/CSS는 자체는 낯설지 않다. 자바스크립트도과 파이썬 syntax도 배운 적이 있다. 그러나 항상 거기서부터 진척이 없었다. 문법을 배워도 써먹지를 못했다. 어떻게 쓸 수 있을지, 무엇을 어떻게 얼마나 해야하는지 감이 잡히지 않았고, 당장 해야할 일들에 치여서 결국 아무것도 하지 않았다. 하지만 모든 언어가 그렇듯, 문법은 주구장창 배우는데 말도 못하고 쓰지도 못하고 듣지도 못한다면 문법이 무슨 소용인가? 배우는 것이 무엇이든 이 벽을 넘는 것은 쉽지가 않은데 코딩은 특히 더 그랬다. 충분한 시간을 쓰는 게 그렇게 어려웠다.

그렇게 처음부터 다시 시작,
HTML/CSS 강의를 듣는 건 기초부터 다시 듣는 건 이번이 마지막이 돼야 할 것이다. 2021년 1분기 나의 주력 공부는 모션 그래픽, 캐릭터 디자인, 코딩, 영어. 현재를 보람있게 보내자!

NOTE

• Tip. 코드를 검색할 때는 뒤에 MDN(Mozilla Development Network)을 붙여서 검색하기. W3Schools도 MDN을 참고한 것이다.

# head 태그 안 메타데이터들

• 탭 아이콘 설정:

  <link rel="shortcut icon" sizes="16x16 32x32 64x64" href="logo.png" />

• 카카오톡 등 타 플랫폼으로 링크를 전송했을 때 뜨는 타이틀, 이미지, 설명 등 설정하는 태그:

  <meta property="og:" />

# Keyword: Content Sectioning

• Semantic Tag
  : body 태그 안에 들어가 div 태그와 같은 구획을 나눠주는 역할을 하지만 보다 구체적인 특성을 부여함으로써 document와 content를 명확하고 깔끔하게 묘사하고, 그럼으로써 다른 팀원이나 검색엔진 등이 내용을 효과적으로 파악할 수 있게 해준다. 되도록이면 semantic tag를 잘 활용할 수 있도록 하기.

  <header>
   <main>
   <footer>

• Non-semantic tage

    <div>
     <span> for short text
     <p> for paragraps