研習資料

1. 什麼是 HTML? 什麼是HTML 檔案?
   What is HTML? What are HTML files?
    
2. 如何學習 HTML?
   How do I learn HTML?
    
3. 如何做出超炫的網頁?
   How do I make kickass web pages?
    

什麼是 HTML? 什麼是 HTML檔案?
What is HTML? What are HTML files?

HTML 表示超文本標示語言( Hypertext Markup Language)。 HTML 包含一些指令可用來標示你的文字。透過網頁瀏覽器檢視時，那些難看的指令不會顯示在頁面上，而是會影響你的文字外觀。HTML 檔案就是加註有 HTML 的文字檔案。 

HTML stands for Hypertext Markup Language. HTML comprises of a number of commands that you can use to annotate your text. When viewed through a web browser, those ugly commands will not appear on screen. Instead, the commands will affect the appearance of your text. HTML files are simply text files with HTML annotations added to them.

例如，你有一行文字:暴風雨的黑夜。

For example, say you have a line of text:

It was a dark and stormy night.

我們用HTML加上粗體:

This is how we boldface the text with HTML:

<b>暴風雨的黑夜。<b>

<b>It was a dark and stormy night.</b>

從瀏覽器看的樣子是:

When viewed through a web browser, it looks like this:

暴風雨的黑夜。

It was a dark and stormy night.

一點都不難吧? 在 HTML中，我們稱這些為標記標籤。你可以在任何文字編輯器中製作 HTML 網頁，從 Microsoft Word 到 Windows Notepad都行。 我在 Apple's Stickies 上隨便做了一個網頁，就像上面的一樣。記得要以 '.html' 儲存。 ('.htm' 有時也可以，但保持一致較好 ) 

Not too difficult, eh? In HTML, we call those annotations tags. You can create HTML pages in any text editor, from Microsoft® Word to Windows® Notepad. I have cooked up quick-and-dirty pages in Apple's Stickies, just like the one above. Just remember to save your files with a '.html' at the end. ('.htm' sometimes works, but it helps to be consistent)


如何學習 HTML?
How do I learn HTML?

很可惜，這堂課的範圍並不在於教導HTML細節。這不是一個「如何做某某東西」的課程。但是網路上有一些很好的HTML 入門網站，如果你要以寫HTML 網頁為第一個專題，你應該要仔細研讀。

Unfortunately, teaching all the nuts and bolts of HTML is beyond the scope of this class. As Ed keeps repeating, "this isn't a how-to class". However, there are some excellent primers on HTML on the web, which you should examine carefully if you want to write HTML pages for your first project.

• Joe Barta's So You Want to Make a Web Page!
• NCSA Beginner's Guide to HTML

有很多這樣的網站。找一個容易明白的網站，並且花點時間研究教學影片和範例，然後再開始你自己的網頁設計。

There are many, many more on the web. Find one that's easy to read and take time to work through their tutorials and examples before starting on your own page designs.

如何做出超炫的網頁?
How do I make Kickass Web Pages?

你不需要表現HTML /Java /cgi-bin的各種高難度花招來爭取高分。專注在你的寫作風格和想法，而不是在兩星期內成為 HTML高手。簡單的網頁和用心琢磨的文字，勝過花俏而沒內容的網頁。所有的網頁出版品都是如此，尤其是這堂課。 此外，簡單的網頁在許多不同瀏覽器和電腦上的呈現較為一致，讓你可以更輕鬆報告。

You don't really have to pull all sorts of weird HTML/Java®/cgi-bin tricks to do well in this class. Concentrate on your writing style and your ideas, rather than trying to master HTML in two weeks. A simple page with well-chosen words and sentences is much more desirable than a pretty page with little content. This applies to most web publishing, but is particularly relevant in this class. Plus, a simple web page is more likely to look consistent over many different computers and browsers, which makes presenting your page much easier.

當然，如果你是箇中高手，想要以與眾不同的方式說故事，那就盡情發揮吧！以各種方式將你的想法以文字和影像呈現出來，但是不要讓網頁技巧與你的故事喧賓奪主。

Of course, if you're already well-versed in all sorts of web tricks and would like to use them to tell stories in a radically different way, be our guest. And by all means, put thought into the layout of your text and images. But don't obsess over the technology at the expense of your story.

The Bare Bones Guide to HTML 解救我好幾次。開始學 HTML 編碼時，記得隨時參考。

The Bare Bones Guide to HTML has saved my hide over and over again. Keep it by your side when you're starting your HTML coding session.