셀퍼:SELFER

지난 번 포스팅에서 html 정의에 이어 오늘은 html5와 css3라는 기술을 왜 배워야 하는지 그리고 어디에 어떻게 활용할 수 있는지 알아보도록 하겠습니다. 앞서 html5와 css3는 최신 기술(업데이트 버전)로 생각하시면 됩니다.

html5와 css3를 배워야 하는 이유는 무엇일까?

필자는 최근 회사에서 웹 디자인 관련 기획을 짜던 도중 스마트폰, 태블릿, 웹사이트에 따라 통일성을 가지기 위해 많은 고민들을 해야 한다는 것을 알게 되었습니다. 사용자에게 내용을 전달하기 위해서는 여러 기기로 접속을 하든 수 많은 레이아웃이 맞춰야 한다는 것이죠 즉,모든 기기에서 지킬 수 있는 웹 표준 html5이 필요하며 접속 기기에 따라 사이트 레이아웃들이 바뀔 수 있도록하는 css3가 필요합니다.

조금 더 쉽게 이야기를 드리자면 이러한 기술은 흔히 "반응형 홈페이지"라고 합니다. 또한 앱 화면을 보여주는 정보들도 html 과 css로 제작하기에 필수적으로 배워야 하는 기술이 되었습니다. 디자이너 분들도 단순 이미지를 제작하는 것 뿐만 아니라 html5와 css3는 기본적으로 활용할 수 있어야 합니다. 필자가 있는 회사에서 웹 개발 업무가 있어 페이지 디자인을 보냈더니 웹 개발자 분들은 디자이너 분들이 html코딩 작업을 안 해 주면 일의 속도가 늦춰진다..기획 의도를 알 수 없다.. 코딩 작업을 해주시지 않으면 페이를 더 받겠다고 했습니다. (잠깐.. 일에 대해 푸념을..)

* 소소한 팁 / 네이티브앱을 아시나요?"

개발자 분께서 이번 모바일 페이지는 앱이 아닌 네이티브앱으로 진행하시죠. 라고 말씀하시는데... 무슨 의미인지 몰라 여쭤봤더니 html5를 이용해서 모바일 운영체제(IOS, 안드로이드)로 각각 모바일용 앱을 만드는 것을 의미합니다.

웹 서비스 업무를 해야 하는 직원이 비워 있어.. 임시로 일을 하고 있지만 모르는 단어가 80% 이상이기에 정말 html공부에 필요성을 간절하게 느낀답니다.

필자의 블로그도 기기에 따라 레이아웃이 달라지는 것을 확인할 수 있습니다. 이렇게 모아두고 보니 고쳐야 할 곳이 여럿 보입니다.

어디에 어떻게 활용 할 수 있을까?

01. 웹 사이트를 쉽게 제작하고 소스를 넣을 수 있다.

예전에 플러그인 설치란 단어를 많이 들어보셨을 겁니다. 어떠한 화면을 보여주거나 효과를 보여주기 위해선 플러그인을 설치해야 그 웹 사이트에서 보여주고자 하는 영상들이나 이미지들이 움직였지만.  이제는 html5와 css3만으로도 인터랙티브한 사이트를 제작 할 수 있습니다. 또한 사이트 내부에 프로그램을 제작하지 않더라도 태그를 이용하여 쉽게 제작 할 수 있기 때문에. 기본적으로 코딩을 배우신다면 홈페이지를 쉽게 제작할 수 있습니다.

▲플러그인 오류 화면▲

02. 티스토리 블로그를 수정하기 쉽습니다!

필자와 같이 티스토리 블로그를 운영하고 계신다면 버튼 이미지, 메인 페이지 컬러 등 겉 모습을 다양하게 꾸미실 수 있습니다. 그렇지만 티스토리 디자인 원작자가 만든 소스를 전부 파악하고 작업해야 하기에 초급자 분들에겐 조금 힘든 부분입니다. 그렇지만 기본적인 코딩만 알아도 글씨 크기나, 구글 애드센스나 배너 위치를 잡을 수 있기에 편리한 건 사실입니다.

▲티스토리는 html편집을 직접 할 수 있습니다▲