1. 웹 기획하기
저는 생활코딩의 WEB 강의를 들으며 공부했습니다. 이 강의를 따라가기 위해선 제가 무슨 웹을 만들 건지에 대한 기획이 먼저 되었어야 했습니다. 그래서 소융대 고문위원장 최인열 선배님께서 저희 학생회에게 작성한 글을 바탕으로 웹을 기획해 제작하기로 했습니다.
처음에 배우는 것은 쉽지만 중요합니다. 가장 자주 사용되는 부품이면서, 그 부품을 결합해서 새로운 완제품을 만들어 내는 결합방법이기 때문입니다.
2. 웹을 효율적으로 공부하는 방법
웹을 다스리는 가장 중요한 공식인 태그의 존재를 안 것이 웹 공부의 시작이자 절반은 한 것이라고 생각합니다. 그 외의 것들은 제가 배우고자 하는 웹이 제공하는 검색엔진이라는 도구를 통해 메꾸며 공부해 나가겠습니다.
물론 어느 정도의 태그를 외우는 것은 효율을 높이는 좋은 방법이라고 생각합니다. 그렇다면 어떤 태그를 외워야 할까요? 이 막막함을 우리는 통계 자료를 통해 뚫을 수 있습니다.
https://www.advancedwebranking.com/seo/html-study/
구글에서는 전 세계의 웹페이지를 분석해 웹페이지들이 어떤 태그, 몇 종류의 태그로 이루어져 있는지를 보여주고 있는데, 이 통계에 근거하여 순위권에 있는 태그들에 대해선 숙지해 놓는 편이 좋을 것 같습니다.
3. 웹 공부하는 데에 있어서 중요한 것
제 생각에 가장 중요한 태그는 링크 태그입니다. 이 태그를 통해야만 여러 웹페이지들을 한 곳에 모아 웹사이트를 만들 수 있습니다. 이렇게 만들어진 웹사이트를 인터넷을 사용할 수 있는 사람이라면 전 세계의 누구든 접할 수 있도록 하려면 웹서버를 이용해야 하는데 제 공부의 목적은 웹서버를 배우는 것은 아니기에 'Github'이 제공하는 웹호스팅 기능을 이용하였습니다.
그 외 넣고자 하는 기능들은 다른 페이지에서 소스코드를 따와 제 웹페이지에 삽입하였는데, 이 과정에선 코드의 힘을 다시금 느낄 수 있었습니다. 또한 웹페이지를 보다 보기 편하게 만들도록 하기위해 CSS에 대해서도 배웠는데 이 과정에서 알게된 것은 검색도 능력이라는 것입니다.
웹의 근간인 HTML을 잘 사용하면 검색엔진에 잘 노출될 수 있기에 비즈니스적인 측면에서도 중요하지만 시각장애인들의 웹서핑 도구, 즉 정보를 청각화해서 전하는 스크린리더와 같은 프로그램이 존재하고, 존재해야만 하기에 휴머니즘적인 측면에서도 중요합니다.
과정
- 'Visual Studio Code' 에디터 실행
- 폴더 생성 및 열기
- .html 파일 생성
- 코딩
- 'Github' 웹호스팅 업체 이용
참고 사항
- Live Server를 에디터의 확장 기능을 이용해 추가하면 새로고침을 하지 않고도 코드를 ctrl+S 등을 이용해 저장한 결과가 바로 웹페이지 화면에 뜸.
- 마우스 오른쪽을 누른 후 '페이지 소스 보기' 혹은 '검사'를 클릭하여 보고자 하는 웹사이트가 어떤 코드로 이루어져 있는지 볼 수 있음.
- 댓글 기능 : disqus, 채팅 기능 : TAWK, 방문자 분석 기능 : google 애널리틱스
