Khái quát chung về ngôn ngữ lập trình HTML

20/06/2019 | Mai Đức Thạch | 914 xem

Định nghĩa ngôn ngữ HTML

HTML (HyperText Markup Language – Ngôn ngữ Đánh dấu Siêu văn bản): là ngôn ngữ phổ biến được sử dụng để viết nên các trang web, trong đó nó sử dụng các Phần tử hoặc các đoạn mã lệnh để chỉ cho trình duyệt biết cách thức hiển thị các thành phần của trang web lên trên trình duyệt.

Xét về mặt thuật ngữ HTML

– “Markup Language” (Ngôn ngữ đánh dấu): ngôn ngữ quy định cách thức đánh dấu một phần văn bản trong các cặp Phần tử đóng và mở HTML, để báo cho trình duyệt biết cách thức hiển thị văn bản lên trên trình duyệt người dùng.

– “Hypertext Language” (Ngôn ngữ siêu văn bản): ngôn ngữ quy định cách thức các trang web được kết nối với nhau trong website.

Sơ lược lịch sử hình thành và phát triển của Ngôn ngữ HTML

Những ý tưởng đầu tiên trước khi ra đời công nghệ Web

Năm 1945, Vannevar Bush  viết trong bài báo tuần Atlantic mô tả một thiết bị hình ảnh máy tính điện tử (gọi là Memex) cho phép mở rộng vùng nhớ, nơi mà nó cho phép liên kết giữa các tài liệu dựa trên vi Phần tử (microfiche).

Năm 1960, J.C.R Lichklider công bố “Man-Computer Symbiosis” (Cộng sinh giữa con người với máy tính).

Năm 1962, Douglas Englebart công bố “Augmenting Human Intellect: A Conceptual Framework” (Tăng cường trí tuệ con người – Một khái niệm khung).

Năm 1965, Ted Nelson đề xướng thuật ngữ “HyperText” (Siêu văn bản) trong tác phẩm “A File Structure for the Complex, the Changing, and the Indeterminate” (Một tập tin cấu trúc cho Phức hợp, Thay đổi và Vô hạn) trong một Hội nghị Quốc tế lần thứ 20 của Hiệp hội Máy tính tại New York.

Năm 1968, Douglas Englebart thiết lập Hệ thống trực tuyến NLS.

Năm 1969, thành lập cơ quan chuyên trách Dự án nghiên cứu nâng cao (ARPANET) để tiến hành nghiên cứu về mạng.

Năm 1971, Ray Tomlinson của BBN tạo một chương trình thư điện tử (email) để gửi thông điệp thông qua một phân phát mạng. Năm 1972, Tomlinson mở rộng chương trình này cho người dùng ARPANET, sử dụng ký tự @ trong phần địa chỉ.

Năm 1974, Vint Cerf Bob Kahn công bố “A Protocol for Packet Network Interconnection” (Một Giao thức cho Gói Kết nối mạng) đã xác định chi tiết thiết kế của một Giao thức điều khiển chuyển đổi – TCP (Transmission Control Protocol). Năm 1978, một phần của TCP được xuất bản riêng biệt như là Giao thức mạng – IP (Internet Protocol).

Năm 1980, trong quá trình làm việc tại CERN, Tim Berners-Lee viết một chương trình “Enquire-Within-Upon-Everyting” (Tìm hiểu trong phạm vi mọi thứ), nơi mà nó cho phép các liên kết được thực hiện thông qua các nút tùy ý.

Năm 1984, Paul Mockapetris giới thiệu Hệ thống tên miền – DNS (Domain Name System).

HTML 1

Tháng 03/1989, Tim Berners-Lee lưu hành “Information Management: A Proposal” (Quản lý thông tin: một đề xuất) trong các ghi chú tại CERN. Tháng 05/1990, ông công bố phiên bản 2 của “Information Management: A Proposal” (Quản lý thông tin: một đề xuất). Cuối năm 1990, ông phát triển trình duyệt web đầu tiên với tên WorldWideWeb (Mạng diện rộng) gồm biên tập, máy chủ và chế độ dòng trình duyệt. Tập trung vào giao tiếp máy khách – máy chủ đầu tiên trên Internet vào tháng 12/1990.

Tài liệu HTML Tags (Thẻ HTML) được xuất bản bởi CERN ban đầu với 18 thẻ (phần tử) được hỗ trợ. Ngôn ngữ HTML ban đầu được phát triển nhằm mục đích xác định cấu trúc của tài liệu như tiêu đề, đoạn văn, danh sách… để tạo điều kiện thuận lợi cho việc chia sẻ thông tin khoa học giữa các nhà nghiên cứu.

