Number 1 website platform in Thailand

ทำเว็บ

ทำเว็บไซต์

สร้างเว็บ

สร้างเว็บไซต์

เว็บไซต์สำเร็จรูป

เว็บสำเร็จรูป

ออกแบบเว็บ

ออกแบบเว็บไซต์

เขียนเว็บไซต์

สร้างเว็บฟรี

เว็บฟรี

ร้านค้าออนไลน์

ทำเว็บ

ทำเว็บไซต์

สร้างเว็บ

สร้างเว็บไซต์

เว็บไซต์สำเร็จรูป

เว็บสำเร็จรูป

ออกแบบเว็บ

ออกแบบเว็บไซต์

เขียนเว็บไซต์

สร้างเว็บฟรี

เว็บฟรี

ร้านค้าออนไลน์

สถานะหน้าปัจจุบัน

language
www.

[Web Designer Tools] Firefox ปลั๊กอินเด็ดๆ สำหรับ ออกแบบเว็บ

[Web Designer Tools] Firefox ปลั๊กอินเด็ดๆ สำหรับ ออกแบบเว็บ

จำนวนเข้าชม: 6,178 | 12/11/2014

1) WEB DEVELOPER
ปลั๊กอินตัวนี้ไม่มีไม่ได้ครับ จำเป็นมากในหน้าเว็บไซต์ ตัวนี้ทำได้ทุกอย่างตั้งแต่ซ่อนรูป ปรับขนาดจอ ตรวจ HTML ไปจนถึงการแก้ไข CSS แบบ Real-Time (คือแก้ใน Sidebar ข้างๆ เสร็จ จะเห็นผลบนหน้าจอทันที แถม save ได้ด้วย) ถ้าใครไม่มีรีบไปโหลดมาเลยครับ ถ้าใครมีแล้วก็ลองเล่นคำสั่งต่างๆ ของมันดู ปลั๊กอินตัวนี้ซ่อนลูกเล่นไว้เยอะกว่าที่คิดมาก!

2) FIREBUG
ปลั๊กอินตัวนี้ความสามารถคล้าย ๆ ตัวข้างบนเลยครับ คือแสดง HTML/CSS ของหน้านั้น และแก้ได้แบบ Real-Time แต่ผมก็ลงไว้ทั้ง Firebug และ Web Developer นะครับ เพราะว่าตัว Firebug นี่ดีตรงมีใส่สี syntaxทำให้ตอนอ่านโค้ดในเว็บไซต์ไม่ปวดหัว ดูจาว่าสคริปต์ได้ มีตัว  Element Inspector ที่ถ้าเราเอาเม้าส์ไปชี้ตรงส่วนไหนของหน้า มันจะแสดงโค้ด HTML ตรงส่วนนั้นขึ้นมาทันที และแสดง CSS ที่เกี่ยวข้องกับส่วนที่เราชี้อยู่ให้ดูด้วย สะดวกมากๆ ครับ นอกจากนั้นยังมีปลั๊กอินของ Firebug อีกที เช่น FirePHP ที่เอาไว้ช่วยดีบั๊กโค้ด

3) COLORZILLA
เครื่องมือเกี่ยวกับสีนี่เป็นสิ่งจำเป็นสำหรับการออกแบบเว็บไซต์เลยครับ เช่น บางทีลูกค้าส่งหน้าเว็บไซต์ตัวอย่างมาบอกว่าอยากได้โทนสีแบบนี้ แทนที่เราจะเข้า Photoshop ไปไล่หาสีที่ลูกค้าต้องการ เราก็เอาตัวดูดสีใน ColorZillaไปดูดเลย จะได้โค้ดสีทั้งแบบ RGB: 0-255 หรือแบบ RGB: 0-100% หรือแบบ #RRGGBB พร้อมมีคำสั่งก็อปปี้โค้ดสีโดยอัตโนมัติด้วย นอกจากนั้นถ้าเราอยากได้สีอะไรสักสี แต่ขี้เกียจเปิด Photoshop เพื่อใช้แต่หน้าเลือกสี ปลั๊กอินตัวนี้ก็มีหน้าเลือกสีมาให้ด้วย ทีนี้ก็ไม่ต้องเปลี่ยนโปรแกรมไปมาบ่อยๆ แล้ว

