Font chữ Flashcards
(23 cards)
Tại sao nên sử dụng đơn vị tương đối?
Đơn vị tương đối như rem, em, hoặc % giúp font chữ linh hoạt, dễ thích ứng với các thiết bị và cài đặt người dùng.
Đơn vị tương đối cải thiện khả năng truy cập và trải nghiệm người dùng.
Đơn vị rem tính dựa trên gì?
Kích thước font gốc của :root (thường là 16px mặc định).
Sử dụng rem giúp các kích thước font đồng nhất và dễ quản lý.
Đơn vị em tính dựa trên kích thước font nào?
Kích thước font của phần tử cha.
Em có thể dẫn đến sự thay đổi kích thước không mong muốn nếu phần tử cha thay đổi kích thước.
vw và vh là gì?
Dựa trên kích thước viewport, phù hợp với thiết kế responsive.
vw (viewport width) và vh (viewport height) cho phép thiết kế linh hoạt theo kích thước màn hình.
Đơn vị % tính dựa trên cái gì?
Kích thước font của phần tử cha.
Đơn vị % có thể gây ra những vấn đề tương tự như em trong một số tình huống.
Gợi ý sử dụng đơn vị nào để đảm bảo tính nhất quán toàn dự án?
Ưu tiên rem.
Sử dụng rem giúp dễ dàng điều chỉnh kích thước font trên toàn bộ trang web.
Định nghĩa hệ thống kích cỡ font (Typography Scale)
Hệ thống kích cỡ font nhất quán tạo cảm giác hài hòa và dễ quản lý
Hệ thống này giúp cải thiện khả năng đọc và tính thẩm mỹ của văn bản.
Tại sao cần có hệ thống kích cỡ font?
Để tạo cảm giác hài hòa và dễ quản lý
Một hệ thống kích cỡ font giúp người dùng dễ dàng nhận biết các cấp độ nội dung khác nhau.
Cách làm một hệ thống kích cỡ font?
Sử dụng tỷ lệ tỷ lệ (scale) như 1.2, 1.25, hoặc 1.5 để tạo sự khác biệt giữa các cấp bậc font
Ví dụ: h1, h2, p.
Công cụ nào giúp tạo tỷ lệ font đẹp?
Type Scale (type-scale.com)
Công cụ này cho phép người dùng tạo ra các tỷ lệ font một cách dễ dàng và trực quan.
Tại sao sử dụng biến CSS để quản lý kích cỡ font?
Biến CSS giúp tập trung kích cỡ font, dễ dàng thay đổi và tái sử dụng.
Giúp tiết kiệm thời gian và công sức trong việc điều chỉnh thiết kế.
Cách làm để sử dụng biến CSS cho kích cỡ font là gì?
Định nghĩa kích cỡ font trong :root và sử dụng biến ở các phần tử.
:root là selector đại diện cho phần tử gốc của tài liệu.
Kích cỡ tối thiểu của font chữ cho văn bản chính nên là bao nhiêu?
Không nhỏ hơn 16px (1rem)
Yếu tố nào cần đảm bảo để hỗ trợ zoom cho font chữ?
Font chữ phản hồi tốt khi người dùng phóng to/thu nhỏ trình duyệt
Để đạt được tỷ lệ tương phản tốt, cần kết hợp những yếu tố nào?
Kích cỡ font với màu chữ/nền
Theo chuẩn nào, tỷ lệ tương phản giữa màu chữ và nền cần được xem xét?
Chuẩn WCAG
Tại sao cần sử dụng Responsive Typography?
Kích cỡ font cần thay đổi theo kích thước màn hình để phù hợp với thiết bị di động, tablet và desktop.
Có những cách nào để thực hiện Responsive Typography?
Sử dụng media queries để điều chỉnh font. Kết hợp vw, vmin, hoặc clamp() để font tự động co giãn.
Nên làm gì để tách biệt phần typography trong dự án?
Đặt các biến font trong một phần riêng hoặc file riêng (ví dụ: typography.css).
Khi kết hợp typography với các thuộc tính khác, khoảng cách dòng (line-height) nên được đặt như thế nào để dễ đọc?
Nên đặt khoảng cách dòng (line-height) hợp lý, thường từ 1.4 đến 1.6 lần kích cỡ font.
Làm thế nào để tạo sự tương phản khi kết hợp typography với các thuộc tính khác?
Kết hợp độ đậm (font-weight) như 300, 400, 700 để tạo sự tương phản.
Khi nào nên điều chỉnh khoảng cách chữ (letter-spacing) trong typography?
Nên điều chỉnh khoảng cách chữ (letter-spacing) nếu cần, đặc biệt cho tiêu đề lớn.
