자신의 웹 사이트를 만들기위한 필수 단계 : 3 가지 쉬운 방법, 단계별 가이드

작성자 : Jerry Low
  • 호스팅 가이드
  • 업데이트 : Oct 21, 2020

2020년에는 웹 사이트를 쉽게 만들 수 있습니다.

기술 괴짜이거나 프로그래머 일 필요는 없습니다.

올바른 방법을 따르십시오. 적합한 플랫폼을 선택하십시오. 올바른 도구를 사용하십시오. 웹사이트를 제작하는데 100 % 아무런 문제도 없으실 겁니다.

제가 2004년에 온라인 비즈니스를 처음 시작했을 때, 웹 개발에 대한 지식이 없었습니다. 저는 그 후로 XNUMX 년 후까지 웹 개발자를 고용하지 않았습니다. 웹 개발자를 고용하지 않고도 웹사이트 제작하는 데 아무런 문제가 없었습니다.

오늘날 우리는 혁신적인 개발 도구와 보다 나은 웹 게시 플랫폼을 갖추고 있습니다.

웹 사이트를 만드는 방법에는 세 가지가 있습니다.

  1. 처음부터 웹사이트 만들기
  2. 콘텐츠 관리 시스템 (CMS) 사용
  3. 웹 사이트 빌더 사용

방법 # 1을 사용하면 설계 및 사이트 기능에 더 많은 유연성을 얻을 수 있지만 웹 언어에 대한 충분한 지식이 필요합니다.

웹 사이트 생성 및 관리 프로세스는 방법 # 2 및 # 3을 사용하면 훨씬 더 쉽습니다. 능력에 따라 이러한 방법 중 하나를 선택해야합니다.

이 세 가지 방법과 아래의 모든 단계를 살펴 보겠습니다.

1. 도메인 등록

도메인은 귀하의 웹 사이트 이름입니다. 도메인은 고유한 도메인이어야 하며 비즈니스 브랜드를 전달해야합니다.

도메인을 검색하고 등록하는 가장 쉬운 방법은 도메인 등록 기관에 가는 것입니다.

도메인 등록 기관에서는 연간 계약 또는 장기 계약을 통해 도메인 이름을 등록할 수 있습니다.

도메인 등록 위치

다음은 유명한 도메인 등록 기관 및 시작 가격입니다.

등록 기관.com .net
123 등록£ 11.99 / 년£ 11 .99 / 년
Domain.com$ 9.99 / 년$ 10.99 / 년
Gandi€ 12.54 / 년€ 16.50 / 년
에서 GoDaddy$ 12.17 / 년$ 12.17 / 년
저렴한 도메인명$ 10.69 / 년$ 12.88 / 년
네트워크 솔루션$ 34.99 / 년$ 32.99 / 년

2. 웹 호스트 구입

웹 호스트는 여러분의 웹 사이트를 저장하는 거대한 컴퓨터 (일명, 서버)입니다. 아마존, IBM, 페이스북 같은 대기업들은 웹 서버를 소유하고 관리합니다. 다른 기업들은 단순히 호스팅 제공 업체로부터 서버를 대여합니다(이렇게 하면 훨씬 저렴하고 쉽죠).

참고 : 웹 사이트 빌더가 사이트를 생성하도록 선택한 경우이 단계를 건너 뛰십시오 (3 단계 참조).

호스팅에서 당신의 선택은 무엇입니까?

웹 호스팅은 오늘날 다양한 패키지로 제공됩니다. 

전통적으로 웹 호스팅 제공 업체는 기본 소프트웨어 및 기술 지원을 통해 서버를 임대하는 데만 관여합니다. 기존 호스팅 제공 업체를 통해 웹 사이트를 호스팅하는 것이 일반적으로 더 저렴하고 유연합니다. 하지만 웹 사이트를 설정하려면 약간의 추가 작업이 필요합니다.

오늘날 기업들은 서로 다른 서비스를 함께 묶어 사용자가 하나의 서비스 제공 업체에서 웹 사이트를 구축, 호스팅 및 관리 할 수 ​​있도록합니다. 우리는 일반적으로 이러한 회사를 웹 사이트 빌더 또는 온라인 스토어 빌더라고 부릅니다. 이러한 "번들"플랫폼에서 웹 사이트를 호스팅하는 것은 일반적으로 비용이 많이 들고 덜 유연합니다. 하지만 웹 사이트 나 온라인 스토어를 쉽게 구축 할 수 있습니다.

일정 금액을 지급하고 초보자도 쉽게 이용할 수 있는 일부 호스팅 서비스.