Những phần tử ban đầu được hỗ trợ trong phiên bản ban đầu của HTML bao gồm:

Các phần tử định nghĩa tài liệu

– Phần tử title để chỉ định tiêu đề của tài liệu.

– Phần tử Base Address để xác định địa chỉ của tài liệu khác, có liên quan đến nội dung trang hiện tại.

– Phần tử isindex được sử dụng để chỉ định rằng đây là phần đánh dấu chỉ mục văn bản.

Các phần tử chủ đề của đoạn văn từ h1 đến h6.

Các phần tử định nghĩa đoạn văn bản

– Phần tử p để chỉ định một đoạn văn, chỉ bao gồm phần tử mở được đặt ở đầu mỗi đoạn văn.

– Phần tử plaintext được sử dụng để chỉ định một phần văn bản từ chỗ đó đến cuối tập tin được hiển thị đơn thuần như những gì được định dạng.

– Phần tử listing cho phép văn bản với chiều rộng ký tự cố định 132 ký tự/dòng được nhúng hoàn toàn vào trong tài liệu.

Các Phần tử định nghĩa phần đoạn văn

– Phần tử a chỉ bao gồm 2 thuộc tính là name để xác định văn bản liên kết và href để xác định đường dẫn liên kết.

– Phần tử address chỉ bao gồm thông tin tác giả, địa chỉ và điện thoại nhưng không bao gồm địa chỉ thư điện tử (mail).

– Các phần tử cụm từ trọng lượng cao hp1, hp2, … được sử dụng trong các đoạn văn.

– Phần tử nextid, vì ban đầu nó được viết cho máy NeXT nên có Phần tử này để đánh số mã cấp phát tài liệu.

Các phần tử định nghĩa danh sách: Danh sách bao gồm một chuỗi các đoạn văn được bắt đầu bởi một dấu đặc biệt hoặc số thứ tự.

– Các phần tử ul li được sử dụng để định nghĩa danh sách các đoạn trên nhiều dòng, được phân tách nhau bởi một khoảng trắng.

– Các phần tử menu li được sử dụng để định nghĩa danh sách các đoạn văn nhỏ, thông thường, mỗi dòng là mỗi mục.

– Các phần tử dir li được sử dụng để định nghĩa danh sách các mục ngắn, ít hơn 1 dòng; nó tương tự như việc sắp xếp cột ngày nay.

– Các phần tử dl, dd, dt được sử dụng để định nghĩa danh sách thuật ngữ, bao gồm một thuật ngữ và một đoạn văn ngắn định nghĩa cho thuật ngữ đó.

HTML 2

Tháng 12/1991, Hội nghị Siêu liên kết 91 tại San Antonio, bang Texas (Hoa Kỳ), trang web của Tim Berners-Lee chỉ được chấp nhận như phiên trưng bày. Năm 1992, Dan Connolly đã viết Định nghĩa kiểu tài liệu HTML (DTD) và một đặc tả HTML ngắn gọn. Tháng 12/1992, máy chủ Web đầu tiên ngoài nước Mỹ ở Châu Âu được cài đặt ở Đại học Stanford.

Từ năm 1993, nhiều người tham gia Internet đã đóng góp vào sự phát triển của HTML với sự xuất hiện của nhiều trình duyệt Web mới như Midas, Erwise, Viola, Samba. Ngày 23/01/1993, trình duyệt NCSA Mosaic được phát hành bởi Marc AndreessenEric Bina tại Trung tâm Quốc gia về Ứng dụng siêu máy tính (National Center for Supercomputing Applications – NCSA) – Đại học Illinois tại Urbana–Champaign (University of Illinois at Urbana Champaign – UIUC) cho máy X Windows. Tháng 04/1993, CERN đồng ý cho phép bất kỳ ai được sử dụng giao thức Web và miễn phí mã bản quyền. Mosaic đóng vai trò đặc biệt quan trọng trong việc kiến thiết HTML, khi đã đi tiên phong trong việc bổ sung các hình ảnh trực tuyến, bản đồ hình ảnh, danh sách lồng nhau và các biểu mẫu điền với tên gọi HTML+.

Vào tháng 10 năm 1994, Tim Berners-Lee thành lập Hiệp hội World Wide Web (W3C) tại Viện Công nghệ Massachusetts, Phòng thí nghiệm Khoa học Máy tính (MIT/LCS) phối hợp với CERN, nơi Web bắt nguồn, với sự hỗ trợ của DARPA và Ủy ban châu Âu.

