The web and web standards

Bản dịch này chưa hoàn thành. Xin hãy giúp dịch bài viết này từ tiếng Anh

Bài viết này cung cấp một số thông tin cơ bản trên web - nó ra đời như thế nào, những công nghệ chuẩn của web là gì, chúng làm việc cùng nhau như thế nào, tại sao "phát triển web" là một nghề nghiệp tuyệt vời để lựa chọn, và những loại phương pháp hay nhất nào bạn sẽ được học trong khóa học.

Lược sử web

Chúng tôi sẽ giữ phần này thật ngắn gọn, vì có rất nhiều thông tin về lịch sử web ngoài kia, những thứ mà chúng tôi sẽ liên kết đến về sau (cũng hãy thử tìm kiếm từ khóa "lịch sử của web" trên công cụ tìm kiếm yêu thích của bạn và xem những gì bạn nhận được, nếu bạn quan tâm đến nhiều chi tiết hơn.)

Vào cuối những năm 1960, quân đội Mỹ đã phát triển một mạng lưới thông tin liên lạc gọi là ARPANET. Nó có thể xem là tiền thân của Web, vì nó hoạt động trên packet switching, và giới thiệu việc triển khai đầu tiên của bộ giao thức TCP/IP. Hai công nghệ này tạo nên nền tảng của cơ sở hạ tầng mà internet được xây dựng trên đó.

Năm 1980, Tim Berners-Lee (thường được gọi là TimBL) viết một chương trình máy tính xách tay gọi là ENQUIRE, trong đó có khái niệm liên kết giữa các nút. Nghe có vẻ quen?

Đến năm 1989, TimBL viết cuốn Information Management: A Proposal và HyperText tại CERN; hai ấn phẩm này cùng nhau cung cấp nền tảng cho cách thức hoặt động của web. Họ nhận được một số tiền lãi kha khá, đủ để thuyết phục các ông chủ của TimBL cho phép anh ta tiếp tục và tạo ra một hệ thống siêu văn bản toàn cầu.

Cuối năm 1990, TimBL đã tạo ra tất cả những thứ cần thiết để chạy phiên bản đầu tiên của web — HTTP, HTML, trình duyệt web đầu tiên, được gọi là WorldWideWeb, một máy chủ HTTP và một số trang web để xem.

Trong những năm tiếp theo, web bùng nổ, với nhiều trình duyệt web được phát hành, hàng ngàn máy chủ web được thiết lập và hàng triệu trang web được tạo ra. OK, đó là một bảng tóm tắt đơn giản về những gì đã xảy ra, nhưng tôi đã hứa với bạn một bản tóm tắt ngắn gọn.

Một cột mốc quan trọng để chia sẻ là trong năm 1994, TimBL thành lập World Wide Web Consortium (W3C), một tổ chức tập hợp nhiều đại diện từ nhiều công ty công nghệ khác nhau để cùng nhau tạo ra các đặc tả công nghệ web. Sau đó các công nghệ khác như CSSJavaScript theo sau, và web bắt đầu nhìn giống như web chúng ta biết ngày nay.

Các tiêu chuẩn Web

Các tiêu chuẩn web là những công nghệ chúng ta dùng để xây dựng các trang web. Các tiêu chuẩn này tồn tại dưới dạng các tài liệu kỹ thuật dài được gọi là thông số kỹ thuật, trình bày chi tiết chính xác cách thức hoạt động của công nghệ.

Ví dụ, tài liệu HTML Living Standard mô tả chính xác cách HTML (tất cả các phần tử HTML, các API liên quan của chúng, và các công nghệ xung quanh khác) được triển khai.

