Favicon là gì? Cách tạo Favicon cho website

 

Trong các ứng dụng của một web, chắc hẳn các bạn đã từng nghe đến Favicon, cũng như lợi ích của nó với lại web của mình. Thế nhưng đã khi nào bạn thực sự bỏ thời gian ra tìm hiểu xem Favicon là gì? Cách tạo ra một nó ở trên web phải thực hiện như thế nào hay chưa? Hãy cùng Wifim.vn tham khảo ngay nội dung bài viết này, để có được những thông tin, kiến thức cơ bản nhất nhé.


1. Favicon là gì

favicon

 Favicon được hiển thị phía góc trên cùng của tab trình duyệt

Favicon là viết tắt của từ favorite icon có nghĩa là “biểu tượng yêu thích”. Đây là một hình ảnh thu nhỏ trước tiêu đề của website. Nó còn được gọi là bookmark icon vì nó cũng hiển thị khi người dùng bookmark (đánh dấu) website của bạn.

2. Tầm quan trọng của việc tạo favicon cho website

  • Có thể nói Favicon cũng giống như một logo thu nhỏ. Nó giúp người dùng nhận ra thương hiệu của bạn giữa một rừng website khác và trong thanh bookmark.
  • Ngoài ra, tạo Favicon cho website còn hỗ trợ rất tốt cho SEO. Đây là một yếu tố đánh giá SEO của SEOquake.

3. Cách tạo Favicon cho website

Trong đó, Favicon thường là sẽ có hỗ trợ ở phần file mở rộng có đuôi là .ico, có một số trình duyệt thì được hỗ trợ về định dạng ảnh, phổ biến và thông thường như là: jpg, gif, pnp,… Tuy nhiên thì chúng ta chỉ nên sử dụng định dạng có đuôi .ico là tốt nhất. Theo đó, các bước cài đặt Favicon gồm có:

  • Bước 1: Bạn sẽ thực hiện tạo ra 1 file .icon. Để tạo được file này, trước tiên là các bạn sẽ phải thực hiện việc thiết kế ra một file ảnh, ảnh đó sẽ có một trong những kích thước cơ bản là: 16 x 16px; 32 x 32px; 48 x 48px; 64 x 64px.
  • Bước 2: Sau đó, bạn hãy truy cập vào trang http://www.favicon-generator.org/ rồi upload file ảnh mà bạn đã tạo trước đó lên để tạo. Khi đã tạo xong ở trên trang web, thì bạn sẽ thấy mình được web cung cấp cho một đường link download ảnh, lúc này đã được chuyển định dạng sang đuôi .ico.
  • Bước 3: Bạn thực hiện việc, Download file favicon.ico mà vừa tạo được, rồi up lên host có chứa web của mình.
  • Bước 4: Cuối cùng là bạn sẽ chèn đoạn mã HTML. Chèn đoạn mã đó, vào trong phần <head> </head> ở trang web. <link rel=”shortcut icon” href=”đường dẫn ảnh”/>.
 

Đơn giản phải không nào! Chúc các bạn thành công….

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *