創建網站的三種簡單方法:循序漸進的初學者指南

文章撰寫者:
  • 託管指南
  • 更新:可能是10,2019

在2019中創建網站是超級簡單。

你不必是技術極客也不是程序員。

只要依照正確的方法,選擇合適的平台,使用正確的工具,你就可以100%迎刃而解。

當我第一次在2004開始我的電子商務時,我對網站開發可說是一竅不通。我沒有聘請Web開發人員,直今已XNUMX年, 我的商務做到還行。

這個時代我們擁有創新的開發工具和優質的網絡發布平台。

三種簡單製作網站的方法:

快速鏈接:

  1. 從零開始創建
  2. 使用內容管理系統(CMS)
  3. 使用網站建設者

你可以在#1取得具有大幅度靈活性的設計和站點功能, 但是需要具備有良好的網絡語言和知識

透過#2和#3的方法, 讓網站創建和管理過程更加容易。您應該根據自己的能力選擇其中一種方法。

我們快速地研究出這三種方法。

但在你開始之前......

在開始之前,我們需要為您的網站提供兩件事:1-域名和2- 網絡託管。

1-註冊域名

域名是您網站的名稱, 必須是獨一無二的, 並且能傳達您的企業品牌。

搜索和註冊域名最簡單的方法是訪問域名註冊商。

通過域名註冊商, 您可以以年度合同或長期合同方式註冊您的域名。

在NameCheap搜索並註冊您的域名
搜索並註冊域名 Name Cheap.

以下是一些值得信賴的域名註冊商需要考慮的問題。

登記起始價
.COM .net
123 Reg£11.99£11 .99
Domain.com$ 9.99 /年$ 10.99 /年
Gandi€12.54 /年€16.50 /年
GoDaddy$ 12.17 /年$ 12.17 /年
Name Cheap$ 10.69 /年$ 12.88 /年
Network Solution$ 34.99 /年$ 32.99 /年

參閱 - 域名的懶人包.

2-購買網絡託管服務

A 虛擬主機 虛擬主機 是一個存儲您的網站的大型計算機(也稱為服務器)。一些大公司 , 如: 亞馬遜、IBM和FB,擁有並管理本身的網絡服務器; 一般企業只是透過託管服務提供商租用他們的服務器(這是更簡單且實惠)。

