วันพุธ, กรกฎาคม 09, 2568

วิธีการสร้าง Favicon ในปี 2025: สามไฟล์ครบจบในตัว

 ใครที่กำลังต้องการทำไฟล์ favicon.ico อยู่ ผมมีคำแนะนำนสั้น ๆ เพียง 4 ขั้นตอน ในการสร้างไฟล์และตั้งค่าเว็บไซต์ให้แสดงไอคอนที่เว็บไซต์ โดยผมได้อ่านและสรุปข้อมูลจากเว็บต้นฉบับมาให้ด้วยแล้ว กับขั้นตอนที่ผมได้ทำเองจริงเป็นเนื้อหาเพิ่มเติมให้ด้วย 

วิธีการสร้าง Favicon สำหรับเว็บไซต์มี ดังนี้

  1. สร้างไอคอนของเราที่ต้องการในขนาด 64x64 บันทึกเป็นไฟล์ .png สามารถใช้โปรแกรมแก้ไขภาพ เช่น Photoshop , GIMP , Canva เป็นต้น
  2. แปลงภาพของเราเป็น .ico โดยผมใช้เครื่องมือออนไลน์ เช่น iconifier.net โดยแค่อัพโหลดภาพ แล้วรอแปลงข้อมูลแล้วดาวน์โหลดไฟล์มาใช้งาน
  3. อัปโหลดไอคอนของเราไปยังเว็บไซต์ เก็บในโฟนเดอร์ที่ต้องการ เช่น images
  4. เพิ่มโค้ดเพื่อให้เว็บไซต์แสดงผลไอคอนของเรา ในส่วนของ <head>
   <link rel="icon" href="images/favicon.ico" type="image/x-icon">
   <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">


📝 สรุปเนื้อหาโดยย่อ

แทนที่จะสร้าง favicon หลายสิบไฟล์สำหรับอุปกรณ์และเบราว์เซอร์ต่าง ๆ ผู้เขียนเสนอให้ใช้เพียง 3 ไฟล์ภาพหลัก และ 1 ไฟล์ JSON สำหรับ PWA:

✅ ไฟล์ที่จำเป็น

  1. – สำหรับเบราว์เซอร์รุ่นเก่า (ขนาด 32×32)

  2. – สำหรับเบราว์เซอร์สมัยใหม่ รองรับธีมมืด/สว่าง

  3. – สำหรับ iOS (ขนาด 180×180)

  4. – สำหรับ PWA บน Android รวมไอคอน:

    • (512×512, มี padding)

💡 แนวทางการสร้าง

  • ใช้ SVG เป็นหลักเพื่อลดขนาดไฟล์และรองรับการปรับขนาด

  • ใช้ media query ใน SVG เพื่อรองรับธีมมืด

  • ใช้เครื่องมืออย่าง GIMP, Inkscape, ImageMagick และ Squoosh เพื่อแปลงและบีบอัดไฟล์

  • เพิ่ม <link> ที่เหมาะสมใน <head> ของ HTML

  • ใช้ Webpack หรือ bundler เพื่อจัดการ cache busting และแยก favicon สำหรับ staging

🎯 ข้อดีของแนวทางนี้

  • ลดจำนวนไฟล์ favicon จาก 20+ เหลือเพียง 4–6 ไฟล์

  • รองรับเบราว์เซอร์และอุปกรณ์หลักทั้งหมด

  • ปรับปรุงประสิทธิภาพและลดภาระการจัดการไฟล์

  • รองรับ Progressive Web App (PWA) อย่างเต็มรูปแบบ


on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , ,

วันอาทิตย์, มิถุนายน 22, 2568

KAIJYU No.8 side B เล่ม 1

 ภาคหลักยังไม่ทันจบก็มีภาคย่อยออกมาให้ได้อ่านแล้ว แน่นอนว่าตัวเด่นมันเยอะจนเล่าในภาคหลักจะยืดไปเลยแยกย่อยออกมาซะ ก็แอบหวังว่าในเมะจะหยิบไปใส่รวมให้ด้วยนะ แล้วตัวละครอย่าง โฮชินะ รองหัวหน้าสุดเท่ห์ของเราอย่าได้พลาดเก็บไว้เลยเล่มนี้ น่าจะสองเล่มจบนะเดาเอา

นิยายที่บอกเล่าเรื่องราวของเหล่าสมาชิกกองกำลังป้องกันซึ่งไม่ได้ถูกกล่าวถึงใน “KAIJYU No.8” ภาคหลักถูกทำเป็นหนังสือการ์ตูนแล้ว! ในขณะที่ปืนได้กลายมาเป็นอาวุธหลักในการโจมตี โฮชินะ โซชิโร่ที่เติบโตมาพร้อมกับดาบนั้นไม่อาจปล่อยมือละทิ้งดาบได้ อีกทั้งยังไม่สามารถถอนตัวออกจากกองกำลังป้องกันได้เช่นเดียวกัน และในระหว่างนั้นเอง เขาก็ได้พบกับหัวหน้ากองกำลังป้องกันหน่วย 3 อาชิโระ มินะー!?

