發(fā)布網(wǎng)站

一旦你編寫且整理好了你網(wǎng)頁的全部文件，你需要將它們?nèi)可蟼鞯骄W(wǎng)上別人才能看到。這篇文章向你展示了如何輕松地將你簡單的樣品傳到網(wǎng)上。

可供選擇的方法

---

發(fā)布一個(gè)網(wǎng)頁并不簡單，主要是因?yàn)槲覀冇刑喾椒ㄈネ瓿伤恕Ｔ谶@篇文章里我們并不準(zhǔn)備列出全部方法。 反而我們準(zhǔn)備從初學(xué)者的視角討論一下三種常見的方式的利弊。然后帶你看看我們將要使用的一種方法。

主機(jī)服務(wù)和域名

如果你想要去的你發(fā)布的網(wǎng)頁的完全控制，那么你將需要花錢購置以下：

• 主機(jī)服務(wù) — 在主機(jī)服務(wù)提供商的 web server 上租用文件空間。將你網(wǎng)站的文件上傳到這，然后服務(wù)器會(huì)響應(yīng)web用戶提出的要求。
• 域名(domain name) — 一個(gè)可以讓人們訪問的獨(dú)特的地址，像 http://www.mozilla.org，或http://www.bbc.co.uk. 你可以從 domain registrar 租借域名 。

許多專業(yè)的網(wǎng)站通過這種方法接入互聯(lián)網(wǎng)。

此外，你將需要一個(gè)文件傳輸協(xié)議（FTP）程序（點(diǎn)擊 How much does it cost: software 查看詳細(xì)信息）來將網(wǎng)站文件上傳到服務(wù)器。不同的 FTP 程序之間差別非常大， 但是通常你需要使用主機(jī)服務(wù)提供商給你的詳細(xì)信息連接到Web服務(wù)器（比如用戶名、密碼、主機(jī)名）。然后程序在兩個(gè)窗口里分別顯示本地文件和服務(wù)器文件，你可以在它們之間進(jìn)行傳輸：

尋找主機(jī)服務(wù)和域名的建議

• 我們不會(huì)推薦任何商業(yè)化的主機(jī)公司。要找到主機(jī)公司和域名注冊商，只需要搜索 "web hosting" 和 "domain names" 來找到一家出售域名的公司。所有這種類型的公司都允許你搜索你想要的域名。
• 你的家庭網(wǎng)絡(luò)或辦公網(wǎng)絡(luò)服務(wù)提供商可能會(huì)提供一些有限的小型主機(jī)空間。它們的空間都非常有限，但是它們會(huì)非常適合你的第一個(gè)實(shí)驗(yàn)的 — 聯(lián)系一下他們！
• 有一些免費(fèi)服務(wù)比如 Neocities， Blogspot 和 Wordpress。重復(fù)一遍，一分錢一分貨，不過它們對于你的初次實(shí)驗(yàn)可能會(huì)是很理想的。免費(fèi)服務(wù)大部分也不需要 FTP 軟件來上傳文件 — 你只需要將文件拖入到它們網(wǎng)頁的界面里。
• 有時(shí)公司會(huì)打包提供主機(jī)服務(wù)和域名的。

使用在線工具如 GitHub 或 Dropbox

有一些工具能使你在線發(fā)布網(wǎng)站：

• GitHub 是一個(gè)"社交編程"網(wǎng)站。它允許你上傳代碼庫并儲(chǔ)存在 Git 版本控制系統(tǒng)里。然后你可以協(xié)作代碼項(xiàng)目，系統(tǒng)是默認(rèn)開源的，意味著世界上任何人都可以找到你 GitHub 上的代碼。這是一個(gè)非常重要、有用的社區(qū)，而且 Git/GitHub 是非常流行的 version control system — 大部分科技公司在工作中使用它。GitHub 有一個(gè)非常有用的特點(diǎn)叫 GitHub pages，允許你將網(wǎng)站代碼放在網(wǎng)上。
• Dropbox 是一個(gè)允許你在保存文件在網(wǎng)上并可從任何計(jì)算機(jī)中獲取的文件存儲(chǔ)系統(tǒng)。任何接入互聯(lián)網(wǎng)的人都可以進(jìn)入你設(shè)置為公開的文件目錄。如果那個(gè)文件夾內(nèi)包含網(wǎng)站文件，它將被自動(dòng)視為一個(gè)網(wǎng)站。點(diǎn)擊 Host websites With Dropbox 查看更多信息。

不像大量其他的主機(jī)，這類工具通常是免費(fèi)的，不過你只能使用有限的功能。

使用像 Thimble 的基于Web的集成開發(fā)環(huán)境

有許多web應(yīng)用能夠仿真一個(gè)網(wǎng)站開發(fā)環(huán)境，允許你輸入 HTML、CSS 和 JavaScript 然后顯示代碼的結(jié)果 —— 全部在一個(gè)標(biāo)簽頁里！通常這些工具都很簡單，對學(xué)習(xí)很有幫助，而且是免費(fèi)的（基本功能），它們在一個(gè)獨(dú)特的地址顯示你提交的網(wǎng)頁。不過，基礎(chǔ)功能是很有限的，而且這些應(yīng)用通常不提供如圖像的內(nèi)容的主機(jī)空間。

