Cách tạo và lấy favicon từ các Website khác

Nếu bạn là một WebMaster thì cụm từ Favicon là một cụm từ rất quen thuộc, nó là một trong những yêu cầu đầu tiên khi đưa Website vào hoạt động. Vậy Favicon là gì? Favicon là viết tắt của cụm từ Favorites icon, nó chính là biểu tượng nhỏ xuất hiện ngay cạnh Title của trang Web trên các trình duyệt dạng Tab hiện nay như: Firefox, Google Chrome… Favicon cũng xuất hiện cả trên Bookmark khi bạn đưa Site đó vào Bookmark của trình duyệt. Favicon thường có kích cỡ 16×16, 32×32, 48×48, 64×64 và lớn nhất là 128×128.


Có rất nhiều cách để tạo ra 1 favicon, bạn có thể sử dụng các phần mềm chuyển đổi ảnh thành Icon hoặc dùng các phần mềm resize ảnh về đúng kích cỡ như tôi đã nói ở trên. Đặc biệt hơn, nếu bạn “thần tượng” một website nào đó thì có thể trực tiếp lấy favicon của website đó về làm favicon cho website của mình.

1. Tạo Icon để làm Favicon:

Trước khi tiến hành tạo 1 icon làm Favicon thì bạn nên biết rằng Favicon có 2 loại là Favicon tĩnh và Favicon động. Favicon tĩnh thường được tạo với phần mở rộng là .ico còn Favicon có phần mở rộng là Gif.

- Nếu bạn muốn làm 1 favicon động thì vô cùng đơn giản, bạn chỉ việc thay đổi kích thước file GIF bạn định dùng làm Favicon về đúng với một trong các kích cỡ đã nói ở phía trên.

- Để làm một Favicon tĩnh cũng đơn giản không kém. Cách nhanh nhất là nhờ tới dịch vụ https://www.genfavicon.com

Ở đây bạn chỉ cần Upload ảnh lên (Upload Image), bắt hình theo khung kích thước mà bạn chọn (Capture) và cuối cùng là bấm vào Download Favicon. Lúc đó bạn sẽ được chuyển tới trang Web mới chưa favicon bạn vừa tạo, bấm phải chuột và Save nó về máy với tên favicon.ico.


2. Lấy favicon của các web site khác:

Có 2 cách giúp bạn lấy favicon từ các website khác đó là sử dụng Plugin Favicon Collection dành cho Firefox, khi cài plugin này nó sẽ tự bắt hình các favicon của các website bạn đã từng vào. Cách thứ 2 là sử dụng dịch vụ https://www.getfavicon.org/

Tôi tạm thời không đề cập tới plugin của FF vì nó không thật sự tiện lợi bằng dịch vụ Get Favicon. Với dịch vụ này bạn chỉ cần nhập vào địa chỉ trang web muốn lấy favicon, chọn định dạng bạn muốn xuất ra (ico, jpg, png,gif) và cuối cùng bấm Get favicon.


3. Code đưa favicon vào website:

- Đối với favicon động bạn hãy Upload file favicon.ico vừa tạo lên thư mục gốc của Website, sau đó chèn thêm đoạn code: <link rel=”shortcut icon” href=”/favicon.ico” /> vào ngay phía dưới thẻ <header>.

- Đối với Favicon động hoặc Favicon tĩnh nhưng có định dạng GIF bạn có thể upload lên đâu tùy thích, nhưng đoạn code thêm vào lại có đôi chút thay đổi: <link rel=”icon” href=”link favicon” type=”image/gif” >


Tất nhiên những cách này chưa phải là tối ưu, bạn hãy chia sẻ các của bạn để chúng ta cùng tham khảo được không?