HTML 2.0 được phát hành  tháng 06/1993 dưới sự bảo trợ của Lực lượng chuyên trách Công nghệ mạng (IETF – Internet Engineering Task Force) đã đưa ra một tiêu chuẩn rõ ràng cho HTML; với việc phân chia rõ ràng hơn từng phần của tài liệu HTML và giới thiệu thêm các phần tử mới đánh dấu biểu mẫu tương tác, bảng dữ liệu, hình ảnh và bản đồ hình ảnh. HTML 2 về cơ bản đã tạo ra một bước hoàn thiện ban đầu của HTML trong việc xây dựng website. Sau đó nó được bổ sung, phát triển thêm vào tháng 11/1995 về việc truyền tập tin biểu mẫu, tháng 05/1996 về việc sử dụng bảng HTML, tháng 08/1996 về sử dụng Bản đồ hình ảnh phía máy khách và tháng 01/1997 về Quốc tế hóa HTML.

Các Phần tử đánh dấu cấu trúc tài liệu HTML

DOCTYPE xác định kiểu tài liệu đầy đủ SGML (Standard Generalized Markup Language – Tiêu chuẩn chung về Ngôn ngữ đánh dấu) trong ISO 8879:1986.

– Phần tử html với thẻ mở và thẻ đóng được sử dụng để bắt đầu và kết thúc tài liệu html.

– Phần tử head được sử dụng để định nghĩa ở phần đầu của tài liệu HTML, nó bao gồm các phần tử để định nghĩa nhưng không hiển thị lên trong giao diện đồ họa người xem.

– Phần tử body để xác định phần thân của trang web HTML, nó gồm toàn bộ các phần tử được sử dụng để đánh dấu hiển thị nội dung lên trong giao diện đồ họa người xem.

Một số nâng cấp các phần tử được hỗ trợ trong HTML 1

– Phần tử base được sử dụng để thay thế cho phần tử Base Address.

– Các phần tử em (văn bản nhấn mạnh), strong (văn bản quan trọng) được sử dụng để thay thế phần tử hp1, hp2… Ngoài ra trong phiên bản HTML này còn giới thiệu một số phần tử ngữ nghĩa khác như i, em, u, blockquote, cite, strike (văn bản có nét gạch ngang qua).

– Các phần tử code (văn bản mã lập trình), pre (văn bản hiển thị như những gì nó được viết), xmp (cũng giống như listing nhưng chỉ có 80 ký tự/dòng) được sử dụng để thay thế phần tử listing. Ngoài ra, một số phần tử định nghĩa văn bản máy tính và văn bản lập trình cũng được giới thiệu trong phiên bản này gồm tt (TeleType – Văn bản kiểu ký tự đánh máy bàn phím), kbd, samp, var, dfn, xmp (một văn bản với một font chữ cho trước với ít nhất 80 ký tự/dòng).

– Từ những phần tử định nghĩa danh sách ban đầu được bổ sung thêm những phần tử mới:

+ Từ danh sách đánh dấu cột với phần tử dir; trong HTML 2 giới thiệu thêm các phần tử đánh dấu bảng dữ liệu một cách có hệ thống bao gồm các phần tử table, caption, col, colgroup, thead, tbody, tfoot, tr, th, td. Phần tử table thời kỳ này được sử dụng để xây dựng bố cục trang web.

+ Từ danh sách đánh dấu đặc biệt và số thứ tự với phần tử ul được tách ra thành 2 loại danh sách: danh sách không thứ tự với phần tử ul danh sách có thứ tự với phần tử ol được giới thiệu trong phiên bản HTML này.

Một số phần tử HTML mới được giới thiệu

– Các phần tử đánh dấu biểu mẫu form, input, textarea, select, option cho phép tương tác nhận và gửi dữ liệu từ người dùng truy cập website.

– Phần tử hình ảnh img để nhúng một hình ảnh vào trong website. Kéo theo đó phần tử liên kết a, được bổ sung thêm phần bản đồ hình ảnh với các phần tử bổ sung gồm map và area.

– Phần tử siêu dữ liệu meta với các cặp kiểu và giá trị để mô tả thông tin trang hoặc cấu hình hiển thị trang.

– Phần tử liên kết tài nguyên link được sử dụng để liên kết tài nguyên khác vào trong website.

– Một số phần tử khác không còn được sử dụng kể từ phiên bản HTML 2 là nextid plaintext.

HTML 3

Tháng 04/1995, HTML 3.0 đã được đề xuất như một tiêu chuẩn cho IETF, nhưng đề xuất đã hết hạn năm tháng sau đó (28 tháng 9 năm 1995) mà không cần thực hiện thêm hành động nào. Nó bao gồm nhiều khả năng trong đề xuất HTML+ của Raggett, chẳng hạn như hỗ trợ cho các bảng, luồng văn bản xung quanh các hình và hiển thị các công thức toán học phức tạp.

