Kích thước chữ trong website giúp bạn có một giao diện đẹp mắt

Rate this post

Việc thiết kế website có khá nhiều yêu cầu cần phải được chú ý. Một trong những yêu cầu đó là về phần font chữ, chúng ta phải thiết kế kích cỡ chữ như thế nào để người dùng dễ dàng nhìn thấy được và tạo nên một diện mạo đẹp, chuyên nghiệp cho trang Web của bạn. Qua bài viết chúng tôi sẽ đưa ra các nguyên tắc lựa chọn kích thước chữ trong website nhằm giúp các bạn có lựa chọn hợp lý riêng cho mình.

Kích thước trung bình của font tiêu đề

Lựa chọn kích thước font tiêu đề phụ thuộc vào các font sử dụng trong thiết kế. Trong mọi trường hợp, kích cỡ chữ phụ thuộc vào thiết kế tổng thể, về cách thức phù hợp với các tiêu đề trên trang web.

Tùy vào từng thiết bị sẽ có những font chữ khác nhau:

Tiêu đề lớnFont size
Desktop48px
Tablet40px
Mobile32px
Tiêu đề phụFont size
Desktop36px
Tablet32px
Mobile26px
Cỡ chữ trong website
Cỡ chữ trong website

Kích thước trung bình font chữ ở phần nội dung

Thông thường các trang web sẽ mặc định kích cỡ chữ là 16px cho phần nội dung trong website. Đây cũng chính là kích cỡ chữ thường được sử dụng trong việc in sách. Kích cỡ này sẽ làm cho người dùng cảm thấy thoải mái, không gây tình trạng mỏi mắt nếu có lỡ ngồi làm việc lâu trên thiết bị máy tính.

BodyFont sizeSố chữ trên 1 dòng
Desktop16px60 – 75
Tablet16px60 – 75
Mobile16px35 – 40

Khoảng cách dòng (Leading)

Việc giãn cách giữa các dòng trong phần nội dung văn bản cũng cần được chú ý. Khoảng cách giữa các dòng sẽ tạo cho người đọc cảm giác lôi cuốn, có không gian trống cho người dùng thư giãn khi phải tiếp xúc quá lâu trên máy tính. Khoảng cách chiều cao mỗi font chữ giữa các dòng là 3px. Nói đơn giản hơn, là nếu font chữ có kích cỡ 10px thì chiều cao khi đó là 13px, tạo cảm giác dễ đọc hơn cho người dùng.

Kích thước chữ trọng website
Kích thước chữ trọng website

Khoảng cách chữ (Kerning)

Chúng ta có thể điều chỉnh khoảng cách giữa các ký tự bằng nhiều phương pháp khác nhau. Nhưng, không nên điều chỉnh tỷ lệ giữa các ký tự, không kéo ký tự theo nhiều hướng khác nhau với mục đích thay đổi khoảng cách giữa các ký tự. Bạn cũng có thể chọn các font chữ khác nhau để có sự giãn cách giữa các ký tự hợp lý.

Số ký tự trên một dòng

Giới hạn đúng số lượng ký tự trên nội dung trong website, chính là chìa khóa về khả năng của độ dễ đọc cũng như độ dài dòng chữ. Tối đa bạn chỉ nên sử dụng 60 ký tự để mang lại trải nghiệm đọc tốt cho người dùng.

Số kí tự trên 1 dòng
Số kí tự trên 1 dòng

Đối với các thiết bị mobile, chỉ nên dùng khoảng 35 – 40 ký tự trên một dòng.

Những cách trên không phải là cố định. Thay vào đó hay lựa chọn kích cỡ cho thiết kế của bạn. Mỗi trang web cần độc đáo, và bạn có thể muốn thay đổi lựa chọn ở từng giai đoạn của thiết kế cho phù hợp với cách bố trí của bạn.

Nguyên tắc chọn Font chữ chuẩn

Dựa vào những mục đích xây dựng Website mà bạn sẽ chọn ra một số nguyên tắc. Từ đó, việc lựa chọn các Font sử dụng trong Website sẽ dễ dàng và hợp lý hơn:
   Nguyên tắc thứ 1: Dễ đọc
   Dễ đọc là nguyên tắc quan trọng nhất các bạn tuyệt đối không được quên. Một Website có đẹp xuất thần cỡ nào đi chăng nữa nhưng mà Font chữ ngoằn ngoèo khó đọc thì cũng coi như bỏ không các bạn nhé!
   Nguyên tắc thứ 2: Font chữ chuẩn
   Font chữ chuẩn cũng là một yếu tố quan trọng, chữ lớn quá thì không được mà chữ nhỏ quá thì cũng không được nốt. Đa phần các trang web đều sử dụng Font chữ 12 – 14 sẽ phù hợp và chuẩn nhất.
   Nguyên tắc thứ 3: Màu sắc
   Về màu sắc các bạn chú ý chọn màu chữ phù hợp với màu nền, phải tương phản với nhau để làm nổi bật và đem đến cảm giác dễ chịu cho người dùng.
   Nguyên tắc thứ 4: Thống nhất một loại Font chữ
   Sai lầm nhất là khi quan niệm một trang Web có nhiều Font chữ sẽ đẹp hơn. Điều này khiến cho website của bạn trở nên lộn xộn và không chuyên nghiệp.
   Nguyên tắc thứ 5: Khoảng cách dòng và chữ
   Khoảng cách giữa dòng và chữ cũng cần phải lưu ý. Việc có khoảng cách phù hợp giữa các dòng sẽ giúp lôi cuốn người đọc vì chúng tạo ra không gian nghỉ cho mắt.

Nếu bạn có bất kì nhu cầu nào liên quan đến vấn đề thiết kế web cần xử lý, hay có nhu cầu thiết kế cho doanh nghiệp mình trang web mang đậm phong cách riêng. Hãy đến với Thanh Hóa Web chúng tôi, với nhiều năm hoạt động trong lĩnh vực web, không ngừng cập nhật những xu hướng hiện đại để mang đến cho khách hàng những trải nghiệm tốt nhất trong suốt quá trình sử dụng dịch vụ.

Tham khảo thệm các bài viết hữu ích tại: https://thanhhoaweb.vn/blog/

Gợi ý cho bạn

Thiết kế và vận hành bởi Mekong Web Services

Đặt lịch hẹn
Đặt lịch

Báo giá
Báo giá

Đăng ký dùng thử
Dùng thử