使用一下以下幾種工具，看看你最喜歡哪一個(gè)：

• JSFiddle
• Thimble
• JSBin

通過GitHub發(fā)布

---

現(xiàn)在我們將講述如何通過GitHub發(fā)布你的網(wǎng)站。我們并沒有說這是唯一的甚至是最好的方法，只是因?yàn)樗敲赓M(fèi)的，并且非常簡單，在你學(xué)習(xí)的道路上試著發(fā)現(xiàn)其他新的方法。

安裝

1. 首先，install Git 在機(jī)器上安裝Git。這是 GitHub 工作的基礎(chǔ)版本控制系統(tǒng)。
2. 接下來， sign up for a GitHub account 注冊一個(gè) GitHub 賬號(hào)，so easy~
3. 注冊完之后，登錄 github.com 。
4. 接下來，你需要?jiǎng)?chuàng)建一個(gè)新的倉庫來存放你的文件。點(diǎn)擊 GitHub 主頁右上方的的 Plus(+) ，然后選擇 New Repository。
5. 在這個(gè)頁面上，在 Repository name 輸入框里輸入 username.github.io，username 是你的用戶名。比如，我們的朋友 bobsmith 會(huì)輸入 bobsmith.github.io。
6. 點(diǎn)擊 Create repository； 然后會(huì)跳轉(zhuǎn)到這一頁面：

將文件上傳到 GitHub

這是我們使用命令行來上傳我們的倉庫到 GitHub 的地方。命令行是你輸入命令來完成像新建文件和運(yùn)行程序等操作的地方，與在用戶界面點(diǎn)擊不同。命令行大概是這個(gè)樣子：

任何系統(tǒng)都自帶命令行工具：

• Windows：命令提示符(Command Prompt) 可以點(diǎn)擊開始菜單，輸入命令提示符，在出現(xiàn)的列表中選中打開。注意 Windows和 Linux 還有 OS X 有不同的命令規(guī)則，所以下面的命令可能在你的機(jī)器上有所不同。
• OS X：終端(Terminal) 在 應(yīng)用 > 工具。
• Linux：通常你可以按下 Ctrl + Alt + T 呼出命令行。 如果那沒有起作用，在應(yīng)用欄或菜單里找到終端(Terminal)。

這看起來好像很麻煩，不過別擔(dān)心 — 你很快就會(huì)掌握這些基礎(chǔ)的。你通過在終端里鍵入命令并按回車來告訴計(jì)算機(jī)執(zhí)行相應(yīng)的命令。

1. 從命令行進(jìn)入test-site目錄（或者其他包含網(wǎng)站文件的目錄名）。在這里我們使用cd命令（也就是 “改變 目錄"）。 下面是如果你將test-site 放在桌面上時(shí)應(yīng)該輸入的命令：

   cd Desktop/test-site

2. 當(dāng)使用命令行進(jìn)入你的目錄后，輸入下面的命令來告訴git工具來將這個(gè)目錄上傳到 git 倉庫：

   git init

3. 接下來回到 GitHub 網(wǎng)站。在當(dāng)前頁面上，看到 push an existing repository from the command line 這一部分。你應(yīng)該看到了兩行代碼。拷貝第一行代碼粘貼到命令行，然后按回車。命令行應(yīng)該像下面這樣：

   git remote add origin https://github.com/bobsmith/bobsmith.github.io.git

4. 接下來，輸入下面兩個(gè)命令，在每一行輸入完后按下回車。這兩個(gè)命令為上傳到 GitHub 做好準(zhǔn)備，并且要求 Git 來管理文件。

   git add --all
   git commit -m 'adding my files to my repository'

5. 最后，輸入我們在第三步里看到的第二行命令：

   git push -u origin master

6. 現(xiàn)在當(dāng)你在新標(biāo)簽頁打開你的 GitHub 頁面時(shí) (username.github.io)，你應(yīng)該可以看到你的網(wǎng)頁了！通知你的朋友們來看看你的杰作！

更多關(guān)于 GitHub

如果你想對你的網(wǎng)頁做更多改變并且上傳到 GitHub，你只需要像你之前一樣更改文件。然后，你只要輸入下列命令（每個(gè)命令后記得回車）來在 GitHub 上做出更改：

git add --all
git commit -m 'another commit'
git push

你可以將 another commit 換成其他更適合描述你所做的更改的提示。

我們只講述了一點(diǎn)點(diǎn) Git 的知識(shí)，要深入學(xué)習(xí)，請?jiān)L問 GitHub Help site。

結(jié)論

---

到此為止，你應(yīng)該將你的網(wǎng)頁上傳到了特定的網(wǎng)址。非常棒！

延展閱讀

• What is a web server
• Understanding domain names
• How much does it cost to do something on the web?
• Cheap or free static web hosting by Scott Murray has some useful ideas on available services.