Các tiêu chuẩn web được tọa ra bởi các cơ quan tiêu chuẩn - các tổ chức mời các nhóm người từ các công ty công nghệ khác nhau cùng nhau tham gia và thống nhất về cách thức thức tốt nhất mà các công nghệ sẽ hoạt động để đáp ứng được tất cả các trường hợp sử dụng. W2C là cơ quan tiêu chuẩn được biết  đến nhiều nhất, nhưng cũng có nhiều cơ quan khác như WHATWG (người chịu trách nhiệm về việc hiện đại hóa ngôn ngữ HTML), ECMA (người xuất bản tiêu chuẩn cho ECMAScript, nền tảng mà JavaScript dựa trên), Khronos (người xuất bản công nghệ cho đồ họa 3D, chẳng hạn như WebGL), và những cơ quan khác.

Các tiêu chuẩn "Mở"

Một trong những khía cạnh chính của tiêu chuẩn web, mà TimBL và W3C đã đồng ý ngay từ đầu, là web (và các công nghệ web) phải được tự do cho cả hai phía đóng góp và sử dụng, và không bị cản trở bởi các bằng sáng chế/cấp phép. Do đó, bất kỳ ai cũng có thể viết code để xây dựng các trang web miễn phí và bất kỳ ai cũng có  thẻ đóng góp và quá trình tạo các tiêu chuẩn, nơi các thông số kỹ thuật được viết.

Bới vì các công nghệ web được tạo ra một cách công khai, với sự hợp tác giữa nhiều công ty khác nhau, điều đó có nghĩa là không môt công ty nào có thể kiểm soát chúng, đó là một điều thực sự tốt. Bạn sẽ không muốn một công ty nào đó đột nhiên quyết định đặt toàn bộ web phía sau một bức tường phí, hoặc phát hành một phiên bản HTML mới mà mọi người phải mua để tiếp tục tọa các trang web, hoặc tệ hơn nữa, chỉ cần quyết định rằng họ không quan tâm nữa mà chỉ cần tắt nó đi.

Điều này cho phép web vẫn là một tài nguyên công cộng có sẵn miễn phí.

Đừng phá vỡ web

.Một cụm từ khác mà bạn sẽ nghe thấy xung quanh các tiêu chuẩn web mở là "đừng phá vớ web" - ý tưởng này là bất kỳ công nghệ web được giới thiệu đểu phải tương thích với những điều đã có trước đó (tức là các trang web cũ vẫn sẽ tiếp tục hoạt động), và tương thích về sau (những công nghệ trong tương lai khi ra đời sẽ tương thích với những gì chúng ta hiện có). Khi bạn tim hiểu qua các tài liệu học tập được trình bày ở đây, bạn sẽ bắt đầu tìm hiểu về cách thức thực hiện điều này với một số công việc thiết kế và triển khai rất thông minh.

Trở thành một nhà phát triển Web là tốt

Nền công nghiệp web là một thị trường rất hấp dẫn để tham gia nếu bạn đang tìm kiếm một công việc. Các số liệu được công bố gần đây cho biết rằng hiện có khoảng 19 triệu nhà phát triển web trên thế giới và con số này sẽ tăng hơn gấp đôi trong thập kỷ tới. Và đồng thời, có sự thiếu hụt kỹ năng trong ngành - vậy thời điểm nào tốt hơn để học phát triển web?

Tuy nhiên, không phải tất cả đều là trò chơi thú vị -  công việc xây dựng những trang web hiện nay phức tạp hơn nhiều so với trước đây và bạn sẽ phải dành một chút thời gian để nghiên cứu tất cả các công nghệ khác nhau mà bạn cần sử dụng, tất cả các kỹ thuật và thực hành tốt nhất bạn cần biết, cùng với tất cả các mẫu điển hình bạn sẽ được gọi để thực hiện. Bạn sẽ mất vài tháng để thực sự bắt đầu làm quen với nó, và sau đó bạn sẽ cần tiếp tục học hỏi để để kiến thức của bạn luôn cập nhật với tất  cả các công cụ và tính năng mới xuất hiện trên nền tảng web, và tiếp tục luyện tập, trau đồi nghề của bạn.

