เมื่อเร็วๆ นี้ Chrome ครองส่วนแบ่งตลาดอินเทอร์เน็ตเบราว์เซอร์ 25% ทำให้เป็นเบราว์เซอร์ที่มีการใช้งานมากเป็นอันดับสองของโลกรองจาก Internet Explorer (ซึ่งกำลังพัฒนาเป็น Project Spartan) ท้ายที่สุด นี่หมายความว่า Chrome เป็นพฤตินัย บ้านสำหรับนักพัฒนาเว็บ
แม้ว่าฉันจะเป็นส่วนหนึ่งของ Firefox แต่ฉันก็เข้าใจว่าทำไมผู้คนถึงชอบ Chrome มีแนวโน้มที่จะครองมาตรฐานของเบราว์เซอร์และทำให้คนทั่วไปกลายเป็นผู้ใช้ระดับสูงของ Chrome ได้ง่าย จริงๆ แล้วคนอื่นๆ เกลียด Chrome แต่ยังคงใช้งานอยู่เนื่องจากมีส่วนขยายบางตัว
นั่นเป็นเหตุผลหนึ่งที่ Chrome ดีสำหรับนักพัฒนาเว็บ:Chrome เว็บสโตร์และกลุ่มส่วนขยาย หากคุณเคยวางแผนที่จะออกแบบหรือเขียนโค้ดเว็บไซต์ ต่อไปนี้คือเครื่องมือสำคัญบางประการที่คุณควรติดตั้งทันที
ColorZilla
ColorZilla เริ่มต้นเป็นส่วนเสริมของ Firefox แต่ได้รับความนิยมอย่างมากจนหลายคนร้องขอเวอร์ชัน Chrome ตอนนี้เราอยู่ที่นี่ ส่วนขยายที่มีประโยชน์นี้โดยพื้นฐานแล้วเป็นเครื่องมือหยอดตารุ่นขั้นสูงที่คุณจะพบในโปรแกรม เช่น Paint หรือ Photoshop
ด้วยวิธีนี้ คุณสามารถชี้ไปที่จุดใดก็ได้ในเบราว์เซอร์ของคุณและดึงข้อมูลสีที่จุดนั้นทันที เมื่อดึงแล้ว คุณจะปรับแต่งได้ (ไม่ว่าจะเป็น RGB, HSV หรือเลขฐานสิบหกแบบตรง) ก่อนที่จะคัดลอกไปยังคลิปบอร์ดของคุณ ใช้งานง่ายมาก
นอกจากนี้ยังมาพร้อมกับ CSS Gradient Generator, Webpage Color Analyzer และจานสีที่ติดตั้งไว้ล่วงหน้าบางส่วนเพื่อความสะดวกของคุณ
ตัวปรับขนาดหน้าต่าง
อันตรายอย่างหนึ่งของนักพัฒนาเว็บคือการทำให้แน่ใจว่าประสบการณ์การรับชมเว็บไซต์จะสนุกสนานสำหรับผู้ใช้บนอุปกรณ์ทุกประเภท เราไม่ได้แค่พูดถึงมือถือกับเดสก์ท็อป -- ซึ่ง คือ สำคัญ -- แต่ยังมีความแตกต่างระหว่างแท็บเล็ตขนาดเล็กและจอภาพขนาดใหญ่ด้วย
ตัวปรับขนาดหน้าต่าง เป็นวิธีที่ง่ายในการปรับขนาดหน้าต่างเบราว์เซอร์ได้ทันที เมื่อคลิกปุ่ม คุณจะสามารถทดสอบเว็บไซต์ของคุณในความละเอียดต่างๆ เพื่อดูว่าผู้ใช้ของคุณเห็นอะไร แล้วคุณก็สามารถปรับเปลี่ยนได้ตามนั้น
แท็บ IE
ภัยร้ายแรงอีกอย่างหนึ่งของนักพัฒนาเว็บคือมาตรฐานเบราว์เซอร์ (หรือสิ่งที่ขาดไป) Internet Explorer, Firefox, Chrome, Opera และเบราว์เซอร์รองอื่น ๆ ทั้งหมดจะแสดงเว็บไซต์ในรูปแบบที่แตกต่างกันเล็กน้อย ในขณะเดียวกัน เบราว์เซอร์บางตัวก็ใช้มาตรฐานได้ช้ากว่าตัวอื่นๆ
หรือในกรณีของ Internet Explorer มาตรฐานต่างๆ จะถูกโยนทิ้งออกไปนอกหน้าต่าง และนักพัฒนาเว็บจะต้องพยายามดึงเอาสิ่งเหล่านั้นออกเนื่องจากถูกบังคับให้ต้องจัดหาที่พัก
ด้วย แท็บ IE กระบวนการนี้ทำให้ง่ายขึ้นเล็กน้อย ช่วยให้คุณดูเว็บไซต์ในแท็บ Chrome ใหม่ได้ แต่แสดงผลตามที่ปรากฏใน IE ไม่ใช่วิธีแก้ปัญหาแบบปฏิวัติวงการสำหรับปัญหาของ IE แต่อย่างน้อยก็เป็นบางอย่าง
ความถูกต้อง
โค้ด HTML ทั้งหมดไม่เท่ากัน แม้ว่าเบราว์เซอร์จะมีบทบาทสำคัญในการปฏิบัติตามมาตรฐาน แต่ภาระหน้าที่ส่วนหนึ่งก็อยู่ที่นักพัฒนาเว็บต้องปฏิบัติตามแนวทางปฏิบัติ HTML ที่ดี นั่นเป็นเหตุผลที่มีเครื่องมือสำหรับการทดสอบและตรวจสอบ HTML
ความถูกต้อง เป็นส่วนขยายที่ให้คุณทำทั้งหมดนั้นได้โดยไม่ต้องไปที่ไซต์ของบุคคลที่สาม เพียงเปิดเว็บไซต์ของคุณ คลิกปุ่ม และจะแสดงข้อความ HTML ที่ไม่ถูกต้องทั้งหมดในคอนโซลของเบราว์เซอร์ การตรวจสอบความถูกต้องทำได้ผ่านบริการตรวจสอบความถูกต้องของ W3C
สร้างขึ้นด้วย
สิ่งหนึ่งที่ฉันเกลียดเกี่ยวกับการพัฒนาเว็บคือมี มากมาย ไลบรารี เฟรมเวิร์ก และเอ็นจิ้นที่พร้อมใช้งาน เสรีภาพในการเลือกเป็นเรื่องที่ดี แต่การที่เทคโนโลยีจำนวนมากขึ้นมากจนทำให้ไม่สามารถตามทันได้ทั้งหมดก็เป็นเรื่องที่เจ็บปวดมาก
คุณเคยเยี่ยมชมเว็บไซต์และสงสัยว่าเทคโนโลยีพื้นฐานคืออะไร?
สร้างขึ้นด้วย ส่วนขยายเป็นปุ่มเดียวที่วิเคราะห์หน้าเว็บปัจจุบันเพื่อดู ทั้งหมด ของไลบรารีเว็บ เฟรมเวิร์ก และเอ็นจิ้นที่ขับเคลื่อนมัน รวมถึงเครือข่ายโฆษณา แพลตฟอร์มการกระจายเนื้อหา และแม้แต่ซอฟต์แวร์โฮสติ้งที่อยู่เบื้องหลังทั้งหมด
Postman REST Client [ไม่มีอีกต่อไป]
สำหรับผู้ที่ทำงานกับ REST API บุรุษไปรษณีย์ เป็นเครื่องมือเดียวที่คุณต้องการสำหรับเวิร์กโฟลว์ที่คล่องตัว ด้วยสิ่งนี้ คุณสามารถสร้างคำขอ HTTP และรับการตอบสนองที่จัดรูปแบบใน JSON และ XML คำตอบจะเปิดในหน้าต่างแยกต่างหากในรูปแบบ HTML
คุณยังสามารถจัดกลุ่มคำขอหลายรายการเป็นสิ่งที่เรียกว่าคอลเลกชั่น ซึ่งเป็นวิธีที่ดีในการจัดระเบียบและมีประสิทธิภาพ คุณยังทดสอบกับหลายสภาพแวดล้อมได้ด้วยการเปลี่ยนตัวแปรสภาพแวดล้อมภายในส่วนขยาย
Ipsum ของบริษัท
วิธีหนึ่งในการสร้างข้อความเติมคือการคัดลอกและวาง "asdf" ซ้ำแล้วซ้ำอีกร้อยครั้ง วิธีที่ดีกว่าคือการติดตั้ง Corporate Ipsum และปล่อยให้มันสร้างข้อความเติมสำหรับคุณในพริบตา
เราได้กล่าวถึงเครื่องกำเนิด Lorem Ipsum หลายเครื่องแล้ว แต่สิ่งที่ดึงดูดใจของ Corporate Ipsum ก็คือมันอยู่ในเบราว์เซอร์ของคุณ คุณสามารถดึงมันขึ้นมาได้ด้วยการคลิกเพียงปุ่มเดียว ไม่มีเหตุผลที่จะไม่ใช้ถ้าคุณถามฉัน ตอนนี้คุณสามารถกลับไปเขียนโค้ดเว็บไซต์ของคุณได้แล้ว!
TabCloud
การพัฒนาเว็บบางครั้งเกิดขึ้นในหลาย ๆ เครื่อง ในขณะที่การควบคุมแหล่งที่มาสำหรับนักพัฒนาเป็นวิธีหลักในการซิงโครไนซ์และอัปเดตอยู่เสมอ ถ้าคุณต้องการถ่ายโอนหลายแท็บในคอมพิวเตอร์ นั่นคือที่ที่ TabCloud เข้ามาค่ะ
TabCloud ซิงค์แท็บของคุณกับคลาวด์ ทำให้คุณสามารถเปิดแท็บเหล่านั้นอีกครั้งที่อื่นได้ นอกจากนี้ยังสามารถใช้เป็นโปรแกรมรักษาเซสชันในเครื่อง ช่วยให้คุณจัดเก็บชุดแท็บสำหรับการเยี่ยมชมในภายหลัง แท็บจะถูกบันทึกไว้ในบัญชี Google ของคุณ
WhatFont
การออกแบบฟอนต์เป็นองค์ประกอบสำคัญของการพัฒนาเว็บ ซึ่งเป็นสาเหตุที่บริการต่างๆ เช่น Google Web Fonts ได้รับความนิยมอย่างมาก ข่าวดีก็คือตอนนี้แบบอักษรฟรีเหล่านี้เป็นแบบอักษรเว็บที่สวยงามที่สุดบางส่วนที่มีอยู่ในขณะนี้
แต่ยอมรับเถอะว่า มีบางครั้งที่คุณกำลังท่องเว็บและเจอแบบอักษรที่น่าทึ่งที่คุณไม่เคยเห็นมาก่อน มีหลายวิธีในการระบุ แต่วิธีที่เร็วที่สุดคือการใช้ WhatFont . คุณสามารถตรวจสอบแบบอักษรได้ง่ายๆ โดย วางเมาส์เหนือแบบอักษร . อะไรจะง่ายไปกว่านี้อีก
ภาพหน้าจอยอดเยี่ยม [ไม่มีให้ใช้งานอีกต่อไป]
หากภาพหน้าจอไม่ได้เป็นส่วนหนึ่งของกิจวัตรการพัฒนาเว็บตามปกติของคุณ ภาพหน้าจอที่ยอดเยี่ยม จะช่วยเปลี่ยนแปลงสิ่งนั้น การจับภาพหน้าจอนั้นยอดเยี่ยมสำหรับการบันทึกการเปลี่ยนแปลงในการออกแบบและการแชร์งานระหว่างทำกับลูกค้าหรือสมาชิกในทีมของคุณ
ส่วนขยายนี้มีฟังก์ชันการจับภาพหลายแบบ รวมทั้งหน้าเต็ม พื้นที่ที่เลือก หรือพื้นที่ที่มองเห็นได้ นอกจากนี้ยังช่วยให้คุณสามารถเพิ่มคำอธิบายประกอบ เบลอส่วนที่ละเอียดอ่อนของรูปภาพ และแบ่งปันได้ด้วยคลิกเดียว หรืออัปโหลดไปยัง Google Drive ของคุณแทน
หากแนวคิดนี้ทำให้คุณสนใจแต่คุณต้องการใช้โปรแกรมเดสก์ท็อปที่ทรงพลังกว่า ให้ตรวจสอบการเปรียบเทียบเครื่องมือภาพหน้าจอและเริ่มใช้โปรแกรมที่เหมาะกับคุณที่สุด
ตรวจสอบลิงก์ของฉัน
ข้อผิดพลาดในการพัฒนาเว็บจำนวนมากจะทำให้ผู้เยี่ยมชมของคุณผิดหวัง และลิงก์เสียเป็นหนึ่งในผู้กระทำผิดที่เลวร้ายที่สุด ลิงก์เสียหนึ่งลิงก์อาจใช้ได้ แต่ยิ่งไปกว่านั้น เว็บไซต์ของคุณก็เริ่มสูญเสียความน่าเชื่อถือและชื่อเสียง โชคดีที่นี่เป็นข้อผิดพลาดที่หลีกเลี่ยงได้ง่าย
ตรวจสอบลิงก์ของฉัน ทำตามที่สัญญาไว้:ตรวจสอบลิงก์ของคุณ ลิงก์ที่ถูกต้องจะถูกทำเครื่องหมายเป็นสีเขียว ในขณะที่ลิงก์ที่เสียหายจะถูกทำเครื่องหมายเป็นสีแดง และในตอนท้ายจะให้คะแนนเป็นเปอร์เซ็นต์ สิ่งที่คุณต้องทำหลังจากนั้นคือไปซ่อมแซมลิงก์เหล่านั้น!
คุณใช้ส่วนขยายใด
ส่วนขยายเพิ่มเติมสำหรับประสิทธิภาพการทำงานที่ฉันแนะนำคือ StayFocusd เป็นส่วนขยายสำหรับวัตถุประสงค์ทั่วไปมากกว่าส่วนขยายการพัฒนาเว็บ แต่ก็มีประโยชน์อย่างแน่นอนโดยไม่คำนึงถึง ช่วยให้คุณไม่ถูกรบกวนจากเว็บขณะทำงาน!
คุณคิดอย่างไรกับสิ่งเหล่านี้? มีส่วนขยายการพัฒนาเว็บไซต์ที่สำคัญอื่นๆ ที่คุณแนะนำหรือไม่ แบ่งปันกับเราในความคิดเห็นด้านล่าง!
