Cách để Tạo một trang web đơn giản với HTML

Trong bài viết này:Sử dụng HTML

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 công cụ/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ó 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 - dù không chuyên nghiệp!

Sử dụng HTML

  1. 1
    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ó giống như bộ khung của mọi trang web đang 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).
    • Trên Internet Explorer, chọn "source" từ trình đơn VIEW.
  2. 2
    Kiến tạo trang web đầu tay đơ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ã.
  3. 3
    Đ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ể.
  4. 4
    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.
  5. 5
    Thêm đề mục cho trang như hình minh họa.
  6. 6
    Đặ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ẽ được 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.
  7. 7
    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!
  8. 8
    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>.
  9. 9
    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.
  10. 10
    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>



  11. 11
    Lưu lại 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

  • 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 đề là gì 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

  • Đả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

  • 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

Thông tin Bài viết

wikiHow là một trang "wiki", nghĩa là nhiều bài viết ở đây là nội dung của nhiều tác giả cùng viết nên. Để tạo ra bài viết này, 207 người, trong đó có một số người ẩn danh, đã thực hiện chỉnh sửa và cải thiện bài viết theo thời gian.

Chuyên mục: Máy tính và Điện tử | Mạng Internet

Ngôn ngữ khác:

English: Create a Simple Web Page with HTML, Português: Criar uma Página Simples da Web com HTML, Italiano: Creare una Semplice Pagina Web con HTML, Español: hacer una página web en HTML, Français: créer sa première page Web en langage HTML, Deutsch: Eine einfache Webseite mit HTML gestalten, Nederlands: Een simpele webpagina maken met HTML, Русский: создать простую веб страницу с помощью HTML, 中文: 用HTML创建一个简单网页, Bahasa Indonesia: Membuat Halaman Web Sederhana Dengan HTML, ไทย: เขียนเว็บเพจง่ายๆ ด้วย HTML, 한국어: HTML로 간단한 웹페이지 만들기, العربية: إنشاء صفحة ويب بسيطة باستخدام لغة اتش تي ام ال, 日本語: 単純なウェブページをHTMLで作成する, हिन्दी: HTML का इस्तेमाल करके एक वेब पेज तैयार करें (Create a Simple Web Page with HTML), Türkçe: HTML ile Basit Bir Web Sayfası Nasıl Oluşturulur

Trang này đã được đọc 14.347 lần.
Bài viết này đã giúp ích cho bạn?