W3C bắt đầu phát triển trình duyệt Arena của riêng mình như là một thử nghiệm cho HTML 3 và Cascading Style Sheets, hỗ trợ ngôn ngữ Đánh dấu mở rộng XML (Extensible Markup Language) và toán học Math. nhưng HTML 3.0 đã không thành công vì nhiều lý do. Dự thảo được coi là rất lớn ở 150 trang và tốc độ phát triển trình duyệt, cũng như số lượng các bên quan tâm, đã vượt xa các nguồn lực của IETF. Các nhà cung cấp trình duyệt, bao gồm cả Microsoft và Netscape vào thời điểm đó, đã chọn triển khai các tập con khác nhau của các tính năng nháp của HTML 3 cũng như giới thiệu các phần mở rộng của riêng chúng cho nó.

Phiên bản HTML 3.2 được ban hành 14/01/1997 bởi Dave Raggett. Đây là phiên bản đầu tiên được phát triển và chuẩn hóa độc quyền bởi W3C, vì IETF đã đóng nhóm làm việc HTML vào ngày 12/09/1996. Phiên bản này với sự ra đời của thuật ngữ các phần tử “cấp độ khối (block level)” (bao gồm các phần tử mà nội dung của nó được đặt trong chiều rộng toàn bộ phần tử cha) và “cấp độ văn bản (text level)” (bao gồm các phần tử mà nội dung của nó đặt trong chiều rộng của một phần trong chiều rộng toàn bộ phần tử cha); các phần tử Cụm từ (Phrase) là một tập con của “cấp độ văn bản“. Trong đó có sự cải tiến một số phần tử:

– Phần tử liên kết a được viết lại văn bản liên kết được đưa vào nội dung của phần tử thay vì trong thuộc tính name như đã giới thiệu ở HTML 1.

– Phần tử link được giới thiệu ở HTML 2 được tách ra thêm 2 phần tử mới:

+ Phần tử script được sử dụng để viết ngôn ngữ kịch bản phía máy khách.

+ Phần tử style được sử dụng để viết ngôn ngữ bộ định kiểu xếp tầng CSS.

– Ngoài ra phiên bản HTML 3.2 này còn giới thiệu thêm các phần tử đánh dấu cụm từ văn bản khác là big (văn bản lớn hơn bình thường), small, sup, sub, center (văn bản canh giữa), s (được giới thiệu để sau này thay thế strike), font, basefont (văn bản được hiển thị với màu chữ, cỡ chữ, font chữ được chỉ định).

Do sự phát triển mạnh mẽ của CSS trong việc định dạng trang web, phần tử khối div được giới thiệu mới để phân chia bố cục website thay cho phần tử table.

HTML 4

Phiên bản HTML 4.0 trở thành tiêu chuẩn ngày 18/12/1997 và sau đó nó được cập nhật (sửa đổi, làm rõ, và không có thay đổi lớn) để trở thành tiêu chuẩn chính thức cuối cùng là phiên bản HTML 4.01 công bố phát hành ngày 12/05/2001 do Raggett và các cộng sự biên tập. Các phần tử HTML được phân chia thành Cấp độ khối (block-level)Cấp độ nội tuyến (inline-level).

Trong phiên bản PHP này xác định chức năng, vai trò của các thuộc tính id class trong tài liệu HTML; bổ sung thêm một số cải tiến mới trong phần bộ định kiểu (bổ sung thêm phần tử style để khuyến khích viết bộ định kiểu CSS tách rời ra với nội dung HTML); kịch bản (bổ sung thêm phần tử noscript, hỗ trợ truy cập Mô hình Đối tượng phần tử trong Javascript DOM – Document Object Model); khung (với sự xuất hiện của các phần tử frameset, frame, noframe, iframe); nhúng đối tượng (cùng với các phần tử img, map, area đã có trước đó, được bổ sung thêm các phần tử mới object, param, applet – đã từng xuất hiện trên các trình duyệt từ 1995 nhưng ít được chấp nhận); biểu mẫu (bổ sung thêm phần tử optgroup để chia nhóm tùy chọn trong phần tử select; đưa thêm phần tử button tách khỏi phần tử input với các kiểu submit, button, reset; các phần tử nhãn: isindex, label; các phần tử khung biểu mẫu: fieldset, legend) và cung cấp khả năng tiếp cận (thông qua sáng kiến tiếp cận Web WAI – Web Accessibility Initiative với thuộc tính role).

