網頁設計一開始從基本的學起，若是你還沒有任何的網頁設計軟體，那我會建議你可以什麼都不用急著找，就用電腦裡原本有的記事本小軟體來寫，其實就很好用了！
（（碎碎唸：畢竟還沒有開始學，就為了軟體而四處問人怎麼下載怎麼灌怎麼用，頭都暈囉～
OK~來~我們打開一個新的記事本~
嚇！好像熊熊聽到有人小聲的說不知道怎麼開記事本！
呃～好吧！在開始前我先教一下要如何開一個新的記事本，方法如下：
[如何開啟記事本編輯網頁]
方法1:
在你的桌面上任意空白處，按一下滑鼠的右鍵
選擇新增→文字文件
這樣就可以囉~
（（碎碎唸：相信大家只要用過一次，應該都會記得了，若是不記得，那就再回來查看一下吧～未來就不再提醒囉～
方法2:
在「開始功能鍵」→「附屬應用程式」點選「記事本」就可以囉~
好了～編寫的軟體解決了～
那快點開始我們的正題吧！
今天將會在短短的時間裡，你便可以編寫出你生平第一張的網頁！
[網頁編輯第一步]
首先我先來介紹HTML的寫法：
故名思義，在網頁裡你既然是要寫HTML那麼，請一開始就昭告大家，這是一張HTML的網頁吧～而不是什麼啊哩不答的黑帖～（扯遠了～）
在開頭的部份，請輸入以下文字：
<html>
</html>
這個意思是在告訴瀏覽器說，我現在寫的這一張是HTML的網頁喔～！
小重點：
請把它當作是傳說中的程式語言，（雖然它根本說不上是），但是它們有個特性就是有開頭，就要有結束！
如果說<html>是開頭的話，那麼它的結尾是什麼呢？
聰明的你一定想到了，沒錯就是</html>
好了，現在我們已經宣告了這張頁面是HTML了，那然後呢？
讓我插個題，一般而言，大部份的人在看別人的時候通常都是由上看到下，當然啦～有的人就會亂瞄......（（飛踢
那請你想想，當你在看網頁的時候又是怎麼看呢？是不是由上到下，由左至右呢？
所以在網頁的編寫裡面亦然如此～
我們把網頁當作是一個人來看的話，從頭開始，現在我們在剛才的語法裡面加頭部的語法進去
<html>
<head>
</head>
</html>
這樣便是開始要介紹你的網頁給大家認識囉～
首先先來講<head>的部份，這邊主要是用來告訴瀏覽器，你這張網頁的主要標題是什麼、用什麼語系寫的，或是其他一些設定等等之類的都會寫在這裡面～
而接下來頭部的描述我將再教你如何寫title，讓大家可以看到這張網頁的內容主要是什麼東西。
在剛才的<head> 裡面再加入以下的語法:
<html>
<head>
<title></title>
</head>
</html>
你可以在<title></title>中輸入你想輸入的字，例如：
<title>我怎麼會那麼帥之人見人愛大帥哥的生平第一張網頁</title>
反正現在是你自己孤芳自賞，再怎麼噁心都不會有人吐槽你的啦～放心大膽的寫下去吧～
在title的部份，你可以把它想像是額頭的部份，試想，你在你的額頭上貼著大大的「我是無敵大帥哥」、「我是宇宙第一大美女」的貼紙，別人能不好好看看你嗎？哈！
所以在title的部份你可以取的有趣一點的，特別一點的！
如果你和我一樣是屬上港有名聲、下港蓋出名的誠實不欺小郎君的話，那麼你可以寫的中規中矩，明明白白讓人一眼就知道這張網頁究竟是在寫些什麼，這樣也可以！
注意：
雖然是要讓人一眼就知道你想表達什麼，但千萬不要像是訃文一樣寫的落落長～那是會人家覺得反感的唷！！
OK~現在一張基本的網頁，到目前為止你已經完成80%了！
什麼？這麼快～？
別懷疑～真的就是那麼簡單～
剛才，自戀也自戀夠啦～不過，只是短短幾句怎麼可以清楚交待你神秘的特質以及美麗（帥氣）的外表呢！
我知道～我知道～肯定不夠對不對～
沒關係！
剛才那只是前菜，現在才要來主菜。
在</head>的下方加入<body></body>
<html>
<head>
<title>我怎麼會那麼帥之人見人愛大帥哥的生平第一張網頁</title>
</head>
<body>
</body>
</html>
在<body>的部份，就是可以讓我們儘情的放置我們想要告訴人家的訊息、圖片甚至是影音等等，這也是我們平常在網路上所看到各式各樣的網頁，
那今天就讓你來儘情發表你自己的帥氣度或是美麗值吧！
你可以這麼寫：
<html>
<head>
<title>我怎麼會那麼帥之人見人愛大帥哥的生平第一張網頁</title>
</head>
<body>沒錯！你沒看錯！你現在所看到的網頁就是在下我宇宙無敵前無古人後無來者獨一無二玉樹臨風.....（以下一萬字略）所寫的，看完了開心嗎？嘿嘿嘿，這是要收費滴～你以為是白看的啊！</body>
</html>
以上是小弟舉例而已，相信各位看倌一定會有更好的發揮空間和創作力，期待大家的作品。
這樣，就到了最後要存檔結束囉！
注意：
這裡是重點喔！
在存檔的時候，請記得以下幾件事情：
１）使用「另存新檔」的方式存檔
（（ 那個手腳太快的，已經按下存檔的傢伙，沒有關係～還是可以再點選＂另存新檔＂的啦～沒那麼硬斗啦～
２）
a.在設定檔名的時候，請務必使用英文或數字為檔名，而且第一個字必須是英文，多半網頁設計師都是會習慣把頁面的名稱設為容易記得的，而不是亂取什麼abc或是a123之類的。
原因是或許你現在在取名的時候圖方便所以亂取，但是日後當你已經是身經百戰的網頁設計大師的時候，回頭再找你那當初值得驕傲的人生第一張網頁的時候，那就是你會哭的時候了。
所以，請務必取一個你容易記得的英文檔名。
b.在取檔名的時候，請務必記好大小寫，以我的習慣都是小寫為開頭，若檔名必須要用的三個字才能說明的話，後面的英文便會使用大寫來加以區隔，
例：myHtml.html 或是 myFirstHtml.htm 諸如此類等等皆可。
３）取好檔名後，別忘了我們現在已經可以算是位入門級的網頁設計師學徒，我們剛才辛辛苦苦（？）所寫的HTML當然要在副檔名寫下.html 以告訴瀏覽器這張本大爺的重要著作，是張網頁來滴！
例如： resume.html
３）在「存檔類型」選擇「所有檔案」，這裡是一定的喔！不然以記事本是會很雞婆的幫你在後面又加上是純文字檔的副檔名，讓你剛才辛苦所寫出的來網頁，變成一張單純的文字稿而已，那就讓人ORZ了！！
４）在「編碼」選擇UTF-8，指的是萬國碼，呵～我們當然是希望不只是華人看的到，在未來也要讓外國人都看到咱做的網頁，當然一開始就要向國際邁進！
５）此刻，系統會很細心的詢問你真的要改嗎？ 當然，我們當然要改囉～不然怎麼看到我們的網頁呢？是吧～
那個～我似乎有聽到有人小聲的說～「我＂確定＂鍵按太快，在還沒來的及設定前就存好檔了，怎麼辦？！」
呃，阿雄～偶很語重心長的告訴你，下次要乖乖的看清楚步驟喔～手腳不要太快喔～（（拍肩
其實很簡單，只要就把存檔的步驟從頭再來一次就好囉～！
存好檔後，你可以看到你剛才原本是記事本的圖示，變成網頁檔的圖示！
連點兩下開啟，去看看你今天完成的成果吧～
快樂的時光總是過的特別的快～啾一下就過去囉～
不知道你學到了多少呢？期待下一次的教學～
大家一起加油吧～！
留言列表
