Hướng dẫn kỹ thuật, Tin tức
Những font chữ dùng trong thiết kế website
Để một website có được nhiều lượt tương tác, truy cập thì ngoài giao diện website, hình ảnh, font chữ cũng là điều mà bạn cần phải lưu ý. Ngày nay, font chữ dùng để thiết kế website có rất nhiều, với nhiều phong cách độc đáo và cá tính. Vậy có những font chữ nào thích hợp để thiết kế website. Các bạn hãy cùng với Web Khởi Nghiệp tìm hiểu trong bài viết dưới đây.
Nội dung chính:
Arial – Kiểu font tiêu chuẩn khi thiết kế web
Được xem là kiểu font tiêu chuẩn khi lập trình web, và được sử dụng phổ biến nhất trong nhóm sans-serif. Font này được lựa chọn để có thể thay thế cho các kiểu font khác trên thiết bị Windows
Helvetica
Font sử dụng kiểu chữ sans-serif phổ biến, được phát triển bởi Max Miedinger – nhà thiết kế font chữ nổi tiếng người Thụy Sĩ vào năm 1957. Font chữ này có chiều cao x (x-height), giúp người dùng dễ đọc hơn khi nó ở kích thước nhỏ, cũng như khoảng cách giữa các ký tự khá gần.
Những phiên bản của Helvetica được sử dụng cho các thứ tiếng: Latin, Hebrew, Nhật, Cyrillic, Hàn, Hindi, Hàn, Khmer, Urdu và Việt Nam.
Verdana
Là kiểu font chữ dành cho menu thuộc nhóm sans-serif, có kích thước lớn. Ký tự của font thường kéo dài, nó giúp bạn có thể dễ có thể đọc được dễ dàng.
Times New Roman
Là một trong những font chữ phổ biến nhất trên thiết bị Windows. Font chữ phù hợp với các trang tài liệu, báo chí,…. Và nó cũng hỗ trợ ngôn ngữ tiếng Việt
Courier New
Một kiểu font tương tự Times New Roman, một biến thể của kiểu cổ điển khác, và được xem là font chữ đơn cách
Tahoma
Là một trong những kiểu font thông dụng, kiểu chữ đẹp mắt, rõ ràng. Tác dụng của font này rất đa dạng, có thể được dùng làm menu, tiêu đề chính, tiêu đề phụ cũng như nội dung bài viết.
Georgia
Font chữ tương tự như Verdana có ký tự font lớn hơn so với các font có cùng kích cỡ. Đây sẽ là sự lựa chọn tuyệt vời trong một số trường hợp nhất định. Bạn cũng cần lưu ý một điều là không nên ghép font này với font khác, vì có thể font này sẽ trông to hơn font được ghép đôi.
Calibri
Là font chữ mặc định trong Word, vì nó rất phù hợp với việc soạn thảo văn bản, và cũng có thể dùng trong thiết kế web với kích thước 12 pt (point) trở lên
Garamond
Là font được dùng ở các trường học vào thế kỷ XVI ở Paris – Pháp. Đối với phiên bản mới thì nó đã được tích hợp sẵn trên những thiết bị chạy Windows. Thế nhưng, font này lại có một nhược điểm là nó không hỗ trợ tốt cho tiếng Việt.
Bookman (Bookman Old Style)
Nếu bạn đang băn khoăn không biết nên chọn font gì để làm tiêu đề, thì Bookman là một sự lựa chọn tuyệt vời đấy
Làm thế nào để nhúng font vào trang web?
Để nhúng font vào web khi thực hiện thiết kế website thì có rất nhiều cách, trong bài viết này xin hướng dẫn các bạn 2 cách nhúng font vào website:
Nhúng trực tiếp bằng CSS
Đầu tiên các bạn tải font từ trên Internet về máy tính
Tiếp theo, bạn truy cập vào thư mục CSS của bạn trên hosting và tải font bạn vừa download về máy tính lên
Bạn mở file CSS chính của bạn lên và thêm vào dòng sau, vị trí thêm là ở đầu file css.
@font-face giúp bạn định nghĩa 1 font mới cho website của bạn, với nhiều thuộc tính font khác:
- src:url(đường dẫn): Đây là đường dẫn đến font của bạn. Bạn có thể dùng đường dẫn trực tiếp hoặc đường dẫn gián tiếp để website có thể nhận được font của bạn. Mình thường hay sử dụng đường dẫn trực tiếp để dẫn link đến font mình cần (mình sẽ nói rõ hơn về đường dẫn trực tiếp và được dẫn giá tiếp ở những bài viết sau)
- font-family: Tên font bạn muốn: Thuộc tính này sẽ giúp bạn đặt tên cho font mà bạn nhúng vào
Bạn có thể thêm các thuộc tính khác vào để giúp font trông đẹp hơn, font chữ to hơn….
Dùng Google font với cách nhúng thẻ Link HTML
Bạn truy cập vào đường dẫn https://fonts.google.com để chọn font mà bạn thích
Sau khi bạn chọn được font mà bạn thích bạn nhấn chuột trái thẳng vào font đó.
Sau đó bạn chọn Select this style
Một hộp thoại Select Family sẽ hiện lên, bạn nhấp vào tab Embed.
Sau đấy copy đoạn code <link> và dán vào trong cặp thẻ <head></head> của mã nguồn.
Để sử dụng được font bạn chuyển qua file CSS chính thêm đoạn code font-family và nơi mà bạn muốn thay đổi font.
Vậy là xong rồi đấy, nhúng font rất dễ dàng phải không nào. Bạn có thể thử với những kiểu font khác mà bạn muốn đấy.
Trên đây là bài viết về font chữ dùng trong thiết kế website, cũng như các nhúng font vào website. Xin chào và hẹn gặp lại các bạn ở những bài viết sau.