웹 호스트회원 가입비고
A2 호스팅$ 4.90 / 월빠른 웹 호스트 서비스, 초보자도 쉽게 이용 가능.
BlueHost는$ 3.95 / 월저렴한 등록 비용, 초보자도 쉽게 이용 가능.
Hostgator Cloud$ 8.95 / 월합리적인 가격, 안정적인 서버.
HostPapa$ 3.36 / 월친환경 웹 호스트, 독점 할인.
인모 션 (InMotion) 호스팅$ 3.49 / 월저렴한 등록 비용, 신뢰할 수 있는 서버.
SiteGround$ 5.95 / 월업계 #1 라이브 채팅 지원, 견고한 웹 호스트.

  • 사용 가능한 호스팅에는 공유 호스팅, 전용 서버 호스팅 및 클라우드 / VPS 호스팅이 있습니다.
  • 작은 웹 사이트 인 경우 공유 호스팅 계획을 사용하는 것이 더 저렴합니다. 클라우드 또는 전용 호스팅을 사용하려면 더 큰 사이트를 사용하는 것이 좋습니다.
  • 웹 호스트를 선택하기 전에 고려해야 할 몇 가지 주요 특성은 가격, 서버 속도 및 가동 시간 비율입니다. 
  • 현재까지 우리는 60 호스팅 회사 이상의 등록, 테스트 및 검토를 마쳤습니다. 우리를 보아라. 최고의 10 호스팅 선택 or 호스팅 리뷰의 전체 목록.
  • 다음과 같은 상점 빌더 사용을 고려하십시오. Shopify or BigCommerce 웹 사이트에서 직접 제품을 판매하려는 경우.
  • 또한 읽기 - 귀하의 웹 호스트에 대해 지불 할 금액

3. 웹 페이지 디자인

도메인 이름과 웹 호스팅이 준비되면 소매를 걷어 올리고 생성을 시작할 때입니다! 웹 페이지를 디자인하고 만들려면 웹 개발자를 고용하거나 직접 할 수 있습니다.

자세히 논의합니다 여기에서 웹 개발 작업을 아웃소싱하는 방법. 웹 사이트를 개발할 사람을 고용 할 계획이라면 다음 단계를 건너 뛰고 해당 페이지로 이동해야합니다.

DIYers를 위해 웹 페이지를 디자인하는 세 가지 쉬운 방법은 다음과 같습니다.

1번째 방법 : 처음부터 웹 사이트 만들기

필요한 기술 및 도구

주요 웹 언어와 웹 사이트의 기본 사항을 알고 있다면 자신만의 독창적인 웹 사이트를 만들 수 있습니다.

그렇지 않으면, 2번 방법/ 3번 방법으로 건너 뛰는 것이 좋습니다. 혹은 웹 개발자를 찾아보세요.

알아두어야 하는 기본적인 웹 언어 / 도구:

  • HTML (Hyper Text Markup Language)
    HTML은 웹 페이지와 웹 응용 프로그램의 기본 구조로, 웹 브라우저에 의미있는 콘텐츠를 만듭니다. 열고 닫을 수 있는 순차적 태그와 꺾쇠 괄호로 묶인 키워드로 구성됩니다. 예 : <strong><!-- strong--></strong>
  • CSS (Cascading Style Sheets)
    CSS는 웹 페이지의 HTML 마크 업을 장식하는 데 사용되는 스타일 언어입니다. CSS가 없으면 웹 페이지는 정렬되지 않은 텍스트와 이미지가 있는 흰색 배경의 페이지밖에 보이지 않을 것입니다. CSS는 페이지를 우리가 원하는 이상적인 방식으로 만드는 것입니다.
  • 스크립팅 언어
    HTML과 CSS는 인터랙티브하지 않기 때문에 스크립크 언어가 없으면 아무 것도 아닙니다. 사용자에게 반응하는 다이나믹한 웹 페이지를 만들려면 JavaScript 및 jQuery와 같은 언어가 필요합니다. PHP, Python 및 Ruby와 같은 서버 측 언어 또한 시간이 지남에 따라 필요할 수 있습니다.
  • 데이터베이스 관리
    웹 사이트의 사용자가 입력한 데이터를 저장, 관리 및 액세스하려면, 데이터베이스라는 거대한 정보의 표가 고려됩니다. MySQL, MongoDB 및 PostgreSQL과 같은 데이터베이스 관리 시스템은 서버 측에서 이 작업을 효율적으로 수행하는 데 사용됩니다.
  • FTP (파일 전송 프로토콜)
    FTP는 웹 사이트의 소스 파일을 호스팅 된 서버로보다 쉽게 ​​전송하는 데 사용됩니다. 서버 컴퓨터에 파일을 업로드하는 데 사용될 수 있는 웹 기반 및 소프트웨어 기반의 FTP 클라이언트가 있습니다.

IDE를 사용한 단계별 웹 사이트 제작 과정

