Bộ câu hỏi phỏng vấn HTML phần 1

HTML là gì?


HTML hay Ngôn ngữ đánh dấu siêu văn bản được Berners-Lee tạo ra vào năm 1991. Nó là một ngôn ngữ đánh dấu được sử dụng để tạo và cấu trúc các mẫu trang web hoặc các trang web để trình bày nội dung trên World Wide Web. Nó bao gồm một loạt các phần tử và các phần tử HTML cho trình duyệt biết cách hiển thị nội dung. HTML giúp làm cho văn bản trở nên tương tác và năng động hơn. Bạn có thể lưu một trang HTML bằng cách thêm .html hoặc .html vào tên trang web.

Có phải tất cả các thể HTML đều có thẻ đóng?


Không, tất cả các thẻ HTML không có thẻ kết thúc. Ví dụ: thẻ <br/> dùng để ngắt dòng, thẻ <img/> dùng để chèn hình ảnh vào tài liệu. Chúng được coi là thẻ tự đóng và không yêu cầu thẻ kết thúc.

Thuộc tính trong HTML là gì?


Thuộc tính HTML cung cấp thông tin bổ sung về các phần tử HTML. Chúng được xác định trực tiếp sau tên thẻ. Chúng chỉ xuất hiện trong thẻ mở và không xuất hiện trong thẻ đóng.

Các thuộc tính HTML thường bao gồm các cặp tên / giá trị như name = "value". Các giá trị Thuộc tính phải luôn được đặt trong dấu ngoặc kép. Tham số name lấy tên của thuộc tính sẽ được gán cho phần tử. Giá trị lấy giá trị thuộc tính hoặc phạm vi của tên thuộc tính có thể được căn chỉnh trên phần tử.

Một số thuộc tính HTML thường được sử dụng bao gồm Thuộc tính src, Thuộc tính alt, Thuộc tính id và Thuộc tính href.

HTML ngữ nghĩa là gì?


HTML ngữ nghĩa là một phong cách mã hóa. Đó là việc sử dụng đánh dấu HTML để củng cố ngữ nghĩa hoặc ý nghĩa của nội dung trong các trang web và ứng dụng web hơn là chỉ xác định giao diện hoặc hình thức của nó. Nó giới thiệu ý nghĩa cho mã chúng ta viết.

Ví dụ: <form>, <table><article> các thẻ này xác định rõ nội dung của nó.

Sự khác biệt giữa HTML và XHTML là gì?


HTMLXHTML
HTML là viết tắt của Hypertext Markup Language.XHTML là viết tắt của Ngôn ngữ đánh dấu siêu văn bản có thể mở rộng.
Nó được mở rộng từ SGML (Ngôn ngữ đánh dấu tổng quát tiêu chuẩn).Nó có các tính năng của cả XML và HTML.
HTML là một trang web tĩnh.XHTML là một Trang Web động.
Nó sử dụng một định dạng tệp tài liệu.Nó sử dụng ngôn ngữ đánh dấu.
HTML là về hiển thị thông tin.Đó là về việc mô tả thông tin.
Không phân biệt chữ hoa chữ thường.XHTML phân biệt chữ hoa chữ thường. Mọi thẻ và thuộc tính phải ở dạng chữ thường.
Không cần thiết phải đóng các thẻ theo thứ tự chúng được mở.Cần phải đóng các thẻ theo thứ tự chúng được mở.
Tất cả nội dung có thể được bao gồm trong phần tử nội dung.Tất cả nội dung phải được đặt trong các khối.
Nó yêu cầu một trình phân tích cú pháp dành riêng cho HTML khoan dung.Việc phân tích cú pháp được thực hiện bằng một trình phân tích cú pháp XML chuẩn.
Phần mở rộng tên tệp là: .html, .htmPhần mở rộng tên tệp là: .xhtml, .xht, .xml, .html, .htm

Thẻ Meta được dùng để làm gì trong HTML?


Thẻ meta trong HTML được đặt trong phần đầu <head> của trang HTML để cung cấp thông tin về trang web cho công cụ tìm kiếm. Những thông tin đó thường gồm: tiêu đề, từ khóa chính, tóm tắt nội dung, ngôn ngữ chính được sử dụng....

