開始網頁設計編輯
目前工友最喜歡用的編輯軟體是之前有提到的homesites3.01版,但由於其界面全都是英文,且功能繁多,要在網路上呈現比較不易,而之前所介紹的htmlabc1.75由於安裝上有諸多的問題,因此,這一次,我們全都回歸原始吧!我們就以WINDOWS內附的「記事本」來作網頁吧!
首先開啟「記事本」(沒什麼意外的話應該是「開始」-「程式集」-「附屬應用程式」-「記事本」就能開啟了!)。
- 將以下的控制碼先複製起來。(當然您要用打的也行。)(用滑鼠將底下的一堆黑色部份的程式碼,標記起來,按滑鼠右鍵選擇【複製】就行啦!)然後將複製的東西貼到記事本上,如圖-01所示。(按滑鼠右鍵選擇【貼上】就行啦!)
<html>
<head>
<title>這是標題</title>
</head>
<body>
這裡是本文區
</body>
</html>
|
【標籤解說】
- 以上看到的就是一篇最簡單架構的網頁。沒錯,網頁其實就是一堆標籤(所謂標籤就是指被<>包起來的語法)集合起來的,透過瀏覽器的消化整理,就便成了美侖美奐的網頁了。
- 簡單而言,通常一份完整的網頁包含了二個部份:抬頭(HEAD)、文件本體(BODY)。也就是各位在上面所看到的<HEAD></HEAD>以及<BODY></BODY>。
- 在抬頭的部份<HEAD></HEAD>中,有另一組標籤<TITLE></TITLE>。打在<TITLE></TITLE>這裡面的文字會出現在瀏覽器視窗最上頭藍色部份裡,當作一篇網頁的主題。
- 您可能會發現,為什麼工友一直沒提到<HTML></HTML>這一組標籤,嗯!因為它可有可無。這一組標籤是告訴瀏覽器說:我是一份HTML文件喔!也就是說它是一個網頁的格式啦!通常都包在網頁的最上下兩端,將所有的原始碼都包起來。
【瀏覽剛做好的網頁】
- 剛剛有存檔了嗎?如果您是照工友的步驟的話,您的網頁應該是存在 c:\demo\demo.htm 。
- 工友以前剛做網頁時,常常會有一個疑問:我做好的網頁是不是要上傳到網路上去才能用瀏覽器來看?一直沒人能告訴我這答案,後來自己才發現,原來,網頁放在硬碟中也能看....。OK!在您瀏覽器的位址輸入欄裡輸入 C:\demo\demo.htm 或是 file:///C|/demow/demo.htm 吧!(因為每個瀏覽器開硬碟檔案的程序都不太一樣,所以用這樣的方法比較一致。)
- 如何看到您的第一個網頁了嗎?
【工友說...】
工友在這邊再說說一些比較重要的製作網頁規則:
- 一般而言,一個網站的首頁(就是第一頁啦!)名稱均訂為 index.htm 或是 index.html (一定要小寫喔!在網路上大小寫可是不一樣的!)這樣子的話,只要一進該網站,瀏覽器便會自動的找出 index.htm 這個檔,並且自動的去瀏覽index.htm的內容。
- 檔案大小寫一定要注意,沒事的話,檔名最好全部都用「英文小寫字母」來命名,因為,在我們的電腦中,INDEX.HTM和index.htm是一樣的檔案,但上了網路之後,網站伺服器可是會認為這是不同的兩個檔案,此時,若是沒注意,那可就糗大了!
- 您發現了嗎?同一個標籤,好像都有兩個,唯一不同的是,後面的那一組多了一個〝 / 〞,如:<BODY></BODY>。前面的<BODY>是起始標籤,後面的</BODY>是結束標籤。大部分的標籤都是二個一組,不過也有單一個的喔!這留著以後說。
- 目前我們所用的語法是 HTML 3.2 版,新的 HTML 4.0 也在前陣子出爐了,不過,有些功能瀏覽器還不支援,等工友觀望一陣子,再來整理 HTML 4.0的語法吧!
|