본문 바로가기
IV. 정보기술학 (IT)/1. 웹디자인 (Web Design)

[웹사이트제작] 호스팅과 도메인 워드프레스 테마와 플러그인

by hlee100 2022. 5. 30.
반응형

웹디자인을 시작하기 위해 알아야하는 가장 기본적인 개념 2가지가 도메인과 웹호스팅입니다. 오늘은 그 개념에 대해서 한번 알아보도록 하겠습니다.

 

쉽게 집을 짓는 예를 들어보겠습니다.

 

집을 짓기 위해서는 필요한 것이 우선 어디에 지을 에 대한 "우편주소"가 있어야겠지요? 그리고 두번째는 실제로 집을 지을 100평 실제 "땅"이 있어야 합니다.

 

여기에서 웹사이트가 집이라고 한다면, 웹사이트를 만들기 위해서는 웹사이트를 어디에 지을 지에 대한 "우편주소"를 '도메인'이라고 부릅니다. 도메인의 형식은 아주 익숙할텐데요. 몇 가지 예시를 들겠습니다.

 

도메인 예)

www.naver.com

www.google.com

www.facebook.com

www.daum.net

Etc.

 

그리고 다음으로 필요한 것은 실제로 집을 지을 땅입니다. 웹사이트를 만드는 공간을 마련하는 것을 '웹호스팅' 서비스라고 합니다.

 

이 2가지 중 하나만 없어도, 웹사이트는 정상적으로 작동하지 않습니다. 예를 들어, 도메인을 갖고 있지만, 웹호스팅이 없으면 땅도 없고, 결국 집도 존재하지 못하겠죠? 그래서 그 도메인으로 인터넷에 접속해도 찾을 수 없다고 뜹니다. 

 

반대로 도메인이 없고, 웹호스팅이 있다고 해도, 접속한 우편주소 자체가 없으니 웹사이트를 여는 자체가 안 되겠죠? 웹브라우져 주소창에 쓸 주소가 없기 때문입니다.

 

이 개념들을 도표로 정리해서 설명을 한다면 아래처럼 생각해볼 수 있습니다.

 

 

 

그래서 웹사이트 제작을 위해서는 가장 기본적인 도메인과 웹호스팅 2가지가 필요합니다. 하지만 도메인의 경우 유료입니다. 또한 한 도메인을 평생 소장할 수 없습니다. 연단위로 빌려서 쓰는 개념입니다. 웹호스팅도 마찬가지이죠. 웹호스팅을 하기 위한 호스팅 장비와 장치를 모두 개인이 만들기 어려우니, 웹호스팅 서비스를 해주는 회사들이 있습니다. 그리고 이 회사들에게 이용료를 주고 가상의 공간을 임대해서 쓰는 유료형식으로 진행이 됩니다.

 

앞서서 다 해보시겠지만, 우선 이론적인 개념을 먼저 이해하기 위해, 이 2가지 도메인과 웹호스팅이 다 갖춰졌다고 생각해봅시다. 집을 짓기 위해 '우편주소'와 '집 터'가 마련되면, 이제는 집을 지을 차례입니다.

 

이제는 집을 지어야 하는데, 집을 지을 '시공사'를 선택해야 합니다. 집을 짓는 시공사마다 각 장단점이 있기 마련이겠죠? 어떤 곳은 집의 유형이 적지만, 누수 없이 잘 지어주고, 어떤 곳은 유형이 많지만, 가격이 비싸고, 어떤 곳은 저렴하지만 여러 하자가 발견되기도 하는 등 가지각색일 것입니다. 마찬가지로 웹사이트를 만들기 위한 다양한 시공사, 즉 플랫폼이 존재합니다. WordPress, Wix, 그누보드 등 다양한 시공사들이 있습니다. 여러 시공사 중에 저희는 'WordPress(워드프레스)'라는 플랫폼을 사용할 예정입니다. 그 이유는 구현할 수 있는 자유도가 높고, 대부분의 무료사용이 가능하다는 장점이 있기 때문입니다.

 