위에서 언급한 기본 웹 언어 및 웹 사이트 필수 사항을 알고 있다고 가정하고 직접 웹 사이트를 만드는 방법에 대한 개요를 보여 드리겠습니다.

1 단계 : 로컬 작업 환경 설정 

Subline Text 작업 환경 스크린샷.

웹 사이트의 소스 파일을 만들고 구성하려면 좋은 로컬 작업 환경이 중요합니다. IDE (Integrated Development Environment)를 설치하여 컴퓨터 장치에서 웹 개발 환경을 만들 수 있습니다. IDE는 기본적으로 텍스트 편집기, 빌드 자동화 및 디버거로 구성됩니다.

서브라임 텍스트(Sublime Text)Atom은 HTML, CSS, JS, PHP, Python 및 유사한 웹 언어를 지원하는 웹 개발용 기본 IDE 중 일부입니다.

반면에 IDE와 같은 확장 된 IDE가 있습니다. 어도비 드림위버 몇 가지 다른 기능 (예 : 서버 연결, FTP)을 제공합니다.


2단계 : Adobe Photoshop을 사용하여 웹 사이트 계획 및 디자인

계획 웹 사이트 구조 및 탐색 시스템은 중요합니다. 먼저, 콘텐츠를 전달하려는 방식을 이해해야합니다. 탐색 메뉴 수, 열 또는 내용 입력란 수, 포함할 이미지 수 및 위치를 계획하십시오.

가장 좋은 방법은 Adobe Photoshop을 열고 웹 페이지의 대략적인 그림을 만드는 것입니다. 홈페이지, 페이지, 연락처 페이지, 서비스 페이지 등과 같이 다른 페이지에 대해 대략적인 그림을 구상해야할 수도 있습니다.

예 – 2016 년 XNUMX 월 사이트 개편 중에 수행 한 디자인 모형.

3단계: HTML 및 CSS를 사용하여 디자인을 코딩합니다

Adobe Photoshop에서 웹 페이지의 대략적인 디자인을 마친 후에는 소스 코드 작성을 시작할 수 있습니다.

이 부분은 가장 쉬운 부분입니다. 포함하려는 웹 요소에 대해 HTML 마크 업을 만들고 CSS를 사용하여 디자인에 따라 꾸미십시오.


4단계 : JavaScript와 jQuery를 사용하여 웹사이트를 다이나믹하게 만들기

HTML 및 CSS를 통해 프런트 엔드 사용자 상호 작용을 제어 할 수 없기 때문에 HTML 및 CSS 기반 웹 사이트 만 존재하지 않습니다.

JavaScript와 같은 스크립크 언어와 개선된 라이브러리인 jQuery를 사용하여 양식, 로그인, 슬라이더, 메뉴 또는 원하는 곳의 사용자 활동을 제어 할 수 있습니다.


5 단계 : FTP 클라이언트를 사용하여 로컬 파일을 서버에 업로드합니다

마지막 단계는 모든 소스 파일을 웹 서버에 업로드하는 것입니다. 이 단계를 진행하는 가장 쉬운 방법은 FTP 클라이언트를 사용하는 것입니다.

먼저 컴퓨터 장치에 FTP 클라이언트를 다운로드하고 FTP 계정을 사용하여 웹 서버에 연결하십시오. FTP 계정에 성공적으로 연결 한 후, 모든 로컬 파일을 웹 디렉토리의 루트에 복사하십시오. 좋은 FTP 클라이언트는FileZilla, WinSCPCyber​​duck입니다.

#2단계 : CMS로 웹 사이트 만들기

필요한 기술 및 도구

  • 관련 지식 : 컴퓨터와 인터넷의 기본 운영; HTML, CSS 및 PHP (필수 사항은 아니지만 기본 사항을 알고있는 경우 더 좋습니다)
  • 툴 : 워드 프레스, 줌라Drupal

CMS 또는 컨텐츠 관리 시스템은 초보자부터 숙련된 웹 개발자에게 적합하도록 전략적으로 구축되었습니다.

온라인 콘텐츠를 쉽게 만들고 관리할 수있게 해주는 소프트웨어 응용 프로그램입니다. 대부분은 오픈 소스이며 자유롭게 사용할 수 있습니다.

HTML, CSS 또는 PHP의 기본 사항을 알고 있다면 장점이 될 수 있습니다. 이러한 플랫폼은 매우 직관적이기 때문에, 기본 사항을 모른다고 해도 큰 문제는 아닙니다. 다음 내용은 필요에 따라 선택할 수 있는 CMS 플랫폼의 무료 선택 사항 TOP XNUMX입니다.

간단한 비교

Features워드 프레스줌라Drupal
비용무료무료무료
사용량311,682백만26,474백만31,216백만
무료 테마4,000개 이상1,000개 이상2,000개 이상
무료 플러그인45,000개 이상7,000개 이상34,000개 이상

