Transcript 上傳網頁

第 20 章
申請網頁空間
並上傳網頁
著作權所有 © 旗標出版股份有限公司
本章重點
免費網頁空間
► 20-2 利用 Dreamweaver 上傳網站
► 20-3 使用 CuteFTP 上傳網站
► 20-4 讓網址更好記 - 申請轉址服務
► 20-5 讓網站的人氣更旺
► 20-1
2
20-1 免費網頁空間
► 通常有向
ISP 申請上網服務, 幾乎都有提供免
費的網頁空間及電子郵件信箱等附加服務供您
使用。
► 若覺得免費網路空間的容量不敷使用, 有些
ISP 也提供付費的網站空間供人申請, 但是申
請方式與收費標準不一, 建議您到各 ISP 網站
詢問。
3
20-1-1 選擇網頁空間的建議
► 若您沒有
ISP 附贈的免費網頁空間, 或是想要
再申請多個免費空間, 可以上網搜尋提供此服
務的網站。
► Internet 上的免費網站空間很多, 在申請前最好
比較各家網站的服務, 再決定要申請哪一家, 以
下列出幾點供您參考比較。
►
網站主機在國內或國外：如果您的英文不太通,
那麼國內的免費網站空間是您的最佳選擇 (至少
申請流程都是中文)；
4
選擇網頁空間的建議
如果沒有這方面的顧慮, 那麼可考慮申請國外的
免費網站空間, 通常提供的服務比較多, 例如空
間可能比較大, 可支援 CGI、ASP、…等, 不過
網頁在瀏覽時的速度可能會比較慢一點。
► 網站空間的容量：免費的網站空間提供 10 MB
〜50 MB 不等的容量, 甚至有的網站會提供
「無限空間」呢！
► 您可先評估一下自己的網站需要多大容量, 再去
申請一個適合的網站空間。
►
5
選擇網頁空間的建議
另外, 有些網站則是採取小額付費制, 只要繳交
年費就可享用更大的網站空間、或是無廣告視
窗、可提供網站轉址、…等服務。
► 是否可放 CGI、ASP、PHP 等程式：CGI、
ASP、PHP 通常是用來製作計數器、留言版、
討論區等元件, 或是其他互動式的表單處理。
► 如果您從網路上取得現成的程式、或者自己手
動撰寫, 而想要把它們放到網站裡面, 那得事先
看看有哪些免費空間可讓您放置這些程式,
► 由於這些程式會加重伺服器的負擔, 所以並非所
有免費網站空間都有支援。
►
6
選擇網頁空間的建議
廣告的出現方式：免費網站空間通常有附帶廣
告, 一般都是自動彈出快顯視窗, 有些則是將廣
告內嵌在網頁中, 總之想免費使用的話, 就得忍
受一下小小的不便啦！
► 檔案上傳的方式：大部分的網站都允許您使用
FTP 的方式來上傳檔案, 不過有些只能使用該
網站裡的圖形介面來上傳, 雖然操作方法並不難,
但得要逐一選取檔案才能上傳, 若是網頁檔案很
多, 這樣的做法將會浪費不少時間。
►
7
選擇網頁空間的建議
流量限制：大部分的免費網頁空間還需特別注
意一點, 即是會限制下載的流量。
► 也就是說萬一您的網站流量需求很大, 可能就要
慎重評估各網站提供的限制了。
►
8
20-1-2 哪裡找免費的網站空間
► 其實只要在各大入口網站或搜尋引擎網站輸入
"免費網站" 或 "免費網頁空間" 等關鍵字, 就可
以找到免費網站空間的資源, 以下列出幾個供
大家參考：
9
哪裡找免費的網站空間
► 不論申請哪一家的免費網站空間,
只要依照網
站中的指示輸入個人相關資料, 都可以順利完
成申請。
► 若是還有疑問可參考各網站所列的問題集
(FAQ), 裡面彙整大多數網友會遇到的問題, 能
讓您順利排除許多可能發生的狀況。
10
20-2 利用 Dreamweaver 上傳網站
► 網頁空間申請好了之後,
就可以將自己電腦裡
的網站上傳到網路伺服器中。
► 接下來將分別介紹如何利用 Dreamweaver 內
建的 FTP 功能, 或是使用其他 FTP 軟體來上
傳網站, 請視自己的需求選擇上傳的方式。
11
20-2-1 設定欲上傳的伺服器位址
► 為了要讓
Dreamweaver 知道檔案要上傳到哪
裡, 所以我們得先在 Dreamweaver 中設定要
上傳的伺服器位址, 請如下操作：
1. 在 Dreamweaver 中, 我們可以利用檔案面板
來進行網頁上傳工作。
► 為了方便上傳操作, 請按下檔案面板上的擴展 /
收合鈕, 將檔案面板以獨立的視窗顯示 (這樣可
視範圍會比較大)。
►
12
設定欲上傳的伺服器位址
►
2. 接著按下左邊窗格的定義遠端網站, 設定遠
端網站伺服器的位址：
13
設定欲上傳的伺服器位址
14
設定欲上傳的伺服器位址
►
3. 接下來要指定遠端網站伺服器的位址, 請在
開啟交談窗後切換到進階頁次：
15
設定欲上傳的伺服器位址
16
設定欲上傳的伺服器位址
►
4. 接著會出現提示交談窗告訴您會重新建立快
取, 請按下確定鈕, 即會回到檔案視窗。
17
設定欲上傳的伺服器位址
18
關於 FTP 主機位址
► 要注意的是,
「WWW 網站的位址」和「FTP
的上傳位址」是不一樣的,
► 例如要上傳網頁到 Hinet 的個人空間, FTP 位
址必須輸入 "ftp.myweb.hinet.net", 所以一定要
事先在提供服務的網站查清楚 FTP 上傳位址。
19
20-2-2 與遠端伺服器連接
► 設定好遠端網站後,
現在要和遠端主機連上線,
才能進行上傳的動作, 請按下連線至遠端主機
鈕, Dreamweaver 就會自動與遠端伺服器連線。
20
遠端與本地端
►在
Dreamweaver 中, 上傳的網站伺服器通常
稱為遠端 (Remote), 而自己電腦裡的網站稱為
本地端 (Local)。
► 不要把「遠端」想得有多遠, 不管網站伺服器
是在台北、美國、你家樓下或是隔壁座位的電
腦, 只要是供您上傳的主機, 都可叫做遠端網站
(Remote Site)。
21
20-2-3 上傳網頁
► 經過前面的設定後,
終於可以開始上傳網頁了,
由於這是我們第一次上傳, 所以當然是要將所
有的檔案都傳送上去。
► 請在右邊窗格 (本地端) 點選最上層的根目錄
(或是選取所有檔案), 再按上傳檔案鈕, 即可整
個網站內容上傳到遠端網站裡：
22
上傳網頁
23
上傳網頁
24
上傳網頁
► 檔案上傳完畢後,
您就可以開啟瀏覽器, 輸入自
己所申請的網址測試網站是否能正常運作。
25
上傳網頁
► 以後若要再將網站上傳到同樣的遠端主機,
就
不必再重新設定 FTP 主機位址, 只要按一下
鈕, 就可以立即與遠端網站連接。
26
網站上傳後看不到圖片？
► 網站上傳後,
若在瀏覽網頁時發現要顯示圖片
的地方出現 圖示, 表示該圖片無法顯示, 其原
因可能有以下幾項：
本地端的圖片檔案可能沒有上傳。
► 插入圖片時使用了絕對路徑, 而非相對路徑。
► 檔案大小寫不同, 或是使用了中文檔名。
► 圖片的格式不支援 (一般瀏覽器僅支援 JPG、
GIF、PNG 3 種格式)。
►
27
上傳檔案後可能遇到的問題
► 有些情況會使得檔案無法成功上傳,
例如在上
傳整個網站的過程中, 突然網路斷線或是遠端
網站暫停服務, 那麼上傳狀態交談窗會出現檔
案活動未完成的訊息來提示您。
28
上傳檔案後可能遇到的問題
29
上傳檔案後可能遇到的問題
► 若需要重新上傳無法成功上傳的檔案、或是有
新的檔案需要上傳, 只要直接將檔案拖曳到欲
存放的遠端資料夾中即可。
30
20-3 使用 CuteFTP 上傳網站
► 之前介紹過
CuteFTP 的下載功能, 現在我們要
使用 CuteFTP 將網站上傳到遠端伺服器中。
► 請先參照 8-3-2 節的方法安裝並啟動 CuteFTP,
接著再設定要連結的伺服器位址：
31
使用 CuteFTP 上傳網站
32
使用 CuteFTP 上傳網站
► 連上
FTP 站台後, 就可以拉曳的方式傳輸檔案
了：
33
使用 CuteFTP 上傳網站
34
20-4 讓網址更好記 - 申請轉址服務
► 不論您是申請付費或是免費的網頁空間,
通常
只要在完成申請手續後, 便可取得一個網址。
然而通常網站空間服務提供者給的網址都不太
好記。例如：
http://yourname.myweb.hinet.net。
► 轉址服務簡單地說就是：「可以讓您的網址變
得又短又好記」。
► 例如 idv.st 這個提供轉址服務的網站, 只要加
入會員後, 就會依據您所申請的帳號加上該站
台的網域名稱來當作您的網址,
35
讓網址更好記 - 申請轉址服務
► 假如您申請的帳號為
"digitalweb", 則您的網址
就是 "http://digitalweb.idv.st", 不管您原本的網
址有多難記、或是一直不停地換網址, 只要設
定好轉址服務, 別人就可以永遠用同一個簡單
的網址連上您的網站。
36
20-4-1 申請轉址服務
► 目前提供轉址服務的網站大多為免費,
不過也
有些較具規模的站台是採取收費的方式來提供
服務, 不過既然是採取收費制, 所提供的服務當
然就會比較好。
► 至於要選擇免費或是收費的轉址服務, 就得視
您的需求而定, 以下提供幾家提供免費轉址服
務的網站供您參考：
37
申請轉址服務
38
申請轉址服務
► 不論申請哪一家的轉址服務,
只要依照網站中
的指示即可順利完成申請。
► 若是還有疑問可參考各網站的相關說明與解答,
多半可找到有幫助的答案。
► 當申請好轉址後, 往後只要輸入轉址後的簡短
網址, 即可連結至您的網站, 不需再擔心網址太
長的問題了。
39
申請轉址服務
40
20-5 讓網站的人氣更旺
► 好不容易將網頁上傳到
Internet 上了, 但是網
站何其多, 別人怎麼知道您的網站到底在哪裡
呢？
► 這就要靠「廣告」來打知名度了；當然這裡不
是要您花大錢去電視上做廣告, 其實 Internet
就是一個超大型的廣告媒體喔！
41
20-5-1 廣發 E-mail 英雄帖
► 要推廣網站,
最簡單的方法就是發 E-mail 給每
個親朋好友, 並簡單介紹一下網站的內容、特
色, 請他們到您的網站來逛逛。
► 如果不太好意思這樣做, 也可以在 Email 的簽
名檔中加上網站位址、簡介, 這樣不管是寄信
給別人、或發佈信件到 BBS、新聞群組, 都可
以名正言順地替網站打打廣告。
42
20-5-2 在各大 BBS 發佈消息
► 每天有很多人在
BBS 上閒逛, 因此您可以把網
站簡介發佈在相關的討論群組裡面, 例如
http://bbs.openfind.com.tw/。
► 但切記不要一次發很多封, 也不要到不相干的
群組裡打廣告, 否則反而會被別人嫌, 造成反效
果呢！
43
20-5-3 到各大搜尋引擎網站登錄
► 假設您今天想去逛逛有關電影介紹的網站,
但
完全不知道網址, 這時您會到哪裡查詢呢？
► 對了！想必 Google、Yahoo! 奇摩、
PChome、…等網站將是您的第一選擇；因此
我們最好也在這些網站登錄自己的網站, 讓別
人在尋找相關資料時能發現您精心設計的網站！
► 不過有些大型入口網站所提供的網站登錄服務
需要另外付費, 若不想額外付費又想達到宣傳
效果, 也有網站提供免費服務, 但相對地排列順
序自然就沒有付費者來得前面囉！
44
到各大搜尋引擎網站登錄
45
20-5-4 在網頁中加入關鍵字讓網頁
更容易被搜尋
► 當我們在製作網頁時,
可以在網頁中加入一些
隱藏的關鍵字 (不會顯示在網頁上), 使瀏覽者
更容易透過搜尋引擎找到您的網頁。
► 請在 Dreamweaver 中開啟要新增關鍵字的網
頁, 然後如下操作：
46
在網頁中加入關鍵字讓網頁更容易
被搜尋
► 日後若要修改網頁關鍵字的內容,
或想將此功
能刪除, 請執行『檢視 / 檔頭內容』命令開啟
檔頭內容檢視區, 接著按下關鍵字鈕, 即可在屬
性面板中做修改：
47
在網頁中加入關鍵字讓網頁更容易
被搜尋
48
20-5-5 在網站或部落格中加入連結
► 若是您的親朋好友也有建立網站,
那麼大家不
妨互相交換一下網站的連結, 或是製作網站的
Logo, 放在別人的網站裡, 透過網網相連的方
式, 也能夠為自己的網站提高知名度喔！
► 另外現在非常流行的部落格, 也是宣傳網站的
最佳去處喔！
49
在網站或部落格中加入連結
50