4) MEASUREIT
ปลั๊กอินตัวนี้ทำงานตามชื่อเลยครับ เอาไว้วัดความยาวของสิ่งต่างๆ นั่นเอง เพราะบางครั้งเราต้องการวัดขนาดของบางส่วนในหน้าเว็บไซต์ แทนที่จะใช้วิธีจับภาพหน้าจอแล้วเอาไปใส่ Photoshop แล้ววัดอีกที สู้เอาปลั๊กอินตัวนี้วัดจะสะดวกกว่ามากครับ เหมาะกับเว็บดีไซน์เนอร์ตรงที่เอาไว้วัดขนาดพวกกล่อง div บนหน้าเว็บ เอาไว้คอยเช็คว่าความกว้างความยาวมันถูกต้องมั้ย หรือว่ามีพื้นที่ว่างเหลืออีกกี่ pixel เป็นต้นครับ

5) IE TAB
เคยมั้ยครับที่ตอน ออกแบบเว็บไซต์ ต้องเปิดเว็บเราทั้งใน Internet Explorer และ Firefox พร้อมกัน แล้วเปลี่ยนโปรแกรมสลับไปสลับมา ปลั๊กอินตัวนี้ช่วยให้เราเปิดหน้า
เว็บไซด์ด้วย IE แต่แท็บจะโผล่ใน Firefoxของเราครับ ทำให้เราไม่ต้องคอยสลับโปรแกรม แค่เปลี่ยน Tab ก็พอ เสียดายที่ใช้ไม่ได้ใน Mac OS ครับ (เพราะมันไม่มี IE ลงในเครื่อง)

6) DUST-ME SELECTORS
ปลั๊กอินเทพๆ อีกตัวสำหรับ CSS ครับ แต่ตัวนี้เอาไว้ปิดงานทำเว็บไซต์ เพราะมันเอาไว้ตรวจสอบว่ามีส่วนไหนในไฟล์ CSS ของเราที่ไม่ถูกเรียกใช้บ้าง ซึ่งสามารถเช็คเทียบได้กับหน้าเว็บเพียง 1 หน้า หรือจะเทียบกับทั้งเว็บไซต์เลยก็ได้ครับ อย่างไรก็ตาม ปลั๊กอินตัวนี้ค่อนข้างกินแรมครับ เพราะงั้นปกติก็ปิดไว้ก่อนครับ ค่อยเปิดใช้ตอนปิดงาน และได้ยินมาว่าการไต่เว็บ (ถ้าใช้เช็คเทียบ CSS กับทุกหน้าในเว็บ) ยังทำได้ไม่ค่อยดีครับ ควรมีsitemap.xml ให้มันไต่จะสะดวกขึ้นครับ

7) PENCIL
ปลั๊กอินตัวนี้เอาไว้ออกแบบ Prototype ของหน้าออกแบบเว็บไซต์ครับ ซึ่งส่วนใหญ่ในทำงานเว็บไซต์เล็กๆ เราจะไม่ค่อยได้ทำส่วนนี้ สำหรับ Prototype ของเว็บจะเอาไว้ให้ลูกค้าดูก่อนเริ่มทำงานจริงๆ ครับ เผื่อว่าลูกค้าชอบไม่ชอบส่วนไหนยังไงจะได้แก้ไขกันทัน (อาจใช้วิธีวาดร่างในกระดาษเอา หรือทำจาก Powerpoint/Keynote ก็ได้ครับ) ปลั๊กอินตัวนี้จะมีเครื่องมือต่างๆ สำหรับออกแบบมาให้อยู่แล้ว แค่เราลากของที่ต้องการไปใส่ในหน้ากระดาษก็พอ ลองไปโหลดมาใช้กันดูครับ

Number 1 Website Platform in Thailand

จำนวนเว็บไซต์
230,928
จำนวนสินค้า
2,070,129
จำนวนบทความ
42,364,425
จำนวนรูปภาพ
1,891,661
Pageviews
161,831,679
ปรับปรุงเมื่อ
13/04/2021
ออนไลน์
1,997
uptime
นโยบายข้อมูลละเมิดลิขสิทธิ์ในเว็บไซต์ iGetWeb.com

โฆษณาสินค้า