The only constant is change.

Nghe có vẻ khó? Đừng lo - mục tiêu của chúng tôi là cung cấp cho bạn mọi thứ bạn cần biết để khởi đầu, và nhiều điều sẽ trở nên dễ dàng hơn. Một khi bạn đã nắm bắt được sự thay đổi liên tục và sự không chắc chắn của web, bạn sẽ bắt đầu thấy thích thú. Là một phần của cộng đồng web, bạn sẽ có toàn bộ các mối liên hệ web và tài liệu hữu ích hỗ trợ bạn, và bạn sẽ bắt đầu tận hưởng khả năng sáng tạo mà nó mang lại.

Bây giờ bạn là nhà sáng tạo số. Hãy tận hưởng trải nghiệm này và tiềm năng kiếm sống mà nó mang lại.

Tổng quan về công nghệ web hiện đại

Có một số công nghệ cần học nếu bạn muốn trở thành nhà phát triển web front-end. trông phần này, chúng tôi sẽ mô tả chúng một cách ngắn gọn. Để có thêm giải thích chi tiết hơn về cách thức một trong số chúng hoạt động cùng nhau, hãy đọc bài viết How the web works của chúng tôi.

Trình duyệt

Có thể bạn đang đọc những dòng này trên một trình duyệt web (trừ khi bạn in nó ra hoặc bạn sử dụng công nghệ hỗ trợ, chẳng hạn như trình đọc màn hình để đọc nó cho bạn ). Trình duyệt web là những chương trình phần mềm mà người ta sử sụng để truy cập trang web, ban gồm Firefox, Chrome, Opera, Safari, and Edge.

HTTP

Hypertext Transfer Protocol, hay HTTP, là một giao thức nhắn tin cho phép trình duyệt web giao tiếp với các máy chủ web (noi các trang web được lưu trữ). Một giao tiếp điển hình sẽ giống như sau:

"Hello web server. Can you give me the files I need to render bbc.co.uk"?

"Sure thing web browser — here you go"

[Downloads files and renders web page]

Cú pháp thực tế của thông điệp HTTP (được gọi là yêu cầu và phản hồi) không phải con người có thể đọc được, nhưng điều này cung cấp cho bạn cái nhìn cơ bản.

HTML, CSS, and JavaScript

HTML, CSS, và JavaScript là ba công nghệ chính bạn sẽ sử dụng để xây dựng một trang web:

  • Hypertext markup language, or HTML, là một ngôn nhữ đánh dấu bao gồm nhiều yếu tố bạn có thể đóng gói (đánh dấu) nội dung để tạo cho nó ý nghĩa (ngữ nghĩa) và cấu trúc. HTML đơn giản trông như thế này:

    <h1>This is a top-level heading</h1>
    
    <p>This is a paragraph of text.</p>
    
    <img src="cat.jpg" alt="A picture of my cat">

    Nếu ta hình dung trang web như một ngôi nhà số, thì HTML giống như nền móng và các bức tường của ngôi nhà đó, tạo ra cấu trúc và gắn kết chúng với nhau

  • Cascading Style Sheets (CSS) là một ngôn ngữ dựa trên quy tắc được sử dụng để áp dụng các kiểu và HTML của bạn, ví dụ như thiết lập văn bản và màu nền, thêm đường viền, tạo hiệu ứng, hoặc sắp xếp trang theo một cách nhất định. Ví dụ đơn giản, đoạn code sau đây sẽ chuyển đoạn HTML của chúng ta thành màu đỏ:

    p  {
      color: red;
    }

    Trong ngôi nhà số, CSS giống như sơn, giấy dán tường, thảm và các bức tranh bạn sử dụng để làm cho ngôi nhà trông đẹp mắt.

  • JavaScript là một ngôn ngữ lập trình sử dụng để thêm tính tương tác cho các trang web, từ chuyển đổi kiểu động đến tìm nạp các bản cập nhật từ máy chủ, ngay đến cả các đồ họa 3D phức tạp. Ví dụ Javascript đơn giản sau đây sẽ lưu trữ một tham chiếu đến đoạn văn bản của chúng ta trong bộ nhớ và thay đổi văn bản bên trong đó:

  • let pElem = document.querySelector('p');
    pElem.textContent =  'We changed the text!';

    Trong ngôi nhà số, Javascript giống như bếp, TV, lò vi sóng hay máy sấy tóc, những thứ mang lại chức năng hữu ích cho ngôi nhà của bạn.

