只針對完全沒有接觸過網頁制作的想學習網頁制作的新手朋友。所以就以最簡單的文字加圖片為內容的網頁來舉例。希望通過最簡單的東西，讓你了解到一個網頁的制作過程，從而延伸到復雜的網頁設計做好準備。什么事都是從簡單到復雜。
Only to no contact with web page made want to learn to make new friends. So in the most simple words and pictures for the content of the web page for example. Hope that through the most simple things, let you know that the process of making a web page to extend to prepare complex web design. Everything from simple to complex.
代碼編輯器：UE32，Editeplus、notepad++等
Code editor: UE32, Editeplus, notepad + +, etc
IDE編輯器：Dreavweave
IDE editor: Dreavweave
平面制作軟件：
Print production software:
photoshop
photoshop
fireworks
fireworks
illustrator
illustrator
先確認你的系統中文件擴展名已經打開。方法是：打開我的電腦，點擊文件夾選項，打開文件夾選項對話框，確?！半[藏已知文件的擴展名”前面的小勾已經去掉，如果沒有去掉，請把小勾去掉。
Make sure your file extensions already open in the system. Method is: open my computer, click on the folder options, open the folder options dialog, make sure that "hide file extensions known" in front of the small hook has removed, if you don't take out, please remove the small hook.
創建你的第一個網頁文件。為了便于管理，請先創建一個文件夾，用來存放你的網頁文件和圖片等資料。在你創建的文件夾中右擊，選擇新建，文本文件：
Create your first web page file. In order to facilitate management, please create a folder, file used to store your web pages and images, etc. In the right-click, you create a folder and choose new text file:
對這個文件重命名為index,把小點后面的txt改為html。這樣一個網頁文件就準備好了。
Rename the file, index, the bit at the back of the TXT to HTML. Such a web page file will be ready.
html是網頁文件的擴展名。擴展名用來區分文件的類型，擴展名也用來告訴用哪個軟件打開。比如html就會告訴瀏覽器這是一個網頁，需要用網頁的方式來解析并顯示。
HTML is the web page file extension. Extension used to distinguish the file type, extensions are also used to tell with which software to open. Such as HTML would tell this is a web browser, the need to parse and display the page.
用notepad++打開這個index.html文件
Use notepad + + open this index. The HTML file
在編寫之前，我們有必要先來了解一下一個網頁最基本的結構：網頁有頭部和主體兩大部分組成。頭部和主體都包含在一對標簽之內。因為網頁是html語言編寫的，html語言是一門標記語言，就是用一對對的標簽來標記網頁中的內容，從而對內容進行組織和管理。
Before writing, it is necessary for us to know about the first of a web page is the most basic structure: web page consists of the head and body of two parts. The head and body are included within a pair of < HTML > tag. Because web page is written in HTML language, HTML is a markup language, is to use the pairs of tags to mark the page content, to organize and manage the content.
標簽就是網頁中內容的容器。
Container labels is the web page content.
每個網頁都有頭部和主體。
Each page has the head and body.
如下圖所示，整體的最外層標簽是和,頭部是和標簽。在標簽中，又可以寫
(標題)等標簽。而<head>標簽內的內容一般是不會顯示在瀏覽器窗口中的。顯示在瀏覽器窗口給我們看的內容，都在<body></body>標簽里。
As shown in the figure below, the outermost layers of the whole tag is < HTML > and < / HTML >, the head is the < head > and < / head > tag. In the < head > tag, and can write the < title > tag (title). Inside the < head > tag of the content is generally not be displayed in the browser window. Displayed in the browser window for us, the contents of the < body > < / body > tag.
了解了網頁的基本結構，我們就開始來寫一段完整的網頁代碼 ：
Understand the basic structure of web pages, we began to write a complete web page code:
<html>
< HTML >
<head>
The < head >
<title>這是網頁的標題 The < title > this is the title of the page < / title >
The < / head >
The < body >
這是一個一級標題
< h1 > this is a primary title < / h1 >
這是一個段落
< p > this is a paragraph < / p >
The < / body >
The < / HTML >
在notepad++中編輯的情景如下：
In the notepad + + editor scenario is as follows:
保存之后我們在瀏覽器中預覽，效果如下圖。上面我們說過，標簽里的內容不會顯示在瀏覽器中，但是我們在中寫了一句：
這是網頁的標題，如果你細心就會發現，在瀏覽器的標簽選項卡上顯示了“這是網頁的標題”這幾個字。
Save after we in the browser preview, the effect is the diagram below. We have said above, the content in the < head > tags will not display in the browser, but we write in the < head >, < title > this is the title of the page < / title >, if you carefully will find that, in the browser's tags TAB shows the words "this is the title of the page".
原來網頁標題就是顯示在瀏覽器標題欄上的內容。網頁的標題不等于內容的標題，于是我們寫的
這是一個一級標題
，它被顯示在瀏覽器窗口中。
The page title is displayed in the browser the content on the title bar. The title of the page is not equal to the title of the content, so we write the < h1 > title < / h1 > this is a level, it is displayed in the browser window.
