Hướng dẫn tạo favicon bằng photoshop

Một vài năm trở lại đây, khi lướt web bạn sẽ thấy một hình biểu tượng nho nhỏ nằm bên cạnh tên trang web trên thanh URL của trình duyệt, biểu tượng đó chính là Favicon.



Càng ngày favicon càng trở lên quan trọng, hầu hết các website lớn đề có favicon, và các trình duyệt phổ biến đều hỗ trợ hiển thị favicon trên thanh Url. Nhomthietke.com sẽ hướng dẫn bạn cách tạo ra một favicon cho website của mình bằng photoshop.


- Favicon có phần mở rộng là .ICO, vì thế để lưu được định dạng này, bạn phải tải thêm plugin này:

http://www.telegraphics.com.au/sw/files/ICOFormat-1.6f9-win.zip

Giải nén và coppy vào thư mục cài đặt photoshop của bạn (thường là: C:\Program Files\Adobe\Photoshop\Plug-Ins\File Formats)

- Tạo và thiết kế biểu tượng của bạn, đưa về kích thước 16 x 16 pixel, rồi lưu file với tên là favicon, định dàng là ico (favicon.icon)

- Upload file lên thư mục web của bạn.

- Thường thì trình duyệt sẽ tự nhận biết được favicon của bạn và hiển thị chúng. Nhưng một số trình duyệt cũ thì không thông minh như vậy, bạn hãy dùng đoạn mã sau để gọi favicon ra:

<link type=”image/x-icon” href=’Đường dẫn tới file’ rel=”shortcut icon”/>


----

Nếu không có khả năng design, bạn có thể kiếm favion trên một vài trang cung cấp miễn phí:

http://www.getfavicon.org

http://www.favicon.cc

http://www.favicon.co.uk

...

 

Sao mình vẫn làm Favicon cho blog bằng đuôi JPG được. Yêu cầu của nó phải là hình vuông. Do đó dùng một cái ảnh bất kì muốn làm fvc rồi mở một soft đồ họa, đơn giản như paint. Caval size cho nó thành hình vuông là ok.

 

Nếu sử dụng

Mã:

<link type=”image/x-icon” href=’Đường dẫn tới file’ rel=”shortcut icon”/>

thì định dạng ảnh nào cũng ok, gif chơi tuốt

nhưng đúng dịnh dạng nó là file favicon.ico ^_^!

Thanks chủ thớt nhé! bik thêm chút chút PTS

 

mình thì lại dùng pts rồi xuất ico bằng chú này http://tools.dynamicdrive.com/favicon/

 

Mình dùng thư viện có sẵn cho tiện http://www.favicon.cc/?action=icon&file_id=382229 , đây là icon mình dùng kaka, có dịp làm 1 cái riêng cho nó PRO

 

"Sao mình vẫn làm Favicon cho blog bằng đuôi JPG được. Yêu cầu của nó phải là hình vuông. Do đó dùng một cái ảnh bất kì muốn làm fvc rồi mở một soft đồ họa, đơn giản như paint. Caval size cho nó thành hình vuông là ok. "
mình cùng thường làm như bạn!

 

Bài viết rất hữu ích. Thanks !

 

Mình cũng dùng Photoshop làm, nhưng không cần save định dạng .ico mà là .gif vẫn OK.
Chỉ cần kích cỡ 16x16 thôi.

 

Lỗi hết đường dẫn ảnh rồi kìa bác, bây giờ có nhiều web site cho thiết kế online hay lắm, dùng photoshop khó lắm

 

Sao mình làm đến cái phần tạo favion mà nó không ra nhỉ ?

 

trời, làm dễ mà, thiết kế 1 icon ... bằng photoshop, kich thuot hình khoảng 100x100 xog , nếu bạn để logo có nền trong suốt thì save lại file png còn ko thì jpg, len google seach tu khoa : png > ico ... vào trang đầu tiên . Chọn file muốn cover rùi seve vè ... đơn giản thôi ma

 

Mình cũng tập tành làm icon được vãi mẫu rồi, những mình chưa tìm hiểu mấy site trên bạn chia sẻ
Thanks b nhé !!!
Lâu rồi k làm mình nên thử lại với CS6 xem co j thay đổi ko

 

mình đang làm một cái blog bạn dạy mình cách tạo favicon đi ạ! kỹ kỹ một chút ạ!

 

hay nhỉ hihi! giờ em mới biết nó gọi là favicon đấy @@~, nhưng nếu là GG site thì chỉnh kiểu gì hả bác

 

E toàn xài bằng chú này : tools.dynamicdrive.com/favicon/

gọn ve nhẹ