Dụng cụ

Một khi bạn đã học các công nghệ thô có thể được sử dụng để xây dựng các trang web (chẳng hạn như HTML,CSS, và Javascript), bạn sẽ sớm bắt đầu biết đến các công cụ khác nhau để làm cho công việc của bạn dễ dàng và hiệu quả hơn. Ví dụ như:

  • Các công cụ dành cho nhà phát triển (developer tools) bên trong các trình duyệt hiện đại có thể được dùng để gỡ lỗi cho code của bạn.
  • Các công cụ kiểm tra (Testing tools)  có thể được sử dụng để chạy thử xem code của bạn có đang hoạt động giống như bạn mong muốn hay không.
  • Các thư viện và nền tảng xây dựng dựa trên JavaScript cho phép bạn xây dựng một số loại trang web nhanh chóng và hiệu quả hơn nhiều.
  • Cái gọi là "Linters", tập hợp các quy tắc, xem xét code của bạn, và đánh dấu những chỗ bạn chưa tuân thủ chính xác các quy tắc.
  • Minifiers, loại bỏ tất cả các khoảng trắng trong tệp code của bạn làm cho chúng nhỏ hơn và do đó có thể tải xuống từ server nhanh hơn.

Server-side languages and frameworks

HTML, CSS và JavaScript là những ngôn ngữ lập trình front-end (hoặc client-side), có nghĩa là chúng được chạy bởi trình duyệt để tạo ra một trang web front-end mà người dùng của bạn có thể sử dụng.

Có một lớp các ngôn ngữ khác gọi là ngôn ngữ back-end (hoặc server-side), nghĩa là chúng được chạy trên server trước khi kết quả được được gửi tới trình duyệt để hiển thị. Cách sử dụng điển hình cho một ngôn ngữ server-side là lấy một số dữ liệu ra khỏi CSDL và tạo một số HTML để chứa dữ liệu, trước khi gửi HTML qua trình duyệt để hiển thị chúng cho người dùng.

Một số ngôn ngữ server-side ví dụ như ASP.NET, Python, PHP, và NodeJS.

Các phương pháp hay nhất về web

Chúng tôi đã nói ngắn gọn về những công nghệ mà bạn sẽ dùng để xây dựng trang web. Bây giờ hãy cùng thảo luận vè những phương pháp hay nhất mà bạn nên áp dụng để đảm bảo rằng bạn sử dụng các công nghệ đó theo cách tốt nhất có thể.

Khi phát triển web, nguyên nhân chính dẫn đến những sự không chắc chắn đến từ thực tế là bạn không biết mỗi người dùng sử dụng sự kết hợp công nghệ nào để xem trang web của bạn:

  • Người dùng 1 có thể xem bằng iPhone, với màn hình nhỏ và hẹp.
  • Người dùng 2 có thể xem bằng laptop chạy Windows gắn màn hình rộng.
  • Người dùng 3 có thể bị mù và sử dụng trình đọc màn hình để đọc trang web cho họ.
  • Người dùng 4 có thể sử dụng một máy tính rất cũ mà không chạy được các trình duyệt hiện đại.