Thumbnail Seller Link
KAIJYU No.8 side B เล่ม 1
MATSUMOTO NAOYA/KEIJI ANDO/KENTARO HIDANO
www.mebmarket.com
นิยายที่บอกเล่าเรื่องราวของเหล่าสมาชิกกองกำลังป้องกันซึ่งไม่ได้ถูกกล่าวถึงใน “KAIJYU No.8” ภาคหลักถูกทำเป็นหนังสือการ์ตูนแล้ว! ในขณะที่ปื...
Get it now
on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , , ,

KAIJYU No.8 เล่ม 15

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

คาฟก้า ไปปราบไคจูหมายเลข 9 เคียงข้างอาชิโระ มินะ เพื่อทําคําสัญญาในวัยเด็กให้เป็นจริง หลังการต่อสู้อันดุเดือด พลังที่หลุดจากการควบคุมของหมายเลข 8 ก็ทําลายเกราะป้องกันของหมายเลข 9 และทะลวงแกนกลางได้ในที่สุด แต่แล้วต้นกําเนิดแห่งพลังของหมายเลข 9 ที่ปรากฏขึ้นจากภายในตัวมัน....!? เล่ม 15 ที่ส่งต่อเจตจํานงสู่รุ่นถัดไป อยู่ที่นี่แล้ว!!

Thumbnail Seller Link
KAIJYU No.8 เล่ม 15
MATSUMOTO NAOYA
www.mebmarket.com
คาฟก้า ไปปราบไคจูหมายเลข 9 เคียงข้างอาชิโระ มินะ เพื่อทําคําสัญญาในวัยเด็กให้เป็นจริง หลังการต่อสู้อันดุเดือด พลังที่หลุดจากการควบคุมของหมายเลข 8 ก็ทํ...
Get it now
on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , , ,

DANDADAN เล่ม 18

 เล่มนี้เดือดจัดสู้กันมันส์มาก งานภาพรายละเอียดดีมากเลย ย้อนอดีตมีน้ำตาซึม เตรียมเช็ดน้ำตาได้เลย

ตัวจริงของเกมที่โมโมะกับซึมะเคลียร์ได้
คือ "หีบต้องสาป" ซึ่งกักขังภูตผีชั่วร้ายเอาไว้!
ด้วยความสามารถของปิศาจในนิทานคารุตะที่ได้รับการปลดปล่อย
ซึมะจึงถูกสิงสู่จนกลายเป็นวิกฤตครั้งใหญ่
อัมเบรลบอย----พลังของซึมะถูกดึงออกมา
จนถึงขีดจำกัดสูงสุด แล้วเข้าจู่โจมใส่พวกโอคารุน!
ในการต่อสู้อันดุเดือดนั้น โมโมะได้รับบาดเจ็บหนักจนเกือบตาย...
ตอนที่คิดว่ากำลังจะเป็นเช่นนั้น โรคุโร่ก็พุ่งพรวดเข้ามา!!
และกระทั่งตำรวจก็เข้าร่วมศึก...ภายใต้สถานการณ์ต่อสู้ชุลมุน
โอคารุนก็ได้รับบอลทองคำคืนมา เขาจะโค่นอัมเบรลบอยได้หรือไม่!?

Thumbnail Seller Link
DANDADAN เล่ม 18
Yukinobu Tatsu
www.mebmarket.com
ตัวจริงของเกมที่โมโมะกับซึมะเคลียร์ได้ คือ "หีบต้องสาป" ซึ่งกักขังภูตผีชั่วร้ายเอาไว้! ด้วยความสามารถของปิศาจในนิทานคารุตะที่ได้รับการปลด...
Get it now
on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , , ,

Ghostly Brews ยินดีบริการดวงวิญญาณหลังเที่ยงคืน

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


Ghostly Brews คือหนังสือฮีลใจ รูปแบบ Comic ที่ใช้ภาพการ์ตูนลายเส้นขาวดำอันเป็นเอกลักษณ์ของ "หมึกซึม" ถ่ายทอดความรู้สึกของวิญญาณที่ยังไม่เคยถูกพูดออกมาตอนมีชีวิตอยู่ ผ่านตัวละครที่แทนความรู้สึกต่าง ๆ เช่น "ความรัก ความโดดเดี่ยว ความพยายาม" ที่มาปรากฏตัวในร้านกาแฟหลังเที่ยงคืน เพื่อเล่าเรื่องสุดท้ายก่อนจะจากไป บางเรื่องเป็นความฝันที่ไม่เคยเริ่ม บางเรื่องคือความสัมพันธ์ที่ไม่เคยได้อธิบาย และบางเรื่องคือการยอมรับบางอย่างที่สายเกินไปแล้ว
แม้จะมีจะมีการเล่าเรื่องที่ดูเป็นการ์ตูนแฟนตาซี แต่สิ่งที่หนังสือเล่มนี้ต้องการพูดถึงไม่ใช่ความตาย แต่คือความรู้สึกที่หล่นหายระหว่างทาง เรื่องราวของวิญญาณแต่ละตนจะค่อย ๆ เตือนให้ผู้อ่านหันกลับมาเห็นคุณค่าของตัวเอง และของคนรอบข้างในวันที่ยังมีโอกาสได้พูด ได้รัก ได้เข้าใจ และได้อยู่ตรงนี้ด้วยกันจริง ๆ

