Chủ đề nóng: Phương pháp kỷ luật tích cực - Cổ học tinh hoa - Những thói hư tật xấu của người Việt - Công lý: Việc đúng nên làm - Giáo án Điện tử - Sách giáo khoa - Học tiếng Anh - Bài giảng trực tuyến - Món ăn bài thuốc - Chăm sóc bà bầu - Môi trường - Tiết kiệm điện - Nhi khoa - Ung thư - Tác hại của thuốc lá - Các kỹ thuật dạy học tích cực
- Dạy học phát triển năng lực - Chương trình giáo dục phổ thông
Tạo một trang web đơn giản với HTML
Từ VLOS
Ngày nay, bạn có thể tạo một website (trang mạng) mà không cần biết gì về HTML, tuy nhiên, dù sử dụng trình chỉnh sửa trang web nào thì bạn vẫn có thể gặp phải những vấn đề không tránh khỏi và cần một chút kiến thức về HTML để khắc phục điều đó. Có rất nhiều trang web thích hợp để bạn có thể tìm hiểu về HTML, nhưng bài viết này sẽ hướng dẫn bạn đôi điều cơ bản để tạo một website bằng cách sử dụng HTML. Với những hướng dẫn cơ bản này, bạn sẽ sớm tạo được một trang web từ đầu - dù không chuyên nghiệp!
Các bước[sửa]
Sử dụng HTML[sửa]
-
Hiểu
HTML
là
gì.
HTML
(Hyper
Text
Markup
Language)
là
ngôn
ngữ
mã
hóa
tạo
nên
các
trang
web,
nó
như
bộ
khung
của
mọi
trang
web
tồn
tại.
Để
biết
“khung
xương”
này
trông
ra
sao,
mở
Internet
Explorer
lên,
điều
hướng
đến
bất
kỳ
trang
web
nào,
nhấp
chuột
phải
vào
trang
web
và
chọn
"View
Source"
(Xem
Nguồn).
Bạn
sẽ
thấy
một
trang
mã,
đây
chính
là
HTML.
Trình
duyệt
sẽ
nhận
biết
mã
này
và
chuyển
thể
nó
thành
một
trang
web
thân
thiện
với
chúng
ta.
- Trên Google Chrome, nhấn F12.
- Trên Mozilla Firefox, nhấn Ctrl + U để xem mã nguồn trang web.
- Trên Safari, chọn View→View Source (hay Option + Command + U).
-
Tạo
trang
web
đầu
tay
của
mình
đơn
giản
hết
mức
có
thể.
Nếu
không,
bạn
sẽ
sớm
bị
choáng
ngợp
bởi
những
cú
pháp
và
ngôn
ngữ
lập
trình.
- Điều quan trọng cần nhớ là bạn phải viết nội dung của mình giữa thẻ HTML mở và đóng. Đây là một thẻ mở: <___> . Còn đây là một thẻ đóng: </___> . Cuối cùng, phần ___ sẽ được thay bằng mã.
- Đi đến "Start" > "Programs" (Chương trình) > "Accessories" (Phụ kiện) > "Notepad". Sẽ dễ hơn nữa nếu bạn sử dụng Notepad++ vì khi bạn chọn ngôn ngữ HTML, tất cả những gì bạn viết sẽ tự động được hiển thị theo màu sắc khác nhau – điều này giúp bạn dễ dàng sửa các lỗi có thể.
- Cho trình duyệt biết loại ngôn ngữ mà bạn đang sử dụng. Ở dòng đầu tiên, soạn <!DOCTYPE>, thẻ này luôn phải là thẻ đầu tiên trong mã của bạn. Tiếp đến dòng thứ hai, thêm <html>. Đây cũng là thẻ thứ hai bạn cần viết để cho máy tính biết là bạn đang bắt đầu tạo một trang web. Trang của bạn cũng cần được đóng lại, vì thế, ở cuối tài liệu bạn viết: </html>. Thẻ này sẽ kết thúc trang web.
- Thêm đề mục cho trang như hình minh họa.
- Đặt cho trang web một tiêu đề. Tiêu đề rất quan trọng vì nó cho người dùng biết rằng trang của bạn nói về điều gì. Ngoài ra, khi người dùng đánh dấu trang của bạn, tiêu đề ấy sẽ là những gì hiện thị trong danh sách trang đánh dấu của họ. Mã HTML của tiêu đề là <title>. Đóng mã lại ở cuối tiêu đề bằng cách soạn </title>. Tiêu đề sẽ hiển thị trên tab chứ không hiển thị trên trang web thực.
-
Tiến
đến
phần
thân
của
trang.
Gõ
thẻ
<body>
để
mở
thân
bài.
Sau
đó,
đóng
thân
bài
lại
bằng
thẻ
</body>.
Thông
tin
chủ
yếu
của
trang
web
sẽ
nằm
giữa
thẻ
<body>
và
</body>.
- Để tạo màu nền cho trang web, bạn có thể thêm phong cách vào phần thân bài. Để thêm màu nền, nhập thẻ <body style="background-color:silver">. Bạn có thể thử một màu khác (bằng tiếng Anh, thay cho “silver” – bạc) hay thậm chí sử dụng số hex (các số hay chuỗi số dưới dạng hệ đếm thập lục phân). Những từ trong dấu ngoặc kép chính là "thuộc tính" và chúng phải luôn được bao quanh bởi dấu ngoặc kép!
-
Viết
một
vài
đoạn
văn
bản
giữa
thẻ
thân
bài.
- Để làm cho văn bản xuống dòng (giống như khi nhấn phím "Enter" trên bàn phím), soạn <br><br>
- Bạn muốn thêm mã “marquee”, hay còn được biết như một lệnh làm cho chữ di chuyển dọc trên màn hình? Chỉ cần soạn <marquee>VĂN BẢN</marquee>.
- Thêm một số hình ảnh. Nếu bạn muốn thêm hình ảnh từ Internet vào trang web của mình, sử dụng mã HTML hình ảnh <img src="URL"> . Thẻ đóng là dấu chấm: . Tuy nhiên, với hình ảnh thì thẻ đóng là không bắt buộc.
-
Kiểm
tra
để
đảm
bảo
toàn
bộ
mã
của
bạn
đã
được
đóng.
Trang
web
của
bạn
sẽ
trông
gần
giống
như
sau:
<0062r>
<title>Trang web của tôi</title>
<body bgcolor="yellow">
Tôi yêu wikiHow vì
<marquee>đây là trang web tốt nhất trên thế giới!</marquee>
<img src="http://www.wikihow.com/skins/common/images/wikiHow_logo_5.gif"></body>
- Lưu thành quả của bạn. Chọn tác vụ "save as" (lưu dưới dạng), đặt tên tệp với phần mở rộng là .html (ví dụ: "wikihow.html") và chọn "all files" (tất cả tập tin) hay "text" (văn bản) bên dưới loại tệp. Nếu thiếu một trong hai thao tác trên, trang web của bạn sẽ không thể thực thi. Sau đó, đi đến nơi mà bạn đã lưu tệp, nhấp đúp vào tệp, lúc này trình duyệt mặc định sẽ mở trang web của riêng bạn lên ngay.
Lời khuyên[sửa]
- Một trong những ứng dụng viết HTML tốt là Espresso: nó đơn giản hóa việc viết mã bằng cách cung cấp nhiều lối tắt khác nhau và bạn có thể xem thử trang web của mình bằng tính năng "Preview" (xem trước) mà không cần phải luôn thay đổi các thẻ từ .html thành .txt! !
- Để tạo những trang web nâng cao hơn, sử dụng một trình chỉnh sửa web, chẳng hạn như Microsoft Expression Web.
- Bạn cũng có thể dùng thử Adobe Dreamweaver. Khi mã bạn viết có vấn đề, nó sẽ cho bạn biết vấn đề hiện có và hướng dẫn cách khắc phục.
- Bạn có thể tìm hiểu thêm về vấn đề này trên mạng. Tìm trên Google để tham khảo thêm những hướng dẫn về mã HTML.
- Bài viết này chỉ hướng dẫn bạn cách tạo một trang web. Tham khảo thêm những bài viết wikiHow liên quan khác bên dưới để có thêm thông tin về cách công khai trang web của bạn.
- Thẻ đóng không thể được sử dụng một cách tùy tiện. Thẻ "cuối cùng" "được mở" sẽ là thẻ "đầu tiên" được "đóng." Ví dụ: <tag1><tag2> nội dung </tag2></tag1>
- Đây là một ví dụ về vị trí không đúng của các thẻ <tag1> <tag2> câu lệnh </tag1></tag2>
- Nhiều người còn có thể thiết kế trang web “động”. Hãy luyện tập các kỹ năng của bạn và bạn sẽ sớm làm được như họ!
- Nếu trang web của bạn không hoạt động, sao chép và dán đoạn mã HTML trong bài viết và lưu như hướng dẫn, sau đó xem thử trang. Làm tương tự với những đoạn mã có sẵn như một cách để bạn luyện tập.
- Khi bạn mở một thẻ, bạn phải đóng nó lại trừ khi đó là loại thẻ đặc biệt không cần đóng (chẳng hạn như <img> hay <hr>). Tuy nhiên, nếu nghi ngờ, bạn cứ đóng tất cả thẻ.
Cảnh báo[sửa]
- Đảm bảo rằng bạn nhập đuôi ".html" hay ".htm" một cách thủ công vào cuối tên tệp và chọn "all files" hoặc "txt" bên dưới loại tệp. Trang web sẽ không hoạt động nếu bạn bỏ qua một trong hai thao tác này.
- Thẻ <marquee> không phải là một thẻ html chính thống được phân phối bởi W3C (World Wide Web Consortium – công ty lập ra các chuẩn cho Internet), vì thế, nó sẽ không thể hoạt động trên tất cả trình duyệt. Thẻ này được tạo ra và hỗ trợ lần đầu bởi Internet Explorer, hiện nay nó vẫn nhận được sự hỗ trợ kế thừa từ một số trình duyệt khác.
- Chắc rằng bạn lưu trữ hình ảnh của riêng mình ở nơi khác để không phải sử dụng băng thông của máy chủ lưu trữ hiện tại. Bạn có thể lưu trữ hình ảnh của mình lên các trang web như Photobucket, Flickr hay ImageShack.
- Thuộc tính "bgcolor" đã lỗi thời. Cách đúng để thay đổi màu nền của các thành phần là sử dụng ngôn ngữ CSS.
Những thứ bạn cần[sửa]
- Một chương trình soạn thảo văn bản, chẳng hạn như Notepad (trên Windows) hay Textedit (trên Mac).
- Một trình duyệt, chẳng hạn như Mozilla Firefox hay Safari.
- Máy tính kết nối internet.
- Trình quản lý tệp, chẳng hạn như Windows Explorer (tùy chọn)
- Trang web lưu trữ hình ảnh, chẳng hạn như Photobucket hay Flickr