Bởi vì bạn không biết chính xác thứ mà người dùng sử dụng, bạn cần phải thiết kế cẩn thận - làm cho trang web của bạn linh hoạt nhất có thể , để tất cả các người dùng ở trên có thể sử dụng nó, ngay cả khi họ có thể không có được trải nghiệm giống nhau. Tóm lại, chúng ta đang cố gắng làm cho trang web hoạt động cho tất cả mọi người, càng nhiều càng tốt.

Bạn sẽ gặp phải một số khái niệm dưới đây trong quá trính nghiên cứu.

  • Khả năng tương thích giữa nhiều trình duyệt là phương pháp cố gắng đảm bảo cho trang web hoạt động trên nhiều thiết bị nhất có thể. Điều này bao gồm sử dụng các công nghệ mà tất cả các trình duyệt đều hỗ trợ, mang lại những trải nghiệm tốt hơn cho các trình duyệt (cải tiến iên tục) và / hoặc viết code để nó trở lại trải nghiệm đơn giản  nhưng vẫn có thể sử dụng được trong các trình duyệt cũ hơn (xuống cấp tùy theo yêu cầu). Nó cũng liên quan đến rất nhiều thử nghiệm để xem liệu có có điều gì bị lỗi trên một số trình duyệt nhất định hay không và sau đó sẽ làm việc nhiều hơn để sửa những lỗi đó.
  • Thiết kế web phản hồi là phương pháp làm cho chức năng và bố cục của bạn linh hoạt hơn để chúng có thể tự động thích ứng với những trình duyệt khác nhau. Một ví dụ hiển nhiên là một trang web được bố trí một chiều trên trình duyệt màn hình rộng của máy tính, nhưng lại hiển thị nhỏ gọn hơn, bố cục một cột trên trình duyệt điện thoại di động.Hãy thử điều chỉnh độ rộng của cửa sổ trình duyệt bạn đang dùng xem điều gi xảy ra.
  • Hiệu suất nghĩa là làm cho các trang web tải nhanh nhất có thể, nhưng cũng làm cho chúng trực quan và dễ sử dụng để cho người dùng không cảm thất thất vọng và rời đi nơi khác.
  • Khả năng truy cập nghĩa là làm cho nhưng trang web của bạn có thể được sử dụng bởi nhiều đối tượng khác nhau nhất có thể (các khái niệm liên quan là tính đa dạng và tính bao gồm, và thiết kế bao gồm). Điều này bao gồm những người bị khiếm thị, khiếm thính, khuyết tật về nhận thức hoặc thể chất. Vượt ra ngoài phạm vi những người khuyết tật - còn có người già hay trẻ, những người từ những nền văn hóa khác nhau, những người sử dụng thiết bị di động hay những người có kết nối mạng không đáng tin cậy chậm thì sao?
  • Tính quốc tế hóa nghĩa là làm cho các trang web sử dụng được cho những người từ các nền văn hóa khác nhau, những người nói những ngôn ngữ khác với của bạn. Có những vấn đề kỹ thuật cần cân nhắc ở đây (chẳng hạn như thay đổi bố cục đế trang web vẫn hoạt động OK cho các ngôn ngữ từ phải sang trái hoặc thậm chí theo chiều dọc), và những cân nhắc về con người (chẳng hạn như sử dụng ngôn ngữ đơn giản, không sử dụng tiếng lóng để những người sử dụng ngôn ngữ của bạn như là ngôn ngữ thứ 2 hoặc thứ 2 của họ có thể hiểu được văn bản của bạn).
  • Quyền riêng tư & Bảo mật. Hai khái niệm này có liên quan với nhau nhưng khác nhau.Quyền riêng tư đề cập đến việc cho phép mọi người tiến hành công việc của họ một cách riêng tư và không theo dõi họ hoặc là thu thập nhiều dữ liệu của họ hơn mức bạn thực sự cần. Bảo mật đề cập đến việc xây dựng trang web của bạn theo cách an toàn để các người dùng độc hại không thể lấy cắp thông tin trên đó từ bạn hoặc người dùng của bạn.

See also