Graphiclancer.com

   Xin chào!
Tôi là Vũ Quang Cường. Hiện tôi đang làm việc và nghiên cứu thiết kế Website. Đây là blog của tôi, nơi tôi có thể chia sẻ với các bạn về công việc, cuộc sống và những niềm đam mê. Nếu bạn là một người đam mê thiết kế đồ họa, đừng quên ghé thăm chuyên mục Download nhé.   Enjoy!
                                                                                                                More about me   
Font size trong thiết kế web

Font size của một website là bao nhiêu thì hợp lý? Theo tôi không có một chuẩn mực nào chính xác quy định cỡ chữ của website nói chung.

Bởi có nhiều nguyên nhân, nhưng có thể liệt kê ra những nguyên nhân khiến cho việc sử dụng font-size tùy biến rộng rãi trong thiết kế web:

  • Font chữ khác nhau sẽ có kích thước khác nhau.
  • Font chữ cho các ngôn ngữ khác nhau sẽ có kích thước khác nhau (ví dụ Tiếng Việt, tiếng Pháp, tiếng Đức... có dấu sẽ khác với tiếng Anh).
  • Đặc trưng nội dung sẽ cho các sự lựa chọn font-size khác nhau (ví dụ website tin tức, website học tập tra cứu, website theo style 2.0).
  • Các hệ điều hành khác nhau sẽ cho kích thước font khác nhau (với Mac OS là 72dpi, Windows là 96dpi)
  • Độ tương phản giữa màu chữ và màu nền sẽ cho hiệu ứng khác nhau về kích thước
  • Các quy chuẩn của font-zize trong CSS:

    Đơn vị tính:
    Points
    Picas
    Pixels
    Ems
    Exes
    Percentages
    Ký hiệu:
    pt
    pc
    px
    Em
    Ex
    %

    Sự chênh lệch do quy đổi giữa các hệ đơn vị.
    Với đơn vị là pts (Points) = 0.72 inch . Trong khi đó 1 inch = 6.022 pc (Picas)

    Font

    Để có được sự thống nhất về kích thước font trong thiết kế web, tôi thường dùng quy chuẩn sau đây để đặt kích thước cho font-size.

    • Thẻ <p>: Ít nhất là 10pt, và 120% cho "big" và 90% cho "small"
    • Thẻ <h1>: 255%
    • Thẻ <h2>: 200%
    • Thẻ <h3>: 150%
    • Thẻ <h4>: 125%

    Dưới đây là một số hình ảnh về sự khác nhau về kích thước của font chữ được tính toán bởi Typetester.org

    Font Arial
    Arial
    Font Tahoma
    Tahoma
    Font Times New Roman
    Times New Roman
    Comments (0)Add Comment

    Write comment
    smaller | bigger

    busy