注意:如果您選擇使用網站構建器來創建您的網站,請跳過此步驟(見步驟#3).

網站託管

为一些新手友好的托管服务做为参考。

網絡主機註冊備註
A2 Hosting$ 4.90 /月快速的网络主机,新手容易上手。
BlueHost$ 3.95 /月注册价格便宜,新手容易上手。
Hostgator Cloud$ 8.95 /月价格合理,服务可靠。
HostPapa$ 3.36 /月環保網站主機,獨家折扣。
InMotion Hosting$ 3.49 /月註冊價格便宜,服務器可靠。
SiteGround$ 5.95 /月#支持實時聊天,紮實的網絡主機。

到目前為止,我們已經簽署,測試和審核了超過60託管公司。 見我們的 頂級10主機選擇 or 主機評論的完整列表.

參閱- 建立一個網站需要多少錢?


FTC披露

WHSR收到本文中提到的一些公司的推薦費用。創建類似實在內容, 需要耗費很多精力和金錢 , 您的支持受到高度的重視。


一旦你的域名和網絡託管到位,就可以捲起袖子開始創作了!

方法#1:從零開始創建網站

所需技能和工具

如果您能掌握主要的網絡用語語言和網站的基礎知識,那麼您就可以創建出本身俱有個人特色與眾不同的網站。

否則,建議您跳到方法2, 3; 或者,與web開發人員聯繫。

您應該了解的基本Web語言/工具:

  • HTML(超文本標記語言)
    HTML是網頁和Web應用程序的基本結構,它使內容對Web瀏覽器具有語義。由開口和閉合的順序標籤組成,結構以尖括號做為封閉關鍵。 例如:<strong></strong>
  • CSS(層疊樣式表)
    CSS是一種樣式表語言,用於描述和裝飾HTML文檔。沒有CSS,我們看到的網頁就只是一張大白頁,上面有一些無序的文字和圖像, CSS將我們想像的畫面一一呈現.。
  • 腳本語言
    沒有腳本語言,HTML和CSS就失去了意義,因為它們之間是沒有互動的。要創建一個能響應用戶的動態網頁,您需要JavaScript和jQuery等語言。過後,可能還需要服務器端語言,如PHP,Python和Ruby。
  • 數據庫管理
    為了存儲、管理和訪問用戶輸入的網站數據,需要考慮一個龐大的信息表,稱為數據庫。服務器端使用MySQL、MongoDB和PostgreSQL等數據庫管理系統來有效地完成這項工作。
  • FTP(文件傳輸協議)
    FTP用於更輕鬆地將網站的源文件傳輸到其託管服務器。透過Web的計算機軟件和FTP客戶端,即可將文件上傳輸到服務器計算機。

使用IDE創建網站

以下是如何創建第一手網站的過程概述. 假設您已了解以上所提到的基本Web語言和網站要點。

步驟1:設置本地工作環境

使用子行文本製作網站
Subline Text工作環境的屏幕截圖。

為了創建和組織網站的源文件,優質的工作環境很重要。您可以通過安裝IDE(集成開發環境)在計算機設備上創建Web開發環境。 IDE基本上由文本編輯器,構建自動化和調試器組成。

Subline Text 或 Atom 是一些IDE的基本文本編輯器, 用於開發支持HTML,CSS,JS,PHP,Python等的類似Web語言。

另一方面,有擴展的IDE Adobe Dreamweaver中 它提供了一些其他功能(例如:服務器連接,FTP)。

步驟2:使用Adobe Photoshop規劃和設計您的網站

規劃網站結構和導航系統非常重要。首先,您必須了解如何提供內容。計劃導航菜單的數量,列數或內容字段數,要包含的圖像數量以及位置。

最佳做法是打開Adobe Photoshop並創建網頁的粗略繪圖。您可能需要為不同的頁面製作不同的草稿頁,例如主頁、關於頁面、聯繫人頁面、服務頁面等。

我們在創建此網站時使用的設計模型
示例 - 我們在2016年XNUMX月的站點改造期間進行的模擬設計

步驟3:使用HTML和CSS對設計進行編碼

在Adobe Photoshop中完成網頁的粗略設計後,您可以開始編寫源代碼。

這是最簡單的部分。為您想要包含的Web元素製作HTML標記,並根據您的設計使用CSS來進行美化。

步驟4:使用JavaScript和jQuery使其動態化

現在只有基於HTML和CSS的網站不存在,因為無法通過HTML或CSS控制前端用戶交互。

您可以使用的JavaScript等腳本語言,或者使用改進的的jQuery來控制表單,登錄,滑塊,菜單或任何需要的用戶活動。

步驟5:使用FTP客戶端將本地文件上載到服務器

用於網站創建的FTP軟件

最後一個步驟是將所有源文件上傳到Web服務器。最好和最簡單的處理方法是通過FTP客戶端。

首先,在計算機設備下載FTP客戶端,然後使用FTP帳戶將其連接到Web服務器。成功連接到FTP帳戶後,將所有文件複製到Web目錄的根目錄. 口碑好的FTP客戶端有: FileZilla,WinSCP和Cyberduck.


方法#2:使用CMS創建網站

所需技能和工具

  • Knwoledge:計算機和互聯網的基本操作; HTML,CSS和PHP(不是強制性的,但如果您能掌握基礎知識則更好)
  • 工具: WordPress, JoomlaDrupal

CMS 即內容管理系統, 其構建非常具有戰術性,對於初學者和有經驗的Web開發人員皆適合。

它是一個軟件應用程序,可以輕鬆創建和管理在線內容。其中大多數是公開的,可以免費使用。

如果您了解HTML,CSS或PHP的基礎知識,那麼它會讓你更得心應手。如果您不懂,也不是大問題,因為這些平台非常容易辨識。以下是CMS的三大免費平台,您可以根據需要選擇。

快速比較

WordPressJoomlaDrupal
成本免費免費免費
用法311,682萬元26,474萬元31,216萬元
免費主題4,000+1,000+2,000+
免費插件45,000+7,000+34,000+

參閱 - 熱門CMS比較(XNUMX) - WordPress vs Joomla vs Drupal

WordPress

根據各種統計數據,目前WordPress是最受到博客和中小型網站的廣泛使用。而許多大型的網站確實也更喜歡WordPress的簡單性。 WYSIWYG編輯器是您放置內容時, 是你初步也是唯一需要學習的東西。

這是初學者的平台,同時也可以應付不同類別的Web開發人員的大量開發。存儲庫中提供許多免費插件和主題。可以提供大量第三方資源, 是CMS的第一選擇。

主題
選擇WordPress主題。

優點

  • 高度靈活和可定制
  • 使用方便,
  • 大量的學習資源,
  • 優秀的社區和支持

缺點

  • 主要視覺需要自定義的代碼
  • 更新可能會導致插件出現問題

了解更多

Joomla

Joomla在許多方麵類似WordPress。它易於使用,易於安裝,並且可以藉助模塊輕鬆擴展– 相當於WordPress插件。因此,它是初學者的第二選擇。

但是,由於可用選項的數量,可能影響初學者對Joomla的探索。除左側菜單外,位於“控制面板”徽標的正上方, 頂部欄上還有一個菜單。為了避免混淆,請記住左側和頂部欄菜單中的某些項目是相似的,如: “內容”,“用戶”和“擴展程序”。

就像WordPress一樣,Joomla有一些樣式和模板可以快速為您的網站提供獨特的外觀。而在三個內容管理系統中,Joomla在創建社交網絡時提供了最簡單的解決方案。借助EasySocial和JomSocial等平台,讓您與創建屬於自己的社交網站近在尺咫。

短跑
Joomla系統內部。

優點

  • 更先進的技術
  • 網站表現更出色
  • 企業級安全性

缺點

  • 模塊很難維護
  • 在內容系統管理CMS部分 - 不比WordPress簡易,不及Drupal先進.

更多信息

Drupal

經驗豐富的Web開發人員證明Drupal是最強大的CMS。

但是,它也是最難使用的。它的優勢在於靈活性,讓Drupal成為了全世界第二大高使用率的CMS,但它不受初學者的青睞。要使用Drupal成功構建一個“完整”的網站,您必需親自動手並學習編碼的基礎知識, 這對於初學者而言,是具有難度的挑戰。

Drupal的
安裝新的Drupal - 儘管Drupal中的功能很複雜,但CMS提供了一個簡單,簡約的界面。

優點

  • 簡單易學
  • 很棒的幫助門戶
  • 無縫隙整合更新
  • 更多內置選項

缺點

  • 初學階段陡峭的學習過程- 比較建議高級用戶使用.

更多信息

使用WordPress逐步完成網站創建過程

目前為止你應該已經擁有了一個 虛擬主機帳戶 和域名。

步驟1:在Web主機面板中找到WordPress安裝程序

Web託管服務通常具有安裝WordPress和其他常見平台的快速安裝程序。

因此,請登錄您的網絡託管帳戶,找出您擁有的安裝程序。您應該搜索的熱門名稱如: Softaculous,QuickInstall或Fantastico。

一些託管服務提供商(例如:SiteGround)在其用戶儀表板(登錄到cPanel後即看到的屏幕)中使用集成安裝程序。在這種情況下,只需找到含有“WordPress”的標題。

示例:SiteGround cPanel儀表板。

步驟2:通過安裝程序安裝WordPress

Softaculous是最受歡迎的自動安裝程序,在cPanel上是具特色的。讓我通過Softculous引導您完成安裝。至於 其他安裝程序幾乎是大同小異。

單擊Softaculous,然後單擊WordPress上的'Install'開始安裝。

安裝WordPress來創建您的網站

這是重要的部分。

網站配置

配置選項如下,將其他字段保留為默認配置(稍後將進行排序),然後單擊“安裝”。

  • • 協議:您必須決定是否要安裝http://或http:// www。 URL的版本。無論你選擇什麼,都大同小異。從技術角度來看,http:// www。在靈活性和cookie管理方面更好。請注意,如果您擁有有效的SSL證書, 並且想要安裝WordPress,只需選擇https而不是http。
  • 域名: 選擇要安裝網站的域名。
  • 目錄:指定要安裝WordPress站點的位置。如果要將其安裝在URL根上(例如:http://www.yourwebsite.com/),將其留空。如果您想在URL子上(例如:http://www.yourwebsite.com/myblog/),請在字段中指定目錄。
  • 管理員帳戶:設置您的用戶名稱,密碼和電子郵件, 以用於登錄WordPress網站。

完成最後的步驟後,意味著你的網站成功誕生了!

現在登錄到您的WordPress網站。您網站的登錄頁面將類似於wp-login.php,其中包含您設置的網站網址。

步驟3:安裝主題和一些重要的插件

接下來,您必須安裝主題和必需的插件。看看WordPress儀表板的左側邊欄。

WordPress目錄中有大量免費的現成主題。

要瀏覽這些免費主題,請轉到“外觀>主題>添加新”,搜索符合要求的主題,然後單擊“安裝”按鈕。

WordPress主題目錄
WordPress主題目錄。

您還可以從“上傳主題”部分安裝第三方主題。對於付費者,可選擇專業設計的WordPress主題,我推薦 Elegant Themes (因為它有效的代碼和漂亮的前端設計)。

對於插件,請瀏覽“插件>添加新”。

搜索並安裝您所需要的插件。rd 部份插件也可以從“上傳插件”中安裝。

WordPress插件目錄
WordPress插件目錄。

在這裡,我想建議一些重要的免費插件。你可以從WordPress插件目錄中, 按名稱搜索找出它們。請注意,只需從每個類別安裝一個插件就足夠了。

  • SEO:Yoast SEO,All in One SEO Pack
  • 安全:iThemes Security, Wordfence Security
  • 網站統計數據:WordPress.com的Jetpack,Monster Insights以谷歌分析的WordPress
  • 表格創建:聯繫 表格 7
  • 性能:W3總緩存,WP超級緩存

參閱 適用於新WP站點的9 Essential WordPress插件

步驟4:你準備好了!

來到最後一個步驟, 您的網站已啟動並且運行。但還有一些事情需要解決。

  • 在“設置>常規”下:設置您的網站標題和標語。
  • 在“設置>閱讀”下:您的主頁應顯示的內容以及您希望在單個頁面上顯示的博客數量。
  • 在“設置>永久鏈接”下:設置博客帖子的網址結構。

新WP站點的基本設置
新WordPress網站的基本設置。


方法#3:使用網站構建器創建網站

所需的技能和工具

  • • 知識:計算機和互聯網的基本操作
  • 工具: Wix - Weebly

網站建設者已經毫不費力地立即建立了一個網站。 如果不了解網絡語言,可以在幾分鐘內啟動他的全功能網站。 他們提供Drag&Drop網站構建器,這些構建器需要零編碼知識。

互聯網上遍布許多網站建設者--Disha曾在博文中介紹了XNUMX位免費網站建設者; 但是他們並不能無法滿足所有人的需求。

以下三個是您可以使用且最受關注和潛在的網站構建者。

Wix

使用Wix建立一個網站

Wix是市場上最簡單的網站建設者之一,擁有500多種各種類別, 可定制的模板。因此,您肯定會找到一個適合您的產品。

他們提供靈活的拖放網站編輯器,始終可見內容。 您可以從列表中拖動一個項目並將其放在網站上的任何位置進行添加。 可以移動或編輯其上的任何可見項目。

唯一的缺點是在Wix免費配套中有現場廣告。但是您可以通過升級每月至少12美金的Combo配套來擺脫這些廣告。

參閱 我們對Wix深入評論.

Weebly

使用Weebly創建一個網站

Weebly在很多方面較為簡易,比如:導航 、用戶友好性。它們提供了數百種可供選擇的模板,但個性化選項可能會受到限制。

擁有大量可以使用和修改的預先設計的頁面佈局(例如:關於頁面,定價頁面,聯繫頁面)。

“拖放”構建器更易於使用,但有時僅限於指定的自定義區域。 擴展程序和第三方應用程序的可用性也很有限。

參閱 我們對Weebly深入的評論.

使用Wix的逐步網站創建過程

步驟1:註冊Wix

在Wix.com上創建一個帳戶。

有5個豪華配套和1個免費配套(價格範圍從0美元到24.50美元/月)。成功創建站點後,您將看到升級選項。

請在此處查看Wix配套和定價。

Wix註冊
Wix註冊頁面。

我推薦Wix基本付費8.50合XNUMX配套 。 Wix Combo計劃($ XNUMX / mo)具有免費域名,更多CPU資源,並且沒有Wix廣告。

步驟2:選擇一個模板

Wix會問你想如何創建一個網站。他們建議的最快方式是Wix ADI(人工設計智能), 只是最終效果並不理想。

所以我會引導你一段時間,以更好的方式成為網站建設者!

您將看到在不同標籤下分類的模板。瀏覽您所預期的類別並選擇適合您的類別。

找到您喜歡的Wix主題後,點擊“編輯”繼續。

在Wix編輯網頁
將鼠標懸停在主題上時會顯示“編輯”按鈕。

步驟3:使用Wix Website Builder設計您的網站

片刻之後,您將直接登陸他們直觀的網站構建器。

設計網站很簡單。您將在屏幕的左側和右側看到不同的工具。單擊網站上的任何位置以編輯分段或將其移動到其他位置。

Wix元素
使用Wix拖放編輯器構建您的網頁元素。

步驟4:發佈網站

當您點擊發布鍵時,系統會詢問您是否需要免費子網域或全網域, 由你本身決定。

建議進行一些調整。

轉到“Wix儀表板>管理和編輯站點”,根據需要配置SEO,Favicon,社交和升級。

Wix站點配置
配置您的Wix站點。 點擊放大圖片。

一旦完成這些基本設置 - 您的網站即準備就緒。

關於Jerry Low

WebHostingSecretRevealed.net(WHSR)的創始人 - 100,000用戶信任和使用的託管評論。 超過15在網絡託管,聯盟營銷和SEO方面的多年經驗。 ProBlogger.net,Business.com,SocialMediaToday.com等的貢獻者。