또한 CMS TOP 3 비교 (2018년) - 워드프레스 vs 줌라 vs 드루팔을 읽어보세요.

워드 프레스

워드프로세스는 다양한 통계에 따르면 가장 많은 블로그와 중소 규모 웹 사이트에서 사용되고 있습니다. 그럼에도 불구하고, 많은 대규모 웹 사이트는 워드프로세스의 단순성을 선호합니다. WYSIWYG Editor는 첫 번째 콘텐츠를 작성하기 위해 배워야하는 유일한 것입니다.

이 플랫폼은 초보자를 위한 툴일 뿐만 아니라 다양한 레벨의 웹 개발자들이 많이 개발할 수 있는 툴입니다. 이 플랫폼에는 자체 저장소에 많은 무료 플러그인과 테마를 보유하고 있습니다. #1 CMS를 선택하면 많은 타사 리소스를 사용할 수 있습니다.

WordPress 테마의 선택.

장점

  • 융통성이 뛰어나고 사용자 정의 가능
  • 이용하기 쉬움
  • 수많은 학습 자료
  • 우수한 커뮤니티 및 지원

단점

  • 주요한 시각적 사용자 정의를 위한 코드 필요
  • 업데이트로 인해 플러그인 관련 문제가 발생할 수 있습니다.

자세히 알아보기

줌라

Joomla는 워드프로세스와 여러 면에서 유사합니다. 사용하기 쉽고, 설치가 쉽고, 모듈을 사용하여 쉽게 확장 할 수 있습니다.- 워드프로세스 플러그인과 동등합니다. 결과적으로, Joomla는 초보자를 위한 차선책입니다.

그러나 초보자가 사용할 수 있는 옵션의 수가 많기 때문에 Joomla를 탐색하기가 더 어려워 질 수 있습니다. 왼쪽 메뉴 외에도 "제어판"로고 바로 위의 상단 바에 메뉴가 있습니다. 혼란을 피하기 위해 "컨텐츠", "사용자"및 "확장 기능"을 포함하여 왼쪽 및 위쪽 막대 메뉴의 항목 중 일부가 비슷하다는 점을 기억하시길 바랍니다.

WordPress와 마찬가지로 Joomla에는 사이트를 빠르게 독특한 모양으로 만들 수있는 몇 가지 스타일과 템플릿이 있습니다. 그러나 세 가지 콘텐츠 관리 시스템 중에서 Joomla는 소셜 네트워크를 만들 때 가장 쉬운 솔루션을 제공합니다. EasySocial 및 JomSocial과 같은 플랫폼을 사용하면 소셜 네트워킹 웹 사이트에서 단 몇 분 거리에 있습니다.

내부 Joomla 시스템.

장점

  • 기술적으로 보다 우수함
  • 일반적으로 웹사이트 성능이 보다 우수함
  • 기업 수준의 보안

단점

  • 모듈 유지하기 어려움
  • 절충적인 CMS - 워드프레스만큼 쉽지는 않지만 Drupal만큼 기술적으로 뛰어나지는 않습니다.

자세한 정보

Drupal

숙련된 웹 개발자는 Drupal이 가장 강력한 CMS임을 입증합니다.

그러나, Drupal은 사용하기가 가장 어렵습니다. 높은 융통성으로 인해, Drupal은 세계에서 두 번째로 많이 사용되는 CMS이지만 초보자들은 별로 좋아하지 않습니다. Drupal을 사용하여 "완전한" 웹 사이트를 성공적으로 구축하려면 좀 더 연습하시고 코딩의 기초를 배워야합니다. CMS를 사용하는 방법을 아는 것은 초보자에게 어려운 일입니다.

새로운 Drupal 설치 – Drupal의 복잡한 기능에도 불구하고 CMS는 단순하고 최소한의 인터페이스를 제공합니다.

장점

  • 쉽게 배울 수
  • 훌륭한 도움말 포털
  • 업데이트가 완벽하게 통합됩니다.
  • 더 많은 빌트인 옵션

단점

  • 시작 단계에서 가파른 학습 곡선 - 고급 사용자에게 권장

자세한 정보

WordPress를 사용한 단계별 웹 사이트 제작 프로세스

이 방법에서는 워드프레스를 예제로 사용합니다. 지금까지 여러분은 이미 웹 호스팅 계정 및 등록 된 도메인 이름을 가졌어야 했습니다.


1단계 : 웹 호스팅 패널에서 워드프레스 설치 프로그램 찾기

웹 호스팅 서비스에는 대개 워드프레스 및 기타 일반 플랫폼을 설치하기 위한 빠른 설치 프로그램이 있습니다.

웹 호스팅 계정에 로그인하여 설치 프로그램을 찾으십시오. 검색해야 할 인기있는 이름은 Softaculous, QuickInstall 또는 Fantastico입니다.