Thẻ meta được sử dụng cho việc tối ưu hóa công cụ tìm kiếm để nói cho công cụ tìm kiếm về nội dung trang. Dưới đây là một số thẻ meta thường sử dụng

Thẻ title

Đây là tiêu đề của trang web, cho biết chủ đề của trang về vấn đề gì. Cú pháp như sau

<title>kungfutech.edu.vn</title>

Nội dung của thẻ <title> được hiển thị trong thanh bar trên cùng của cửa sổ trình duyệt. Ngoài ra, nó còn xuất hiện trong trang kết quả tìm kiếm, hay trong phần chia sẻ trên mạng xã hội (Facebook, Twitter, Zalo…)

Thẻ meta description

Thẻ này nêu tóm tắt nội dung của trang web. Nó chi tiết hơn thẻ nhan đề ở trên. Tuy nhiên cũng không nên quá dài, vì điều đó không cần thiết, nhất là khi chỉ có thể hiển thị được 1 số ký tự trên trang tìm kiếm. Nếu để mô tả dài quá sẽ bị Google cắt bớt khi hiển thị kết quả. Cú pháp như sau:

<meta name="description" content="Nội dung chính của trang" />

Thẻ meta content-type

Thẻ content-type dùng để khai báo hệ thống ký tự trên trang web sử dụng HTML 4.01. Nó giúp các trình duyệt biết được nội dung trang web được mã hóa ký tự ra sao, để từ đó có thể hiển thị thông tin một cách tốt nhất. Cú pháp phổ biến như sau:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Đối với HTML5 chúng ta sử dụng -->
<meta charset="UTF-8" />

Thẻ meta keyword

Meta keyword sẽ giúp công cụ tìm kiếm xác định chủ đề mà trang web truyền tải đến người dùng. Cú pháp như sau:

<meta name="keywords" content="từ" khóa” />

Ngoài ra con rất nhiều thẻ meta khác.

Iframe là gì và nó hoạt động như thế nào?


iFrame là viết tắt của cụm từ Inline Frame và tạm dịch là khung nội tuyến, là một thẻ giúp nhúng HTML, hình ảnh, video hay trang web khác vào website của mình.

Ví dụ:

<iframe src="https://kungfutech.edu.vn" height="300px" width="300px"></iframe>

Các đặc điểm của thẻ Meta?


  • Thẻ meta luôn đi bên trong phần tử <head> và thường được sử dụng để chỉ định bộ ký tự, mô tả trang, từ khóa, tác giả của tài liệu và cài đặt chế độ xem.
  • Thẻ meta luôn có cặp tên/giá trị.
  • Dữ liệu meta sẽ không được hiển thị trên trang nhưng có thể phân tích cú pháp bằng máy.
  • Thẻ meta được sử dụng bởi các trình duyệt (cách hiển thị nội dung hoặc tải lại trang), công cụ tìm kiếm (từ khóa) và các dịch vụ web khác.
<!DOCTYPE html>
<html>
  <head>
    <meta name="description" content="I am a web page with description" />
    <title>KungFu Tech</title>
  </head>
  <body></body>
</html>

Thuộc tính alt trong thẻ img để làm gì?


  • Thuộc tính alt cung cấp thông tin về hình ảnh trong trường hợp người dùng không xem được ảnh (sai đường dẫn hoặc ảnh không tìm thấy).
  • Thuộc tính alt thường được dùng để mô tả thông tin hình ảnh , một số trường hợp thuộc tính alt được dùng trong mục đích trang trí, một số trường hợp thuộc tính alt có thể bị bỏ trống.
  • Thuộc tính alt để phục vụ việc tối ưu SEO, vì công cụ tìm kiếm không thể hiểu được ảnh của bạn là gì, chúng thông qua alt để có thể hiểu hình ảnh.

Khai báo "DOCTYPE" để làm gì?


Mục đích của việc khải bảo "DOCTYPE" là để trình duyệt nhận biết trang html đó được viết ở phiên bản nào.

Liệt kê 3 cách để định nghĩa 1 color trong html?


