Un title page
Thainextstep.com สอนทำเว็บไซต์ด้วย Dreamweaver Photoshop  PHP & MySql และ การทำ SEO
Un title page
Thainextstep.com สอน HTML บทความ Dreamweaver สอน Photoshop บทความ PHP & MySql Web Tips SEO Guide
Un title page
Webmaster Tips
  หลักการเรียนรู้ (เริ่มต้นจ้า)
  วัตถุดิบสำหรับเว็บไซต์
  เอาของฟรีมาฝาก
  รู้เรื่อง Banner มาตรฐาน
  ไอคอนตกแต่งเว็บ
  Free Brushes สวย ๆ
 


  ทำไอค่อนของเว็บไซต์ (Icon หน้า URL)
 

สำหรับบทความนี้ตามที่คุณแว่นได้ขอเข้ามา ตอนนี้ Webmaster ไปลองทำและและสรุปวิธี่การทำมาให้ตามบทความนี้ค่ะ (มาตอบช้าไปหวังว่าไม่ว่ากันน่ะค่ะ) วิธีการทำก็ไม่ยากค่ะ สามารถทำได้ดังนี้

     
 

วิธีทำ Icon ของเว็บไซต์

1. เตรียมรูปภาพที่จะทำ Icon ขนาด 16x16 พิกเซล นะค่ะ Save เป็น สกุล .gif , .jpg, .bmp หรือ .png ก็ได้

2. เมื่อได้รูปแล้วต้องเอารูปไปแปลงเป็นไฟล์สกุล .ico ซึ่งเราสามารถใช้โปรแกรมแปลงไฟล์ ตามเว็บที่ให้แปลงไฟล์ได้ โดยเพื่อน ๆ เข้าไปที่ URL ดังนี้ http://tools.dynamicdrive.com/favicon/



 
   
 
 
     

จากนั้นก็กดปุ่มเรียกดู แล้วนำภาพที่เราเตรียมไว้ในข้อที่ 1 เข้ามา จากนั้นคลิกที่ปุ่ม Create Icon หลังจากนั้นให้กดปุ่ม Download FavIcon ให้เพื่อน ๆ Save เก็บไว้ที่ web root ของเรา (ที่เดียวกับไฟล์ Home Page ของเรา) โดยตั้งชื่อไฟล์เป็น favicon.ico

3.ใำ้ห้ใส่ Code ดังภาพ (ในกรอบสีแดง) ลงในบริเวณก่อน Tag ปิดของ Head ตามรูป

4. จากนั้นก็อัพโหลด ไฟล์ Icon ตามที่ได้จากข้อ 2 และ ไฟล์ Index ตามข้อ 3 ขึ้นไปยัง Server

 

แค่นี้ก็เสร็จแล้วค่ะ ในการทำ Icon นี้ จะเห็นได้จาก IE Version 7 สำหรับ Firefox นั้่น Webmaster ไม่แน่ใจว่าได้ตั้งแต่ Version ไหน แต่ที่เว็บมาสเตอร์ใช้ Version 2.0.0.x ก็ใช้ได้เหมือนกัน

 
   
 

ตอนแรกที่ลองทำ Icon ของเว็บ Thainextstep.com เมื่อวานนี้ ที่เครื่องทั้ง IE และ Firefox หลังจากทำไปแล้ว มันก็ไม่แสดงไอคอนเหมือนกัน เมื่อช่วงเช้าวันนี้เลยลองไปเข้าดูที่เครื่องที่บริษัท ปรากฏว่าเห็น Icon กลับมาดูที่เครื่องที่บ้านอีกครั้ง Firefox ก็แสดงได้เหมือนกัน

 
   
 

คาดว่ามันคงยังไม่ Active ใครที่เห็นมันไม่ขึ้นตอนแรก ก็ใจเย็น ๆ นิดนึงนะค่ะ ...ลองมาดูมันอีกที ปล่อยมันไปสักหนึ่งวันก็ได้ เพราะเว็บมาสเตอร์ทำมาแล้ว ตอนนี้เ็ว็บไทยเน็คสเต็ปเลยมีไอคอนของเว็บเองบ้างแล้ว งานนี้ต้องขอบคุณ คุณแว่น ที่เอาเรื่องนี้มาคุยกัน เลยทำให้ได้ความรู้ไปอีกนึ่งอย่าง

 
   
   
วันที่บทความ : 09 เม.ย. 2552              ที่มา : Webmaster

สอนทำเว็บไซต์   |   สอนภาษา HTML   |   สอน Dreamweaver   |   สอน Photoshop   |   สอนภาษา PHP & MySql   |   รวมทิป เทคนิคการทำเว็บไซต์   |   สอนการทำ SEO
:: Copyright © 2005 by Chatta design. All rights reserved. Do not duplicate or redistribute in any form.::