現在,創建網站非常容易。您不必是個·技術人員或程序員。只要按照正確的步驟,選擇合適的平台,並使用對的工具 — 就可以立即擁有屬於自己的第一個網站。
我在 2004 年剛接觸電子商務時,對網頁開發一竅不通。當時的我並沒有聘請網頁開發人員,如今 XNUMX 年過去了,我的商務做得還可以。
如今 — 我們擁有創新的開發工具以及更好的網絡發布平台,要創建網站絕對沒問題。
在本文中,我們將介紹創建網站的所有步驟,並研究三種建設網站的方式。
1.註冊域名
域名是您網站的名稱,它必須是獨一無二的,並能傳達業務品牌。
最簡單的方式是去域名註冊商搜索和 註冊域名 。
您可以在域名註冊商簽訂年度合同或長期合同來註冊域名。
哪裡可以註冊域名?
以下是信譽良好的域名註冊商及他們的起始價格。
域名註冊商 | .COM | .net | 。ORG | .xyz |
---|---|---|---|---|
123 Reg | 每年 7.99 英鎊 | 每年 8.99 英鎊 | 每年 9.99 英鎊 | 每年 1.99 英鎊 |
Domain.com | 每年 9.99 美元 | 每年 12.99 美元 | 每年 8.99 美元 | 每年 2.99 美元 |
Gandi | 每年 14.96 歐元 | 每年 17.00 歐元 | 每年 8.99 歐元 | 每年 3.00 歐元 |
GoDaddy | 每年 0.19 美元 | 每年 15.17 美元 | 每年 10.17 美元 | 每年 2.17 美元 |
Hostinger | 每年 9.99 美元 | 每年 12.99 美元 | 每年 7.99 美元 | 每年 1.99 美元 |
NameCheap | 每年 7.98 美元 | 每年 9.98 美元 | 每年 6.98 美元 | 每年 2.00 美元 |
域名的小貼士
- 如果您絞盡腦汁都想不出一個域名,可以使用域名生成器來獲取一些想法。一些著名的生成器包括 Wordroid 和 Lean Domain Search.
- 如果您是一名新手,我建議您去 Namecheap 查找和購買域名。
- 另請閱讀 — 域名懶人包.
2. 購買虛擬主機
網絡主機是一台存儲多個網站的大型計算機(也被稱為服務器)。一些大公司 — 如亞馬遜、IBM 和 FB 擁有和管理自己的網絡服務器; 其他企業則是從網絡託管服務提供商那裡租用服務器(這更便宜也更容易使用)。
注意:如果您使用網站構建器來創建網站,請跳過此步驟(移步步驟#3).
網絡託管的選擇有哪些?
現在的網絡託管提供各種配套可供選擇。
傳統的網絡託管服務提供商只出租具有基本軟件和技術支持的服務器。 傳統的託管服務提供商 通常更便宜,更靈活; 但是您需要做一些額外的工作才能建立網站。
如今,公司將不同的服務捆綁在一起,讓用戶使用一個服務提供商構建、託管和管理網站。我們稱這些公司為 網站構建器 或 網上商店構建器。把網站託管在這些“捆綁”平台的費用較高且靈活性較低,但您可以輕鬆構建網站或網上商店。
適合新手的託管服務有:
託管公司 | 最便宜的計劃 | 續訂價格 | 免費域名? | 免費網站遷移? | 網站託管 | 退款試驗 | 了解更多 | 立即訂購 |
---|---|---|---|---|---|---|---|---|
Hostinger | 每月 1.99 美元 | 每月 3.99 美元 | 沒有 | 有 | 1 | 30天 | Hostinger 評論 | 購買 Hostinger |
InterServer | 每月 2.50 美元 | 每月 7.00 美元 | 沒有 | 有 | 無限制 | 30天 | Interserver 回顧 | 購買 InterServer |
A2 Hosting | 每月 2.99 美元 | 每月 10.99 美元 | 沒有 | 有 | 1 | 任何時候 | A2Hosting 回顧 | 購買 A2 Hosting |
GreenGeeks | 每月 2.95 美元 | 每月 10.95 美元 | 有 | 有 | 1 | 30天 | GreenGeeks 評論 | 購買 GreenGeeks |
TMD Hosting | 每月 2.95 美元 | 每月 4.95 美元 | 有 | 有 | 1 | 60天 | TMD Hosting 回顧 | 購買 TMD Hosting |
InMotion Hosting | 每月 2.29 美元 | 每月 8.99 美元 | 有 | 有 | 2 | 90天 | InMotion Hosting 評論 | 购买 InMotion Hosting |
ScalaHosting | 每月 3.95 美元 | 每月 6.95 美元 | 有 | 有 | 1 | 30天 | ScalaHosting 評論 | 購買 ScalaHosting |
BlueHost | 每月 2.95 美元 | 每月 9.99 美元 | 有 | 有 | 1 | 30天 | BlueHost 評論 | 購買 BlueHost |
HostPapa | 每月 2.95 美元 | 每月 9.99 美元 | 有 | 有 | 1 | 30天 | HostPapa 回顧 | 購買 HostPapa |
網絡託管的小貼士
- 網上有很多 不同類型的託管 ,包括:共享託管,專用服務器託管和雲 / VPS託管。
- 如果您正在經營小型網站,使用共享託管計劃會較便宜。對於規模較大的網站,我們建議使用雲或專用託管。
- 選擇虛擬主機前,您需要考慮一些關鍵特點,包括用戶友好性,價格,服務器速度和正常運行時間。
- 迄今為止,我們已經註冊、測試並評估了 70 多家託管公司 – 閱讀文章: 最佳的網絡託管.
- 如果您計劃在網站上銷售產品,可以使用網上商店構建平台,例如 Shopify or BigCommerce 。
- 有些公司會對服務器收取高得不合理的價格,因此在購買前,請務必閱讀 網絡託管的市場研究 。
- 在完成付款後,您會收到一封歡迎電子郵件,其中包含您的託管賬戶的所有必要信息 — 這是您作為網站所有者開始旅程的起點。閱讀更多: 網絡託管的啟動過程指南.
3. 創建和設計網站
一旦設置好域名和虛擬主機後,您就可以開始創建網站了!您可以聘請專業的網頁開發人員或自己動手設計和創建網頁。
我們詳細講解了 如何外包網站開發任務。如果您僱用專業人員來建設網站,則可以跳過以下步驟並轉到該頁面。
對於 DIY 建設網站的人,以下是三種簡單創建網站的方法:
方法 #1:使用 HTML 和 CSS 從頭創建網站
所需技能和工具
- 知識: HTML, CSS, JavaScript, mySQL or PostgreSQL (數據庫)
- 集成開發環境(IDE): Sublime Text, Atom和 Adobe Dreamweaver
- FTP 客戶端: FileZilla, WinSCP 和 Cyberduck
當您掌握了主要的編程語言和網站的基礎知識,就可以動手創建具有個人特色且獨一無二的網站。
反之,我們建議您移步到方法#2 / 3; 或聯繫網站開發人員。
基本的編程語言 / 工具
- HTML(超文本標記語言)
HTML 是網頁和網絡應用程序的基本結構,使瀏覽器上的內容具有語意性。它由順序標籤組成,每個標籤都有一個開頭和一個結尾,而關鍵字由尖括號包圍。例如:<strong></strong> - CSS(層疊樣式表)
CSS是一種樣式語言,用於描述網頁上的HTML文檔。沒有CSS,我們看到的網頁就只是一大張白色的頁面,和無序的文字和圖像。 CSS 能把我們想要的畫面一一呈現出來.。 - 腳本語言
沒有腳本語言,HTML 和 CSS 就失去了意義,因為它們之間是沒有互動的。要創建一個會響應用戶的動態網頁,您需要 JavaScript 和 jQuery 等語言。一段時間後,您可能還需要服務器端語言,如 PHP,Python 和 Ruby。 - 管理數據庫
您需要一個龐大的信息表來存儲、管理和訪問用戶輸入的數據,我們稱它為數據庫。在服務器端使用 MySQL、MongoDB 和 PostgreSQL 等數據庫管理系統能高效地完成這項工作。 - FTP (文件傳輸協議) / sFTP (安全文件傳輸協議)
FTP 能更輕鬆地 傳輸網站的源文件 到託管服務器上。市面上有網絡版以及軟件版的 FTP 客戶端,可以將文件上傳到服務器上。
使用 IDE 創建網站的步驟
以下是創建第一個網站的過程概述,假設您已經掌握了上述基本的編程語言和網站重點。
步驟1:設置本地工作環境
對於創建和管理網站的源文件而言,良好的本地工作環境非常重要。您可以安裝集成開發環境(IDE),以在計算機上創建網頁開發環境。基本上,IDE 由文本編輯器、構建自動化和調試器組成。
Sublime Text 和 Atom 是一些支持 HTML、CSS、JS、 PHP, Python 和類似編程語言的基礎 IDE。
另一方面,擴展 IDE 如: Adobe Dreamweaver 則提供其他的功能(例如:服務器連接 和 FTP).
步驟二:使用Adobe Photoshop規劃和設計網站
網站的結構和導航系統的規劃是非常重要的。首先,您需要明白您要以什麼樣的方式傳遞內容。規劃導航菜單的數量、列數或內容段數、以及要插入的圖片數量和位置。
最好的做法是打開 Adobe Photoshop 並創建網頁草圖。或者,您也可以使用目前的設計協作工具,如 Figma 和 Canva 。他們讓您在同一平台上與設計師和編碼人員同步工作。
步驟三:使用HTML和CSS對設計進行編碼
在 Adobe Photoshop 中完成網頁的草圖設計後,您可以開始編寫源代碼。
這是最簡單的部分。使用HTML把想要納入的網頁元素標記起來,並按照先前的設計使用CSS來進行點綴。
步驟4:使用JavaScript和jQuery使其動態化
步驟XNUMX:使用JavaScript和jQuery,讓網站成動態化
您可以使用像JavaScript的腳本語言,或者使用已改進的jQuery來控製表單、登錄、滑塊、菜單或任何用戶活動。
第 5 步:使用 FTP 客戶端將本地文件上傳到服務器
最後一步是將所有源文件上傳到網頁服務器上。 FTP客戶端是最好和最容易處理它的方式。
首先,把 FTP 客戶端下載到計算機上,並使用 FTP 帳戶連接到網頁服務器。成功連接到 FTP 帳戶後,將所有本地文件複製到網頁的根目錄中。一些好的 FTP 客戶端包括 FileZilla, WinSCP 和 Cyberduck.
方法 #2:使用 CMS 創建網站
CMS 或 內容管理系統 擁有巧妙的構建方式。無論是剛開始構建網站的初學者還是經驗豐富的網頁開發人員,它都適合使用。
它是一個軟件應用程序,可以輕鬆創建和管理線上內容。大多數CMS是開源軟件,可以免費使用。
如果您掌握了HTML,CSS或PHP的基礎知識,那麼你使用起來會更得心應手。即使您不了解,這也不是個大問題,因為這些平台都很直觀易懂。以下是三大免費的CMS平台,您可以根據需求做出選擇。
WordPress
WordPress,根據各種統計,在博客和中小型網站中使用的數量最多。 儘管如此,許多強大的大網站確實更喜歡 WordPress 因為它的簡單性。 所見即所得編輯器是您獲得第一個內容所需學習的唯一東西。
WordPress 適合初學者以及不同級別的網頁開發人員進行大量開發。它的存儲庫中包含許多免費的插件和主題。作為 CMS 的首選,該平台擁有大量的第三方資源(號稱插件)。
優點
- 高度靈活和可定制性
- 方便使用,
- 大量的學習資源,
- 優秀的社區和支持
缺點
- 需要代碼來進行主要的視覺定制
- 更新可能會導致插件出現問題
Joomla
Joomla 和 WordPress 有很多相似的地方。它容易使用,易於安裝,並且可以藉助模塊輕鬆擴展 - 相當於 WordPress 的插件。這使它成為初學者的第二選擇。
然而,初學者可能會因為選項的數量而害怕去嘗試 Joomla。除了左側菜單外,“控制面板” 標誌的右上方的頂部欄中還有一個菜單。為了避免混淆,請記住左側和頂部工具欄菜單中的一些項目是很相似的,包括“內容”,“用戶”和“擴展”。
和 WordPress 一樣,Joomla 的一些樣式和模板可以在短時間內為網站提供新的外觀。在三個內容管理系統中,Joomla 最適合創建社交網絡。在EasySocial 和 JomSocial 的幫助下,只需幾分鐘即可創建社交網站。
使用 Joomla 創建的網站包括: Lipton, Linux, 以及 哈佛大學。你可以點擊 這裡 免費下載和試用 Joomla。
優點
- 更先進的技術
- 網站擁有更出色的表現
- 企業級安全性
缺點
- 模塊難以維護
- 中端 CMS - 沒有 WordPress 那麼容易使用,也沒有 Drupal 先進
Drupal
經驗豐富的網頁開發人員證實Drupal是最強大的CMS。
然而,它也是最難使用的。 Drupal 的靈活性使它成為世界上使用量第二大的CMS,但它並不是初學者的首選。要使用 Drupal 創建“完整”的網站,您需要親自動手並學習 編碼的基礎知識。對於初學者來說,熟悉 CMS 的使用方式也很有挑戰性。
使用 Drupal 創建的網站包括 特斯拉, 華納兄弟和 牛津大學。 免費下載並試用 Drupal。
優點
- 簡單易學
- 很棒的支援網
- 無縫隙整合更新
- 更多內置選項
缺點
- 剛開始的學習過程較辛苦 - 建議高級用戶使用
使用 CMS 創建網站的步驟
我們以 WordPress 作為例子。到這個階段,您應該已經擁有一個虛擬主機帳戶和一個註冊域名。
步驟1:在網絡託管面板中找到 WordPress 的安裝程序
網絡託管服務通常都提供快速安裝器,可用於安裝 WordPress 和其他常見平台。
登錄網絡託管帳戶並找出安裝程序。著名的安裝程序包括:Softaculous, QuickInstall,和 Fantastico。
步驟2:使用安裝程序安裝 WordPress
Softaculous 是最著名的自動安裝程序,並且能在 cPanel 上找到它。我將使用 Softculous 分享安裝 WordPress 的過程。其他安裝程序的操作大同小異。
現在來到最重要的部分。
請按以下配置選項進行配置,其他字段保持默認配置(稍後再進行調整),然後點擊安裝。
- 協議選擇:您需要決定安裝 http:// 還是 http://www. 版本的網址。無論是哪個版本,它們都差異不大。從技術角度來看,http://www. 更加靈活且更容易管理 cookie。請注意,如果您擁有有效的 SSL 證書並想要安裝 WordPress,應該選擇 https 而不是 http。
- 域名: 選擇即將安裝的網站域名。
- 目錄:決定安裝 WordPress 網站的特定位置。如果您想要把它安裝在網址的根目錄上(例如:http://www.yourwebsite.com/),請將它留白。如果您想要安裝在網址的子目錄中(例如:http://www.yourwebsite.com/myblog/),請在該字段中指定目錄。
- 管理員帳戶:設置用戶名稱,密碼和電子郵件, 以用於登錄 WordPress 網站。
完成上述步驟後,恭喜您!您的網站已經上線了!
現在登錄您的 WordPress 網站。網站的登錄頁面將根據先前設置的網址結尾,看起來像是 wp-login.php。
步驟3:安裝主題和一些重要的插件
接下來,您需要安裝一個主題和一些必要的插件。請查看 WordPress 儀表板的左側邊欄。
WordPress 的目錄有無數個免費的 現成的主題 可供選擇。
要瀏覽這些免費主題,請到 “外觀 > 主題 > 添加新主題”,搜索合適的主題,然後單擊安裝建。
您還可以從“上傳主題”部分安裝第三方主題。如果您想要使用付費、專業設計的 WordPress 主題,我推薦 Elegant Themes (因為他們高效的代碼以及漂亮的前端設計)。
要添加插件,請瀏覽“插件 > 添加新插件。
搜索並安裝您所需要的插件。您也可以從“上傳插件”中安裝第三方插件。
我想在這裡推荐一些重要的免費插件。您可以在 WordPress 插件目錄中, 按名稱搜索找出它們。注意,每個類別只要安裝一個插件就足夠了。
- SEO:Yoast SEO,All in One SEO Pack
- 安全:iThemes Security, Wordfence Security
- 網站統計:Jetpack(來自·WordPress.com),Google Analytics for WordPress(來自 Monster Insights)
- 創建表格:Contact Form 7
- 提升性能: W3 Total Cache, WP Super Cache
即使您選擇了一個很棒的主題,也需要一些東西來提升網站的辨識度。網上有很多很棒的 商標生成器 ,我推薦使用 Logaster。它是一個付費平台,但它的優點在於提供分層定價。這意味著您只需要支付您需要的部分,比如您可能只需要網頁格式的商標;或者您可以訂閱整個品牌工具包,其中包含適用於多個平台的商標格式。
步驟4:你準備好了!
來到最後一個步驟,您的網站應該啟動了並且正在運行。但還有一些事情需要解決。
- 在“設置>常規”中:設置網站標題和標語。
- 在“設置>閱讀”中:設置主頁要顯示的內容以及每個頁面上顯示的博客帖子數量。
- 在“設置>永久鏈接”中:設置博客帖子的網址結構。
方法#3:使用網站建設器創建網站
網站建設器讓您輕鬆建立一個網站。即使您不了解編程語言,也可以在幾分鐘內啟動功能齊全的網站。網站建設器採用拖放式操作,即使沒有任何編碼知識也能輕鬆掌握。
網上有很多 許多網站建設器 ,但並不是每一個都符合您的需求。
以下是三個最熱門且有潛力的網站建設器。
Wix
Wix 是市面上最簡單使用的網站建設器之一。它擁有 500 多個可完全定制的模板,按類別分類。因此,您一定會找到適合的模板。
他們提供靈活的拖放式網站編輯器,在設計網站時出現在內容上方。您可以從列表中拖動項目,並將它放置在網站上的任何位置進行添加、移動或修改。
美中不足的是,當您註冊 Wix 的免費和連接域計劃時,網站上會出現廣告。您可以升級到Combo計劃以消除這些廣告,但每月至少需要花費8.50美元。
Hostinger 網站建設器(Zyro)
即使考慮到網站建設者的性質, Hostinger Website Builder 絕對易於使用。 如果您曾經使用過文字處理ssor 或類似的所見即所得 (WYSIWYG) 應用程序 – 使用該工具構建站點不會有問題。
它的理念是相同的。它就像是在搭積木,這些塊是預先設計的網站元素,例如圖像、文本框等。設計網站就像選擇元素一樣簡單,然後將它拖放到特定的位置。
點擊這裡,免費試用 Hostinger Website Builder
Weebly
Weebly 在多方面都非常容易使用,像是導航和用戶友好性等。他們提供數百個模板供您選擇,但個性化選項較有限。
他們提供大量預先設計的頁面佈局,可供使用和修改(例如關於頁面、定價頁面和聯繫頁面)。
拖放式構建器容易使用,但您只能在指定區域進行定制。此外,可用的擴展和第三方應用程序也受到一些限制。
4. 驗證 & 測試新網站
網站準備就緒後 – 是時候在各大瀏覽器(Chrome, Firefox、Safari、Microsoft Edge、IE 11 等)以及不同的屏幕尺寸進行網站驗證和測試了。
我們使用網上的免費工具進行這些測試。
標記驗證
什麼是標記驗證? 編碼語言或腳本,例如 HTML、PHP 等,都有自己的格式、詞彙和語法。標記驗證是檢查網站是否符合這些規範和標準的過程。
瀏覽器測試
5. 微調 & 擴展網站
將網站發佈到網上只是第一步。想要創建一個成功的網站,您還需要做很多事情。您可以從以下幾點開始...
網站速度
谷歌明確表明, 網站速度 是影響搜索排名的因素之一。這意味著網站加載的速度越快,它的排名更高。
此外,網站的加載速度越快,訪問者會更滿意。無數的案例和實驗證明,加載緩慢的網站會損害用戶體驗並影響網站收入。亞馬遜網站的速度只要減慢一秒鐘,就可能會損失 1.6 億美元的收入。
網站搜索可見性
SEMrush 的獨家促銷
目前有超過 1 萬人使用 SEMrush 為網站進行搜索引擎優化和內容營銷。使用我們的特殊鏈接進行註冊時,您將獲得 14 天的延長試用期(需要信用卡信息)> 點擊訂購
你不需要成為 搜索引擎優化(SEO) 大師來讓網站被看見。但是掌握一些基本的搜索引擎優化技能總是好的。
在 Google Search Console 創建一個網站管理員帳戶,以便將網站提交給Google,識別所有SEO問題。進行關鍵字研究,然後根據主要關鍵字來優化頁面標題和內容標題。在網站上實施結構標記,以使網站從搜索結果頁面中脫穎而出。
實施HTTPS
自從谷歌瀏覽器將 HTTP 網站標記為“不安全”後 — SSL 證書 變得非常重要。要確保網站被用戶“信任”,HTTPS連接是必要的。
擴大社交媒體平台上的影響力
網站還應該在社交媒體平台上具有一定的知名度,因為大多數目標受眾都會聚集在那裡。對於我們的網站而言,這包括:Facebook 和 Twitter。對於其他人而言,這可能是LinkedIn,Tumblr 或 Pinterest。
添加圖標
您在瀏覽器選項卡左側有看到藍色圓圈裡面的 “W” 字母嗎? 這就是“網站圖標”。與商標一樣,網站圖標是代表網站的較小的視覺元素。
圖標是一個巧妙的品牌推廣技巧,但常常被網站所有者忽略。如果這聽起來像您,那麼請使用 免費的圖標生成器 來幫助你。
網站上必不可少的頁面
沒有任何網站是完全相同的,因為它們的用途和/或功能不同。但是,每個網站都應該有三個標準頁面:索引(主頁)、關於頁面和聯繫頁面。
主頁
主頁是大多數訪問者訪問網站後會去的第一個地方。主頁應該提供正確的方向,並吸引訪問者更深入探索網站。
關於頁面
訪問頁面可以讓網站與訪客建立友好關係。它讓您進行自我介紹並提供有關網站的詳細信息。我們建議在這個頁面中包含網站所有者和運營者的照片。
聯繫我們
確保網站與用戶和潛在客戶能有良好的溝通是非常重要的。因此,聯繫人頁面是必要的。它應該列出所有溝通渠道(社交媒體用戶名,聯繫表,電子郵件地址等),以確保訪問者能夠與您聯繫。
最後
以上就是創建網站的所有步驟!現在,您所了解的知識足以創建和構建一個成功的網站了。是時候運用您的知識了。現在就在網上開拓一片天地吧!
精彩回顧:創建網站的分步過程
- 註冊域名
使用域名註冊商(Namecheap、GoDaddy 或 Hostinger)註冊獨特的域名,一個能代表企業品牌且容易記得的域名。
- 購買虛擬主機
選擇符合您需求的網絡託管服務提供商,無論您需要的是基本的軟件和空間,還是網站建設和管理服務。
- 創建和設計網站(3 種方法)
您可以在網絡開發人員的幫助下,或者使用以下三種方法之一創建和設計網站:1. 從頭開始創建,2. 使用 CMS,或 3. 使用網站構建器。使用方法#1,您可以在設計和網站功能方面獲得更大的靈活性,但需要對編程語言有一定的了解。使用方法#2和#3,則更加輕鬆創建和管理網站。您可以根據自己的能力選擇其中一種方法。
- 驗證和測試網站
使用標記驗證、瀏覽器測試和屏幕測試等免費工具驗證和測試網站與不同瀏覽器和屏幕尺寸的兼容性。
- 微調和發展網站
您可以通過改善網站速度、搜索可見性、使用HTTPS、提高社交媒體的知名度,以及添加標準頁面(如索引、關於和聯繫方式)來微調和擴展網站。
常見問題解答
免費建立網站的方法有兩種:使用 免費的虛擬主機 - 000Webhost 或是網站建設平台 - Wix,Wix 提供免費計劃。
GoDaddy 配合網站建設器推出了幾個計劃,價格從每月 10 美元起。
大多數網站構建器都很容易使用,適合初學者。本質上,網站構建器是為非技術人員所創建的,為用戶提供大量的幫助。這包括用戶友好的界面和預先構建的模板。
它與 創建博客一樣,在構建網站之前,您首先要了解您構建網站的用途。網站的意義和用途在設計和開發中能起到顯著的作用。
站編碼所需的時間取決於它的複雜性。您需要的功能和設計越多,所需的時間就越長。簡約,靜態的網站可以在短短幾個小時內完成編碼,而大型,複雜的網站則需要花費數月的時間。