Phiên bản HTML 4 cho phép hỗ trợ nhiều ngôn ngữ hơn trong cùng 1 tài liệu qua thuộc tính lang (để chỉ định ngôn ngữ), thuộc tính dir (để chỉ định hướng văn bản); hỗ trợ tốt hơn trong việc lập chỉ mục công cụ tìm kiếm (khi khuyến khích các lập trình viên sử dụng các phần tử nhóm để phân chia bố cục trang web với sự hỗ trợ của phần tử div đã được giới thiệu ở phiên bản HTML 3.2 nay được bổ sung thêm phần tử span để nhóm từng phần trong đoạn văn bản); kiểu chữ chất lượng tốt hơn (với việc giới thiệu thêm các phần tử đánh dấu thay đổi: ins, del; nhóm phần tử trích dẫn bên cạnh blockquote nay bổ sung thêm phần tử q; cấu trúc văn bản cụm từ bổ sung thêm các phần tử acronym, abbr, bdo); danh sách được hoàn thiện hơn (khi phân chia thành 3 loại danh sách không thứ tự ul, danh sách có thứ tự ol, danh sách định nghĩa dl; những phần tử menu dir được thay thế bởi ul và không được sử dụng nữa); chuyển đổi văn bản thành giọng nói tốt hơn (từ 1999); chính sách bằng sáng chế; chính sách bảo mật…  Những phần tử col colgroup, thead, tbody, tfoot được sử dụng trong HTML 2 nhưng không được sử dụng trong HTML 3.2 thì sang phiên bản HTML 4 được sử dụng lại.

Tháng 07/2001, W3C ra điều lệ Nhóm Kỹ sư Công nghệ – TAG (Technical Architecture Group), trong năm này Web được đưa vào hỗ trợ trên các thiết bị độc lập; phát triển Web động qua các ngôn ngữ kịch bản máy chủ; quản lý Key XML.

Từ năm 2002, đẩy mạnh tương tác đa phương thức; sự ra đời của của Web Services. Năm 2003, XForms ra đời.

HTML 5

HTML 5 được phát hành công khai vào ngày 22/01/2018 với những bản cập nhật lớn và khuyến nghị W3C ngày 28/10/2014 đánh dấu bước đột phá mới trong tiêu chuẩn HTML khi mà các phần tử được giới thiệu mang tính chất ngữ nghĩa nhiều hơn là định dạng văn bản (được chuyển hẳn sang CSS). Việc phân chia nhóm các phần tử HTML được rõ nét hơn.

Việc phân chia bố cục trang web, bên cạnh việc sử dụng phần tử div, để đánh dấu từng phần của trang web, một loạt các phần tử mới được giới thiệu: header, nav, menu, main, aside, footer, section, article, detail, summary, figure, figcaption, dialog, datalist.

Các phần tử nhúng được phân chia rõ ràng hơn với việc loại bỏ các phần tử chung chung và ít được chấp nhận được giới thiệu ở HTML 4 là frameset, frame, noframes, applet; và giới thiệu thêm các phần tử mới với các công nghệ nhúng mới embed, video, audio, canvas, svg, math, template cùng các phần tử tính năng của nó như source, track, progress, meter, output, keygen với sự hỗ trợ lớn từ javascript.

Biểu mẫu được mở rộng hơn với sự mở rộng của kiểu nhập văn bản trong phần tử input với sự bổ sung thêm các kiểu như time, month, week date, datetime, datetime-local, email, color, number, range, search, tel, url

Định dạng văn bản cụm từ được bổ sung thêm nhiều phần tử mới mang tính chất ngữ nghĩa nhiều hơn: bên cạnh phần tử br đã được giới thiệu ở HTML 2 nay bổ sung thêm phần tử wbr, phần tử s được định nghĩa lại và phân biệt với phần tử del đã được giới thiệu trong HTML 4; các phần tử ngôn ngữ hiển thị là ruby rp, rt, bdi; các phần tử mới khác là mark, time, data.

Kể từ khi ra đời HTML 5 (28/10/2014) được công bố đến nay, nó đã được chỉnh sửa nâng cấp qua nhiều phiên bản:

– Phiên bản HTML 5.1 (01/11/2016), bổ sung HTML 5.1.2 (03/10/2017)

– Phiên bản HTML 5.2 (14/12/2017)

– Phiên bản HTML 5.3 (03/07/2018).

Cấu trúc cơ bản của một trang HTML đơn giản

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Tiêu  đề trang</title>
    </head>
	<body>
		Nội dung trang HTML
	</body>
</html>

Phân loại và chức năng các phần tử HTML