Thumbnail Seller Link
Ghostly Brews ยินดีบริการดวงวิญญาณหลังเที่ยงคืน
OpenDurian/opendurian
www.mebmarket.com
Ghostly Brews คือหนังสือฮีลใจ รูปแบบ Comic ที่ใช้ภาพการ์ตูนลายเส้นขาวดำอันเป็นเอกลักษณ์ของ "หมึกซึม" ถ่ายทอดความรู้สึกของวิญญาณที่ยังไม่เคยถ...
Get it now
on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , , ,

วันพฤหัสบดี, พฤษภาคม 15, 2568

แนะนำ Template Matrix Admin สำหรับตั้งต้นเว็บไซต์ในเบื้อต้น

 Matrix Admin เป็น Template เบื้องต้นสำหรับเว็บไซต์ในส่วนของผู้ดูแลระบบ หรือระบบหลังบ้านนั้นเอง ที่ได้รวบรวมเครื่องมือฟรีต่าง ๆ ที่ครบถ้วนมาให้เราได้ใช้งาน ประหยัดเวลาในการตั้งต้นทำระบบงาน 

โดยส่วนที่ชอบเลยคือใช้งาน Bootstrap ที่ทำให้การจัดรูปแบบเว็บไซต์เป็นไปโดยง่ายและรวดเร็วสวยงาม พร้อมกับเครื่องมือจัดการ ตารางข้อมูล การเลือกใช้วันที่

วิธีใช้งานให้ไปโหลดไฟล์ได้ที่เว็บไซต์

 Matrix Admin Template - Most Advanced Dashboard Kit of All Time

กดโหลดแบบ zip ไฟล์มาแตกแล้วสามารถนำไปปรับใช้งานได้ทันที



on ไม่มีความคิดเห็น:
ป้ายกำกับ: ,

วันอังคาร, พฤษภาคม 13, 2568

ติดตั้ง php Mysql Apache ด้วย XAMPP โปรแกรมจำลอง Web Server

 Xampp เป็นโปรแกรมมัดรวมเพื่อจำลองเว็บเซิฟเวอร์บนเครื่องคอมพิวเตอร์ที่นิยมใช้งานในการติดตั้ง PHP,Mysql และ Apache ซึ่งมีเครื่องมือที่สะดวกในการใช้พัฒนาเว็บไซต์ โดยบทความนี้จะสอนการใช้งานและติดตั้งโปรแกรม XAMPP , php , Mysql และ Apache เพื่อจำลองเซิฟเวอร์บนเครื่องคอมพิวเตอร์ โดยจะใช้เวอร์ชั่นปัจจุบัน คือ XAMPP for Windows 8.0.30

ขั้นตอนการติดตั้ง php Mysql Apache ด้วย XAMPP

1. ดาวน์โหลดโปรแกรม XAMPP for Windows เวอร์ชั่นล่าสุดที่ต้องการ

2. กดเปิดไฟล์ติดตั้ง xampp-windows-x64-8.0.30-0-VS16-installer.exe ให้ทำงาน กดปุ่ม Next

3. เลือกรายการที่ต้องการติดตั้ง MySQL , phpMyAdmin กด Next

4. เลือกโฟเดอร์ที่ต้องการติดตั้ง กด Next

5. เลือกภาษา English กด Next

6. กด Next

7. รอให้ติดตั้งครบ 100%

8. กดอนุญาติสิทธิไฟวอร์
9. เสร็จสิ้นขั้นตอนการติดตั้ง กด Finish

ขั้นตอนการใช้งานเบื้องต้น php Mysql Apache ด้วย XAMPP

1. เปิดโปรแกรม XAMPP Control Panel v3.3.0
2. กดปุ่ม Start Apache และ MySQL
3. เข้าไปที่ http://localhost/phpmyadmin/ เพื่อใช้งานฐานข้อมูล MySQL
4. เข้าไปที่ http://localhost/ เพื่อใช้งานเว็บ PHP โดยเราจะจัดเก็บข้อมูลไว้ที่โฟนเดอร์  C:\xampp\htdocs

เท่านี้เครื่องของเราก็พร้อมแล้วสำหรับเป็นเว็บเพื่อพัฒนาระบบของเราไว้ใช้งานภายในองค์กรหรือส่วนตัวได้ตามแต่เราต้องการเลย ไว้บทความหน้าจะมาสอนเรื่องการเขียนภาษา PHP ต่อไปครับ









on ไม่มีความคิดเห็น:
ป้ายกำกับ: , , , ,
สมัครสมาชิก: บทความ (Atom)