ทรัพยากรใหม่สำหรับนักออกแบบและพัฒนาเว็บ (กุมภาพันธ์ 2558)
หลังจากทำสิ่งนี้มานานกว่าหนึ่งปีส่วนที่ยากที่สุดเกี่ยวกับการเขียนกองทรัพยากรรายเดือนสำหรับนักออกแบบและนักพัฒนาคือการแนะนำ ในขณะที่เราอยู่ในหัวข้อนี่คือสรุปยอดทรัพยากรที่ดีที่สุดและสดใหม่สำหรับนักพัฒนาเว็บเช่นคุณ.
ในภาคนี้เรากำลังมองหาที่พิเศษ เครื่องมือค้นหาเพื่อค้นหาตัวอย่างโค้ด, มีไหวพริบมาก อ้างอิงถึงปัญหาที่อยู่ในโมดูล Flexbox, และเครื่องมือในการพัฒนาเพื่อการจัดการที่ดีขึ้น สีแบบอักษรและการไล่ระดับสี.
Animator ไล่โทนสี
การไล่ระดับสี CSS3 ช่วยให้เราสามารถสร้างการไล่ระดับสีที่จินตนาการบนเว็บไซต์ของเราโดยไม่จำเป็นต้องโหลดภาพใด ๆ เราสามารถรวมเข้ากับ CSS3 Animation เพื่อให้เอฟเฟกต์น่าสนใจยิ่งขึ้น แต่ถ้ารหัสนั้นมากเกินไปสำหรับคุณให้ใช้เส้นทาง Gradient Animator ที่ง่ายกว่าเพื่อสร้างหนึ่งด้วยอินเทอร์เฟซที่ดี.

คู่มือท่องเที่ยว SVG
คู่มือท่องเที่ยว SVG รวบรวมโดย Joni Trythall มันคือการอ้างอิงที่มีประโยชน์ที่จะแนะนำคุณเกี่ยวกับพื้นฐานของ SVG (เช่นการสร้างรูปร่างและข้อความ) ไปจนถึงคุณลักษณะขั้นสูงเพิ่มเติม (เช่นการสร้างการไล่ระดับสีการตัดทอนเส้นทางและรูปแบบ) หนังสือเล่มนี้มาในรูปแบบ Markdown และให้บริการเป็นภาษาอังกฤษและโปรตุเกส.

Flexbugs
Flexbox เป็นโมดูลใหม่ที่มีแนวโน้มมากใน CSS3 ที่จะเปลี่ยนแปลงโดยสิ้นเชิงในแบบที่เราสร้างโครงร่างเว็บ อย่างไรก็ตามมันยังมาพร้อมกับปัญหาความเข้ากันได้ข้ามเบราว์เซอร์ของมันเอง พื้นที่เก็บข้อมูลนี้, Flexbugs, คือชุดของข้อบกพร่องเหล่านี้และวิธีแก้ไขปัญหาเพื่อแก้ไขปัญหา นี่เป็นทรัพยากรที่มีประโยชน์มากสำหรับทุกคนที่อาศัยอยู่บนเว็บ.

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

เด็ก
เด็ก เป็นบรรณาธิการ Markdown ที่น่าพอใจ ที่นี่คุณสามารถเขียนในรูปแบบ Markdown และดูผลลัพธ์ในแท็บขวามือได้ทันที เพื่อความสะดวกของคุณ Dillinger ช่วยให้คุณสามารถส่งออกงานของคุณเป็น HTML, PDF หรือเพียงแค่ในรูปแบบไฟล์ Markdown เมื่อคุณทำเสร็จแล้ว หรือคุณสามารถเชื่อมต่อกับบริการของบุคคลที่สามเช่น Dropbox และ Github ที่คุณสามารถบันทึกไฟล์ของคุณ.

HTML5Up
HTML5Up เป็นชุดของแม่แบบที่ใช้ HTML5 ฟรี คุณสามารถค้นหาเลย์เอาต์ที่รองรับเว็บไซต์ประเภทต่างๆ: ธุรกิจ, ผลงานหรือเพียงแค่บล็อกง่ายๆ เทมเพลตทั้งหมดตอบสนองได้เป็นอย่างดีทำให้มั่นใจได้ว่าเนื้อหาและการจัดวางเว็บไซต์มีความสนุกสนานในขนาดหน้าจอที่แตกต่างกัน.

สี CSS
เคยสงสัยว่ามีชื่อสีอะไร? สี CSS แสดงชื่อสีเช่นเดียวกับรูปแบบ Hex และ RGBA สำหรับชุดสีพื้นฐาน เป็นแหล่งที่ดีในการค้นหาการผสมสีที่สมบูรณ์แบบสำหรับเว็บไซต์ของคุณ.

Emmet Re-view
การดูซ้ำเป็นส่วนขยายของ Chrome ที่แยกวิเคราะห์เว็บไซต์ของคุณ @ สื่อ
แบบสอบถามและแสดงเว็บไซต์ของคุณในแต่ละจุดพักที่ระบุในแต่ละ @ สื่อ
สอบถาม หากคุณกำลังมองหาเครื่องมือที่สามารถช่วยคุณประหยัดเวลาได้เล็กน้อยเมื่อทำการทดสอบเว็บไซต์ตอบสนองนี่คือเครื่องมือที่คุณต้องการ.

TypeGenius
หากคุณดูที่ห้องสมุด Google Font คุณจะพบแบบอักษรจำนวนมากในรูปแบบใบหน้าครอบครัวน้ำหนักและประเภทที่แตกต่างกัน ดังนั้นการเลือกคู่ที่เหมาะสมหรือการรวมตัวอักษรอาจเป็นงานที่หนักหน่วงอย่างแท้จริง. TypeGenius ทำให้การเลือกคู่แบบอักษรง่ายและรวดเร็วและเป็นไปได้สำหรับประชากรทั่วไป.

SearchCode
ตามชื่อที่กล่าวมานี้เป็นเครื่องมือค้นหาเพื่อค้นหารหัสหรือตัวอย่างโค้ดของภาษาการเขียนโปรแกรมจำนวนมากรวมถึง JavaScript, C, PHP เครื่องมือค้นหานี้จะได้รับผลลัพธ์จากแหล่งที่มาหลายแห่งเช่น Github, Bitbucket และ Google Code นี่เป็นเครื่องมือที่ต้องมีแน่นอนสำหรับตัวแปลงสัญญาณขนาดใหญ่.
