為了建立網頁,你應該要先知道 「HTML」 — 用來建造網站架構的科技。 HTML 是用來辨認網頁中的內容該如何被解讀,例如說被解讀為:一個段落(paragraph)、清單(list)、文件標題(heading)、連結(link)、圖片(images)、多媒體撥放器(multimedia player)、表單(form)或是任何一個可使用的「元素(elements)」,甚至是你自己定義的新元素。


理想上,你應該從學習 HTML 開始你的學習旅程。可以先從閱讀 HTML介紹(Introduction to HTML) 開始。接下來你可以開始閱讀以下的進階主題:

  • HTML5 APIs
  • CSS, 和如何使用它來美化 HTML (例如改變文字大小和字形、加上邊框與陰影、用多欄位[columns]來排版你的頁面、增加動畫和視覺效果...)
  • JavaScript, 和如何使用它來為網頁增加互動性的功能 (例如將你的位置顯示在地圖上、點擊按鈕讓 UI 上的元素出現或消失、將用戶的一些資料存放在他們的電腦上... 等等)

當你開始閱讀這主題時,你至少必須對使用電腦有基礎了解,以及會基本的上網 (諸如網頁瀏覽、了解網頁內容)。而你需要建立一個已安裝基本軟體 (詳細軟體請參閱Installing basic software)的基礎工作環境,並且了解如何建立與管理檔案(詳細請參閱Dealing with files) — 這些都包含在新手 Web 入門的章節裡。

建議你在開始學習 HTML 這個項目之前,可以先 從網際網路開始 瞭解是如何運作的。儘管知道網路的運作不是必要的;大部分的項目都在 HTML basics 的文章中 Introduction to HTML 這個章節更詳盡地介紹 模組 (module), albeit。


這主題包含了以下幾個單元, 你可以根據以下順序來閱讀他們。強烈推薦從第一個單元開始讀起。

HTML介紹(Introduction to HTML)
This module sets the stage, getting you used to important concepts and syntax, looking at applying HTML to text, how to create hyperlinks, and how to use HTML to structure a webpage.
嵌入多媒體(Multimedia and embedding)
This module explores how to use HTML to include multimedia in your web pages, including the different ways that images can be included, and how to embed video, audio, and even entire other webpages.
表單與按鈕(Forms and buttons) (TBD)
Forms and buttons are a very important part of the Web — these allow your site visitors to input data and send it to you (e.g. registration, login and feedback forms), and you to implement controls for controlling complex functionality (for example submitting a form to the server, or pausing playback of a video.) This module gets you started.
表格(Tables) (TBD)
Representing tabular data on a webpage in an understandable, accessible way can be a challenge. This module covers basic table markup, along with more complex features such as implementing captions and summaries.

解決常見的 HTML 問題

Use HTML to solve common problems provides links to sections of content explaining how to use HTML to solve very common problems when creating a webpage: dealing with titles, adding images or videos, emphasizing content, creating a basic form, etc.


HTML (HyperText Markup Language) on MDN.
The main entry point for HTML documentation on MDN, from detailed element references to advanced tutorials.
HTML reference
A comprehensive reference guide to all the many features of the HTML language — if you want to know what attributes an element has, or what values an attribute has, for example, this is a great place to start.
HTML developer guide
More advanced guides and tutorials from the MDN HTML section.