자유도가 높은 이유는 있다가 설명하겠지만, 이 시공사에서는 수만가지의 시공장비들을 무료로 사용할 수 있습니다. 바로 플러그인을 각 웹사이트에 설치해야 다양하게 웹사이트를 만들어갈 수 있습니다.

 

오늘은 도메인, 웹호스팅, 워드프레스 개념을 이해하는 것이 목적이므로, 한 호스팅 회사(닷홈)에서 제공하는 무료 도메인, 무료 호스팅 서비스를 사용하여 실제로 웹사이트 기본 세팅을 해보려 합니다. 또 워드프레스를 설치해보는 것까지 해보려고 합니다.

 

 

 

 

 

저번에는 도메인, 웹호스팅, 워드프레스에 대해서 알아봤습니다. 오늘은 WordPress 안의 '테마'와 '플러그인'의 개념에 대해 이해해보고, 실제로 '엘레멘터(Elementor)'라는 플러그인을 직접 사용해볼 예정입니다. '테마'는 WordPress로 실제 집을 짓는데, 골조(뼈대)공사와 같은 개념입니다.  건축에서 골조,  뼈대를 무엇으로 만드는가에 따라 ‘건축구조’가 '철근콘크리트 주택', '목조주택', '스틸하우스' 등의 건축구조로 나뉩니다. 이와 같이 어떤 '테마'를 쓰느냐에 따라 웹사이트의 전체 프레임과 레이아웃이 좌우될 수 있습니다. 그 다음 필요한 '플러그인'을 설치하여, 웹사이트에 기능을 넣거나, 디자인을 수정합니다.

 

오늘은 기본 '테마'에 '엘레멘터'라는 플러그인을 사용해보는 시간을 갖도록 하겠습니다. 머리로 이해하기 보다는 직접 손으로 많이 만져보면서 익히는 것이 중요합니다. 영어를 배울 때도 마찬가지인 것 처럼, 문법이 한 번 머리로 이해되었다하여 바로 외국인 앞에서 응용하여 쓸 수 있는 것이 아닙니다. 그 문법이 이해된 예시들을 계속 발음하고 연습해서 필요 시 무의식적으로 '툭' 튀어나올 때, 진정 익혔다고 할 수 있는 것처럼, 웹디자인도 '이해'보다는 '연습'이 더욱 중요합니다.

 

우선 '테마'에 관련된 영상입니다. 테마를 워드프레스에 설치하기 위해서는 2가지 방법이 있습니다.

첫번째는 워드프레스를 통해서 그 안에 있는 테마를 검색하여 설치하는 방법이 있습니다.

두번째는 구글 등에서 검색하여 테마제작 회사 홈페이지에 들어가 테마를 다운받아 워드프레스에 업로드(Upload) & 임포트(Import)하여 설치하는 방법이 있습니다.

 

첫번째 방법은 워드프레스 안에서 모두 해결되기에 간편하다는 장점이 있지만, 테마의 종류에 제한이 있다는 단점이 있습니다.

두번째 방법은 온라인 상에서 검색하여 다운 및 임포트(Import)를 해야하기 때문에 첫번째 방법에 비해 복잡할 수 있지만, 테마의 종류 다양성의 제한이 무한이라는 장점이 있습니다.

 

 

워드프레스를 사용하다보면 다양한 테마를 사용하게 됩니다. 이 때 무료 테마도 있지만, 기능과 디자인이 제한적이라는 단점이 있습니다. 유료 테마는 비용이 든다는 단점이 있지만, 기능과 디자인 적 차원에서 다양성과 자유도가 매우 높다고 볼 수 있습니다.

 

다양한 유료 테마 중에 DIVI라는 브랜드의 테마 사용법을 알아보겠습니다. 아래 영상을 참조하세요.

 

 

 

www.youtube.com/watch?v=T-6k64sSx0M

 

반응형

댓글