メインコンテンツまでスキップ

Font chữ

Điều đầu tiên khi nhận task chính là kiểm tra design, đối tượng cần kiểm tra đầu tiên trong design chính là font chữ.

Chúng ta có 3 trường hợp sau khi kiểm tra font:

Font chữ thông thường, mặc định có sẵn

Đối với font tiếng Nhật, các font chữ mà design thường dùng có sẵn mặc định trong máy gồm:

Meiryo, MS Gothic, Yu Gothic, Hiragino

font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
font-weight: 500;

Yu Mincho, Hiragino Mincho

font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", serif;
font-weight: 500;

Đối với trường hợp trên, bạn hãy khai báo font-family như trên.

Google, Adobe font

Khách hàng Nhật thường dùng các loại font khác nhau để làm phong phú design của họ và rất nhiều trường hợp được lấy từ Google hay Adobe font.

Google font

Là thư viện font-face được cung cấp bởi Google, nó miễn phí và không vi phạm bất kỳ vấn đề về bản quyền.
Bạn có thể dễ dàng tìm kiếm và lấy về để nhúng vào trang web.
Các font hay sử dụng như:

ghi chú

Khi nhúng google font vào web, hãy sử dụng phương thức <link> , không sử dụng @import , bởi vì @import trong CSS sẽ không tối ưu việc tải của web

Adobe font

Với Abobe font, bạn cần phải được cấp tài khoản trả phí mới có thể lấy được code nhúng vào trong web.
Tài khoản Adobe thường sẽ được cung cấp bởi khách hàng.
Mentor sẽ chịu trách nhiệm hướng dẫn.

Các trường hợp font đặc biệt

Đối với các trường hợp đặc biệt, khi bạn kiểm tra design và thấy font không tồn tại trong máy và cũng không có trên Google hay Adobe font.
Hãy liên lạc với khách hàng để xác nhận font đó sẽ dùng theo dạng text hay hình ảnh.

  • Nếu dùng dạng text hãy đề xuất phương án thay thế font khác để có thể dùng font-face hoặc font mặc định.
  • Nếu dùng dạng image thì phải có sự xác nhận của khách hàng để được cắt hình.

Những điều cần lưu ý khi xử lý font

  • Font family phải có sans-serif hoặc serif ở đuôi.

  • Main Font phải định chung cho 1 thẻ bao quát lớn nhất, thông thường sẽ là thẻ body

    body {
    font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    }
  • Font size phải là đơn vị rem, chỉ cho phép số lượng số thập phân là 1. Ví dụ: font-size: 2.5rem.

  • Font weight cũng là thuộc tính cần phải chú trọng.

    ValueCommon weight name
    100Thin (Hairline)
    200Extra Light (Ultra Light)
    300Light
    400Normal (Regular)
    500Medium
    600Semi Bold (Demi Bold)
    700Bold
    800Extra Bold (Ultra Bold)
    900Black (Heavy)
    950Extra Black (Ultra Black)
cảnh báo
  • Đối với font, khi coding phải đảm bảo giống theo design mà khách hàng đã giao.
  • Các trường hợp chưa rõ ràng hoặc không có font thì phải lập tức liên hệ khách hàng.
  • Tuyệt đối không được tự ý download font ở trên mạng, và sử dụng file font convert sang font-face mà không có sự xác nhận của khách hàng. Bởi vì đa phần các font tiếng Nhật đều là bản quyền, nếu bạn sử dụng một cách tự do, bạn sẽ vi phạm pháp luật.