일부 호스팅 제공 업체 (예 : SiteGround) 사용자 대시 보드 (cPanel에 로그인 한 직후에 표시되는 화면)에 통합 설치 프로그램을 사용하십시오. 이 경우 'WordPress'가 포함 된 제목을 찾으십시오.

2단계 : 설치 프로그램을 통해 워드프레스 설치

Softaculous는 가장 널리 사용되는 자동 설치 프로그램이며 cPanel에 포함되어 있습니다. Softculous를 통해 설치하는 방법을 안내해드리겠습니다. 다른 설치 프로그램은 거의 동일합니다.

Softaculous를 클릭한 다음, WordPress에 '설치'를 클릭하여 설치를 시작하십시오.

여기서 중요한 부분이 나옵니다.

다음과 같이 옵션을 구성하고, 다른 필드를 기본 구성으로 두고(이 부분은 나중에 정렬할 것입니다) 설치를 클릭하십시오.

  • 프로토콜: http:// URL 버전을 설치할 것인지 http://www. URL 버전을 설치할 것인지 결정해야 합니다. 어떤 항목을 선택하든별로 차이가 없습니다. 기술적 관점에서, http : // www. 는 융통성과 쿠키 관리 측면에서 더 좋습니다. 유효한 SSL 인증서가 있고 WordPress를 설치하려면 http 대신 https를 선택하십시오.
  • 도메인 : 웹 사이트를 설치할 도메인을 선택하십시오.
  • 디렉토리 : 워드프레스 사이트를 설치할 위치를 지정하십시오. 루트 URL (예 : http://www.yourwebsite.com/)에 설치하려면, 이 부분을 비워 두십시오. 하위 URL(예 : http://www.yourwebsite.com/myblog/)에 추가하려면 필드에 디렉토리를 지정하십시오.
  • 관리자 계정 : 워드프레스 사이트에 로그인 할 때 사용할 사용자 이름, 비밀번호 및 이메일을 설정하십시오.

마지막 단계를 성공했다면, 잘 하셨습니다. 여러분의 웹사이트가 탄생했습니다!

이제 WordPress 사이트에 로그인하십시오. 사이트의 로그인 페이지는 설정한 웹 사이트 URL을 추적하는 wp-login.php처럼 보일 것입니다.


3단계 : 테마 및 몇 가지 중요한 플러그인 설치

다음으로, 필수 플러그인과 필수 테마를 설치해야합니다. 워드프레스 대시 보드의 왼쪽 사이드 바를 살펴보십시오.

이미 워드프레스 디렉토리에서 사용할 수 있는 무료 테마 톤이 있습니다.

이러한 무료 테마를 검색하려면 '모양> 테마> 새로 추가'로 이동하여 요구 사항에 맞는 테마를 검색하고 설치 버튼을 클릭하십시오.

WordPress 테마 디렉토리.

'테마 업로드' 섹션에서 타사 테마를 설치할 수도 있습니다. 유료 전문 디자인, 워드프레스 테마의 경우 (효율적인 코드와 아름다운 프런트 엔드 디자인을 위한)우아한 테마 를 추천합니다 .

플러그인의 경우, '플러그인> 새로 추가'를 탐색하십시오.

필요한 플러그인만 검색하고 설치하십시오. 타사 플러그인은 '플러그인 업로드' 섹션에서도 설치할 수 있습니다.

WordPress 플러그인 디렉토리.

여기에 몇 가지 중요한 무료 플러그인을 제안하고 싶습니다. 워드프레스 플러그인 디렉토리에서 이름을 검색하여 찾을 수 있습니다. 각 카테고리에서 하나의 플러그인만 설치하면 됩니다.

  • 검색 엔진 최적화 : Yoast SEO, All in One SEO Pack
  • 보안 : iThemes 보안, Wordfence 보안
  • 사이트 통계 : WordPress.com의 Jetpack, Monster Insights의 WordPress 용 Google Analytics
  • 양식 작성 : 연락처 양식 7
  • 성능 : W3개의 총 캐시, WP 수퍼 캐시

사이트 정체성을 위해서는 훌륭한 테마를 사용하더라도 무언가를 만들어야합니다. 멋진 로고 생성기가 많이 있지만, 살펴볼 것입니다 Logaster. 유료 서비스이지만 훌륭한 점은 계층화 된 가격 책정을 제공한다는 것입니다. 즉, 웹 형식 로고 만 있으면 필요한만큼만 지불하거나 다양한 플랫폼 용 형식을 포함하는 전체 브랜드 키트에 가입 할 수도 있습니다.

또한 읽기 - 새로운 WP 사이트를위한 9 필수 WordPress 플러그인


4단계 : 준비 되었습니다!

여러분의 사이트는 마지막 단계까지 작동되어야 합니다. 그러나 분류되어야 할 몇 가지가 더 있습니다.

  • '설정> 일반'에서 사이트 제목과 태그 라인을 설정하십시오.
  • '설정> 읽기'에서 홈페이지에 표시할 내용과 한 페이지에 표시할 블로그 게시물 수를 선택하십시오.
  • '설정> 퍼머 링크'에서 블로그 게시물의 URL 구조를 설정하십시오.
새로운 WordPress 사이트의 기본 설정.

3번째 방법 : 사이트 작성기가 있는 웹 사이트 만들기

필수 기술 & 툴

  • 관련 지식: 컴퓨터와 인터넷의 기본적인 이용 방법
  • 툴 : 윅스위블리

사이트 빌더는 손쉽게 웹 사이트를 설정합니다. 웹 언어에 대한 지식이 없으면 몇 분 만에 모든 기능이 갖춰진 웹 사이트를 시작할 수 있습니다. 이렇게 하기 위해서 코딩 지식이 전혀 필요 없는 드래그 & 드롭 웹 사이트 빌더를 제공합니다.

있다 인터넷에 흩어져있는 많은 사이트 빌더 그러나 그들 모두가 필요를 충족시킬 수있는 것은 아닙니다.

다음 세 가지는 가장 많이 사용되는 웹 사이트 빌더입니다.

윅스

윅스는 시장에서 가장 손쉬운 사이트 빌더 중 하나로, 다양한 카테고리 별로 정렬된 500가지 이상의 완전 맞춤형 템플릿을 제공합니다. 그럼로 여러분에게 맞는 템플릿을 찾을 수 있을 것이라고 확신합니다.

윅스는 항상 콘텐츠 위에 보이는 융통성 있는 드래그 & 드롭 웹 사이트 편집기를 제공하고 있습니다. 목록에서 한 항목을 드래그하여 추가할 웹 사이트의 아무 곳으로나 놓을 수 있습니다. 표시되는 항목은 이동하거나 편집할 수 있습니다.

유일한 단점은 윅스 무료 플랜을 이용하시면 광고가 뜬다는 점입니다. 최소 $ 12/월을 내고 콤보 플랜으로 업그레이드하여 광고를 제거할 수 있습니다.

또한 저희가 작성한 심층적인 윅스 리뷰를 읽어보세요.

위블리

위블리는 탐색, 사용자 편의성과 같은 여러 면에서 더 쉽습니다. 선택할 수 있는 수백 가지 템플릿을 제공하지만 개인화 옵션이 제한적일 수 있습니다.

위블리에는 사용할 수 있고 수정될 수 있는 사전 설계된 페이지 레이아웃이(예 : 페이지, 가격 책정 페이지, 연락 페이지) 많이 있습니다.

드래그 앤 드롭 빌더는 사용하기가 더 쉽지만 때로는 사용자 정의를 위해 지정된 영역으로 제한됩니다. 확장 프로그램 및 타사 앱의 사용도 제한됩니다.

또한 저희가 작성한 위블리 심층 리뷰를 확인해보세요.

윅스를 이용한 단계별 웹 사이트 제작 과정

1단계 : 윅스 가입하기

Wix.com에서 계정을 만드십시오.

5가지 프리미엄 요금제와 1가지 무료 요금제가 있습니다 (가격 범위는 $ 0 - $ 24.50 /월 입니다). 사이트를 성공적으로 생성한 후 업그레이드 옵션을 볼 수 있습니다.

윅스 요금제 및 가격은 여기를 참조하십시오.

Wix 가입 페이지.

[/ c8]

저는 윅스 베이직 유료 플랜과 콤보 플랜을 추천합니다. 윅스 콤보 플랜($ 8.50 / 월)에는 무료 도메인 이름과 더 많은 CPU 자료가 제공되며, 윅스 광고가 뜨지 않습니다.


2 단계 : 템플릿 선택

윅스는 웹 사이트를 어떻게 만들고 싶은지 묻습니다. 그들이 제안하는 가장 빠른 방법은 결국에는 별로 유익하지 못한 Wix ADI(Artificial Design Intelligence)입니다.

그래서 조금 더 오래 걸리지만 더 좋은 방법을 알려드리겠습니다, 바로 웹 사이트 빌더이죠!

다른 레이블 아래에 분류된 템플릿이 있음을 알 수 있습니다. 장래성 있는 카테고리를 찾아보고 자신에게 적합한 카테고리를 선택하십시오.

원하는 윅스 테마를 찾은 후 '편집'을 클릭하여 계속 진행하십시오.

테마에 마우스를 올려 놓으면 "편집"버튼이 표시됩니다.

3단계 : 윅스 웹사이트 빌더를 사용하여 웹 사이트 디자인하기

잠시 후, 여러분은 직관적인 웹 사이트 빌더로 직접 작업하게 됩니다.

웹 사이트 디자인은 간단합니다. 화면의 왼쪽과 오른쪽에 다른 도구가 나타납니다. 또한 웹 사이트의 아무 곳이나 클릭하여 블록을 편집하거나 다른 위치로 이동하십시오.

Wix 드래그 앤 드롭 편집기를 사용하여 웹 페이지 요소를 작성하십시오.

4 단계 : 웹 사이트 게시

게시 버튼을 누르면 무료 하위 도메인 또는 전체 기능을 갖춘 도메인 중 원하는 도메인이 무엇인지 묻는 메시지가 표시됩니다. 이건 여러분이 선택하시면 됩니다.

몇 가지 사항을 수정할 것을 권장합니다.

'윅스 대시 보드> 사이트 관리 및 편집'으로 이동하여 필요에 따라 SEO, Favicon, 소셜 및 업그레이드를 구성하십시오.

Wix 사이트를 구성하십시오.

그리고 일단 이러한 기본 설정을 완료하면 웹 사이트가 준비됩니다.

4. 웹 사이트 확인 및 테스트

웹 사이트가 준비되면 주요 브라우저 (Chrome, Firefox, Safari, Microsoft Edge, IE 11 등)와 다양한 화면 크기에서 어떻게 작동하는지 검증하고 테스트 할 차례입니다.

온라인에서 무료 도구를 사용하여 이러한 테스트를 실행할 수 있습니다.

마크 업 유효성 검사

다음을 사용하여 웹 사이트 마크 업을 쉽게 확인하세요. W3C 마크 업 검증 서비스.

마크 업 유효성 검사 란 무엇입니까? HTML, PHP 등과 같은 코딩 언어 또는 스크립트에는 각각 고유 한 형식, 어휘 및 구문이 있습니다. 마크 업 유효성 검사는 웹 사이트가 이러한 규칙을 따르는 지 확인하는 프로세스입니다.

브라우저 테스트

한 번에 최대 115 개의 서로 다른 브라우저에 대한 웹 사이트 교차 테스트 BrowserShots.

스크린 테스트

Screenfly를 사용하여 모니터, 태블릿, 스마트 폰 및 기타 다양한 화면 크기에서 웹 페이지를 미리 볼 수 있습니다.

5. 미세 조정 및 성장

인터넷에 웹 사이트를 게시하는 것은 XNUMX 단계입니다. 웹 사이트의 성공을 보장하기 위해 여전히해야 할 일이 많이 있습니다. 시작해야 할 몇 가지 작업은 다음과 같습니다.

웹 사이트 속도 미세 조정

Google은 사이트 속도가 순위 요소 중 하나임을 분명히 밝혔습니다. 즉, 사이트가 빠르게로드되면 순위가 더 높아질 수 있습니다.

또한 웹 사이트로드가 빠를수록 웹 사이트 방문자가 더 행복해집니다. 수많은 사례 연구와 실험에서 느리게로드되는 웹 사이트가 사용자 경험을 손상시키고 웹 사이트 수익에 영향을 미친다는 것이 입증되었습니다. 아마존은 사이트가 1.6 초라도 느려진다면 약 XNUMX 억 달러의 수익을 잃었을 것입니다.

웹 사이트 검색 가시성 향상

웹 사이트를 알리기 위해 검색 엔진 최적화 (SEO)의 마스터가 될 필요는 없습니다. 그러나 몇 가지 기본적인 검색 엔진 최적화 기술은 항상 가지고 있으면 좋습니다.

웹 마스터 계정을 만드십시오. Google 검색 콘솔 웹 사이트를 Google에 제출하고 SEO 문제를 식별합니다. 기본 키워드 조사를 수행 한 다음 기본 키워드에 대한 페이지 제목과 제목을 최적화하십시오. 검색 결과 페이지에서 눈에 띄도록 사이트에 스키마 마크 업을 구현하세요.

더 많은 SEO 팁을 보려면 SEO 더미 가이드 읽기.

HTTPS 구현

Chrome이 HTTP 웹 사이트에 '안전하지 않음'이라는 라벨을 지정하기 시작한 이후로 SSL 인증서 큰 문제가되었습니다. 사용자가 웹 사이트를 "신뢰"하는지 확인하려면 HTTPS 연결이 필수입니다.

필수 페이지 추가

다른 목적 및 / 또는 기능을 제공 할 수 있으므로 두 웹 사이트가 동일하지 않습니다. 그러나 모든 웹 사이트에는 인덱스 (홈페이지), 정보 페이지 및 연락처 페이지의 세 가지 표준 페이지가 있습니다.

홈페이지

홈페이지는 대부분의 방문자가 귀하의 웹 사이트를 방문한 후 가장 먼저 보게되는 곳입니다. 홈페이지는 적절한 프레젠테이션을 제공하고 방문자를 사이트로 더 깊이 유도해야합니다.

예 – Haus 홈페이지에는 명확한 탐색 메뉴와 갤러리 스타일의 디자인이 함께 제공됩니다 (제품 쇼케이스에 적합).

정보 페이지

페이지 정보는 방문자와의 관계를 구축하는 것입니다. 자신을 소개하고 웹 사이트에 대한 세부 정보를 제공 할 수 있습니다. 일반적으로 웹 사이트를 소유하고 운영하는 사람들의 사진을 포함하는 것이 좋습니다.

예 – Bulldog Skincare의 About Page는 사랑스럽고 기억에 남는 메시지를 보냅니다.

연락처 페이지

사용자 및 잠재 고객과 소통하는 것이 중요합니다. 따라서-연락처 페이지. 가능한 모든 커뮤니케이션 채널 (소셜 미디어 프로필, 연락처 양식, 이메일 주소 등)을 포함하여 방문자가 귀하에게 연락 할 수 있도록하십시오.

Survicate의 연락처 페이지는 간단한 레이아웃으로 아름답게 디자인 된 페이지입니다. 큰 양식 필드, CTA 버튼 및 일반적인 연락처 정보 (회사 주소, 연락처 번호, 이메일 주소, 운영 시간 등)를 읽고 스캔하기 쉬운 방식으로 결합합니다.

소셜 미디어 플랫폼에서 도달 범위 확장

귀하의 웹 사이트는 또한 대부분의 타겟 고객이 어울리는 소셜 미디어 플랫폼에 존재해야합니다. 우리 사이트에서는 페이스 북과 트위터를 의미합니다. 다른 사람들에게는 LinkedIn, Tumblr 또는 Pinterest가 될 수 있습니다.

파비콘 추가

편지 봤어?B”이 브라우저 탭 왼쪽에 표시된 노란색 원 안에 있습니까? 이것을 "파비콘"이라고합니다. 로고와 마찬가지로 파비콘은 웹 사이트를 나타내는 작은 시각적 요소입니다.

Favicon은 웹 사이트 소유자가 종종 간과하는 멋지고 작은 브랜딩 기술입니다. 그게 당신처럼 들리면-이것을 사용하십시오 무료 파비콘 생성기 당신을 도울 수 있습니다.

웹 사이트 제작에 관해 자주 묻는 질문

무료로 웹 사이트를 어떻게 만드나요?

무료 웹 사이트를 만드는 두 가지 주요 방법이 있습니다. 무료 웹 호스팅 000Webhost 또는 웹 사이트 구축 플랫폼 Wix와 같은 무료 플랜을 제공합니다.

GoDaddy 웹 사이트 빌더는 무료입니까?

GoDaddy는 월 $ 10부터 시작하는 웹 사이트 빌더를 기반으로 계획을 세웠습니다. 자세한 GoDaddy 리뷰를 읽어보십시오 더 많은 것을 알 수 있습니다.

초보자를위한 가장 쉬운 웹 사이트 빌더는 무엇입니까?

다리 웹 사이트 빌더 초보자가 사용하기 쉽습니다. 본질적으로 웹 사이트 빌더는 기술에 정통하지 않은 사용자를 대상으로하며 많은 도움을 제공합니다. 사용자 친화적 인 인터페이스부터 사전 제작 된 템플릿까지 다양합니다.

웹 사이트를 만들 때 어디에서 시작합니까?

사이트 빌드를 시작하기 전에 다음과 같습니다. 블로그 시작하기가장 먼저 해결해야 할 것은 당신의 의도입니다. 귀하의 웹 사이트가 되고자하는 것은 설계 및 개발에 중요한 역할을 할 수 있습니다.

웹 사이트를 코딩하는 데 시간이 얼마나 걸립니까?

웹 사이트를 코딩하는 데 걸리는 시간은 복잡성에 따라 다릅니다. 기능과 디자인 측면에서 더 많이 필요할수록 시간이 오래 걸립니다. 간단한 정적 웹 사이트는 몇 시간 안에 코딩 할 수 있으며, 규모가 크고 복잡한 사이트는 몇 개월이 걸릴 수 있습니다.

지금 완료하세요!

이제 성공적인 웹 사이트를 만들고 구축하는 데 충분한 지식이 있습니다. 여러분의 지식을 업무에 적용 할 때입니다. 지금 시작하고 인터넷을 즐기십시오!

Jerry Low 정보

WebHostingSecretRevealed.net (WHSR)의 설립자 - 100,000의 사용자가 신뢰하고 사용하는 호스팅 검토. 웹 호스팅, 제휴 마케팅 및 SEO에서 15 년 이상의 경험. ProBlogger.net, Business.com, SocialMediaToday.com 등의 기고자.