블로그 위해 알아야 할 HTML,CSS,JAVASCRIPT,JQUERY 지식은?

2020. 6. 29. 07:00

블로그는 하나의 웹서비스이다. 그 안에는 여러가지 웹기술이 들어가 있다. 그냥 단순히 포스팅을 하고 다른 사람들과 교류하기 위해서라면, 위와 같은 웹기술을 알 필요는 없다. 하지만, 블로그를 통해 다양한 서비스를 제공하고, 더 자신의 입맛에 맞게 운영하려면 웹기술에 대해 조금은 알고 있는 것이 좋다.

오늘은 블로그 위해 알아야 할 HTML,CSS,JAVASCRIPT,JQUERY 지식에 대해서 알아보도록 하겠다.


웹페이지_언어


국내에서 가장 많이 하는 블로그는 네이버와 티스토리가 있다. 네이버는 포스팅을 하고, 다른 사람들과 교류하기가 좋다. 네이버 검색을 통한 페이지 유입도 많다. 하지만, 광장히 폐쇄적인 블로그이기 때문에 블로그를 내 입맛에 맞게 수정하기가 어렵다. HTML, CSS, JAVASCRIPT, JQUERY 등도 네이버 블로그에서는 사용할 수가 없다. 

티스토리는 네이버 블로그에 비해 자유도가 높다. 위에서 언급한 웹기술도 입맛에 맞게 사용이 가능하다. 하지만, 구글이나 다음 검색을 통한 유입이 주채널이라 블로그 운영이 쉽지 않다. 하지만, 단순 포스팅외에 블로그를 통해 다양한 활동을 하고 싶다면 티스토리 블로그도 좋다. ( 참고로 애드센스는 네이버 블로그에서는 사용이 불가능하다. )


타스토리_블로그

( 여러가지 웹기술들을 적용해 볼 수 있다 )


그럼 위에서 언급한 내용등를 하나씩 다뤄보자.


HTML은 Hyper Text Markup Languate의 약자이다. HTML은 웹페이지를 보여주는 언어이다. Hyper Text는 이동이 자유롭다는 뜻이다. 링크를 통해 다른 페이지를 마음대로 이동할 수 있는 특징을 말한다. Markup은 태그로 이루어진 언어를 말한다. 문서의 서식이나 기능들을 명시하는 것을 태그로 한다. 태그는 <태그명>~</태그명>으로 이루어져 있다.


CSS는 HTML서식을 지정하는 언어이다. 태그를 이용해서 개별로 서식을 지정할 수 있지만, 관리하기도 어렵고 코드도 지저분해진다. CSS는 미리 서식을 지정하고, 어떤 영역에 서식을 사용할지만 선택하면 된다. 서식을 사용할 영역을 선택하기 위해 클래스 선택자나 아이디 선택자를 이용한다. 여러 곳에 적용할 서식에는 클래스 선택자, 개별로 적용할 때는 아이디 선택자를 이용한다.


JAVA SCRIPT는 프론트 앤드 개발 언어이다. 프론트 엔드란 웹서버가 아니라 웹브라우저에서 처리가 발생하는 것을 말한다. 동적으로 변화하는 웹페이지를 보여주기 위해서, 자바스크립트를 많이 이용한다. 제이쿼리(JQuery), 앵귤러(Angular) JS, 리액트(React) JS, 노드(Node) JS, 폰갭(PhoneGap) 등 자바스크립트로 제작된 다양한 라이브러리가 등장하면서, 사용성이 더 커지고 있다.

codepen.io에서 다양한 자바스크립트 예제들을 확인할 수 있다.
( 참조: codepen.io 바로가기 )


JQuery는 자바 스크립트 함수들을 모아 놓은 라이브러리이다. JQuery를 이용하면 쉽고 편리하게 애니메이션과 다양한 효과를 구현할 수 있다. 함수형태로 되어 있기 때문에, 필요한 함수만 호출하면 쉽게 구현할 수 있다. 하지만, 아직 티스토리 블로그에서 유용하게 사용할 만한 내용은 발견하지 못했다. 이미지 슬라이드 정도가 해 볼만한 것 같다.


웹페이지_기술


이 외에도 Ajax(Asynchronouse JavaScrip and XML)을 이용하면, API를 호출하는 것도 가능하다. 

댓글()
  1. Favicon of https://stonegarden.tistory.com BlogIcon 미미남편돌마당 2020.06.29 11:22 신고 댓글주소  수정/삭제  댓글쓰기

    자세한 정보 감사해요~^^ 잘보고갑니다

  2. Favicon of https://pig-cola.tistory.com BlogIcon Pig_CoLa 2020.07.01 09:53 신고 댓글주소  수정/삭제  댓글쓰기

    들려주셔서 감사합니다..!
    아직 html과 css를 막 시작하는 사람입니다 ㅠㅠ
    자주 들리며 여러 지식좀 훔쳐가겠습니다!!

  3. Favicon of https://iziscience.tistory.com BlogIcon 12세 토토 2020.07.11 22:39 신고 댓글주소  수정/삭제  댓글쓰기

    글의 내용이 좋네요 잘 봤습니다

  4. 알 수 없는 사용자 2020.10.23 16:11 댓글주소  수정/삭제  댓글쓰기

    티스토리 블로그가 좋긴한데 유입이 약하긴해요 그래도 HTML배워서 좀 꾸며보고 싶은 마음 드네용~ 글 잘봤습니다!

    • Favicon of https://tariat.tistory.com BlogIcon ✑ 테리엇 2020.10.24 10:47 신고 댓글주소  수정/삭제

      유입이 약해서 힘들기는 합니다. 그래도 HTML로 꾸미는 재미는 확실히 있습니다. JAVASCRIPT도 배우시면 더 자유도가 높아집니다 ㅎ

  5. Favicon of https://happysisyphe.tistory.com BlogIcon 행복한 시지프 2021.03.14 14:22 신고 댓글주소  수정/삭제  댓글쓰기

    네이버에서 javascript를 사용하고 싶었는데,, 역시나 지원이 안되는군요. 허허