Dưới đây là ví dụ:

  • Hex (color: #FFFFFF)
  • Name (color: red)
  • RGB(0,0,225)

cách thêm màu trong HTML

Làm cách nào để có có thứ hạng tốt hơn trong SEO bởi Search Engines?


Có rất nhiều cách mà lập trình viên nên biết

  • Sử dụng các thẻ có ngữ nghĩa thay cho các thẻ khôn có ngữ nghĩa như <figure>, <section>, <article>...
  • Sử dụng các thẻ meta triệt để, đặc biệt như description, keyword,...và các thẻ tối ưu cho các mạng xã hội.
  • Học thêm một số kỹ thuật cho thẻ <a>, <img>,...
<meta name="keywords" content="keyword keyword keyword keyword" />
<meta name="description" content="description of your site" />

Mô tả các tính năng chính của HTML5?


HTML5 được thiết kế để thay thế HTML 4, XHTML và HTML DOM. Các mục tiêu và yêu cầu của HTML5 là:

  • Cung cấp nội dung phong phú (đồ họa, phim, v.v.) mà không cần bổ sung plugin, chẳng hạn như Flash.
  • Cung cấp hỗ trợ ngữ nghĩa tốt hơn cho cấu trúc trang web thông qua các thẻ phần tử cấu trúc mới.
  • Cung cấp tiêu chuẩn phân tích cú pháp chặt chẽ hơn để đơn giản hóa việc xử lý lỗi, đảm bảo hành vi trên nhiều trình duyệt nhất quán hơn và đơn giản hóa khả năng tương thích với các tài liệu được viết theo tiêu chuẩn cũ hơn.
  • Cung cấp hỗ trợ đa nền tảng tốt hơn dù chạy trên PC, Máy tính bảng hay Điện thoại thông minh.

Làm sao để làm nổi bật (highlight) chữ trong HTML?


Nếu bạn đang làm việc với html5, thẻ <mark> có thể nhanh chóng và dễ dàng để làm nổi bật hoặc đánh dấu văn bảng trong trang.

<mark>highlighted text</mark>

Để nổi bật đoạn văn bảng chỉ dùng mã HTML và hỗ trợ tất cả trình duyệt, dùng thuộc tính css như bên dưới:

<span style="background-color: #FFFF00">Yellow text.</span>

Mục đích của việc chặn cache, và làm sao để đạt được điều đó?


Các trình duyệt có bộ nhớ cache để lưu trữ tạm thời các tệp trên trang web để chúng không cần phải tải xuống lại khi chuyển đổi giữa các trang hoặc tải lại cùng một trang. Máy chủ được thiết lập để gửi tiêu đề yêu cầu trình duyệt lưu trữ tệp trong một khoảng thời gian nhất định. Điều này làm tăng đáng kể tốc độ trang web và bảo toàn băng thông. Tuy nhiên, nó có thể gây ra sự cố khi trang web đã được thay đổi bởi các nhà phát triển vì bộ nhớ cache của người dùng vẫn tham chiếu đến các tệp cũ. Điều này có thể khiến chúng có chức năng cũ hoặc phá vỡ trang web nếu các tệp CSS và JavaScript được lưu trong bộ nhớ cache là các phần tử tham chiếu không còn tồn tại, đã di chuyển hoặc đã được đổi tên. Cache busting là quá trình buộc trình duyệt tải xuống các tệp mới. Điều này được thực hiện bằng cách đặt tên tệp khác với tệp cũ. Một kỹ thuật phổ biến để buộc trình duyệt tải xuống lại tệp là nối một chuỗi truy vấn vào cuối tệp.

src="js/script.js" => src="js/script.js?v=2"

Trình duyệt coi nó là một tệp khác nhưng ngăn chặn việc phải thay đổi tên tệp.

Một trang web có thể chứa nhiều thẻ header, footer không?


Có cho cả hai. Các tài liệu W3 cho biết rằng các thẻ đại diện cho các khu vực đầu trang (<header>) và chân trang (<footer>) của "phần" tổ tiên gần nhất của chúng. Vì vậy, không chỉ trang <body> có thể chứa đầu trang và chân trang, mà mọi phần tử <article><section> cũng vậy. Thật tốt khi biết rằng W3 khuyên bạn nên có bao nhiêu tùy thích, nhưng chỉ 1 trong số đó cho mỗi "phần" trên trang của bạn, tức là nội dung, phần, v.v.

Avatar Techmely Team
VIẾT BỞI

Techmely Team