web development resources

ทรัพยากรการพัฒนาเว็บ

รายการเครื่องมือและแหล่งข้อมูลส่วนหน้าโอเพนซอร์สสำหรับนักออกแบบเว็บไซต์และนักพัฒนา

สารบัญ

• วิกิ
• เฟรมเวิร์ก
• เฟรมเวิร์กเว็บมือถือ
• ส่วนประกอบส่วนหน้า
• ธีม HTML5
• HTML preprocessor
• CSS preprocessor
• JavaScript Preprocessor
• เฟรมเวิร์กเขี้ยว
• Node.js Module และ Bundler
• JavaScript Library
• ปลั๊กอินวานิลลาจาวาสคริปต์
• ปลั๊กอิน jQuery
• ชุดเครื่องมือคอมเพรสเซอร์ JavaScript
• ห้องสมุด CSS
• ห้องสมุดไอคอน SVG, PNG และแบบอักษร
• PNG, JPEG, ชุดเครื่องมือคอมเพรสเซอร์ GIF
• รูปแบบ HTML
• เครื่องมือบนเว็บ
• ไลบรารี CDN
• ความเข้ากันได้ของเบราว์เซอร์วิกิ
• เครื่องมือทดสอบการตอบสนอง
• เครื่องมือทดสอบประสิทธิภาพ
• ผู้ถือครองตำแหน่ง
• ผู้ที่เก็บรักษา
• ไอคอนเว็บไซต์สำหรับเบราว์เซอร์
• ตัวอย่างและบทช่วยสอนที่สร้างแรงบันดาลใจฟรี
• การอ้างอิง CSS
• บทเรียน CSS
• อินโฟกราฟิกส์
• แรงบันดาลใจในการออกแบบ
• ระบบประเภท
• เครื่องมือเว็บมาสเตอร์
• ผู้จัดการแพ็คเกจ
• การติดขัด
• รายการรายการรายการ

---

วิกิ

ชื่อ	คำอธิบาย
มาตรฐาน W3C	มาตรฐาน W3C กำหนดแพลตฟอร์มเว็บแบบเปิดสำหรับการพัฒนาแอปพลิเคชันที่มีศักยภาพอย่างไม่เคยปรากฏมาก่อนเพื่อให้นักพัฒนาสามารถสร้างประสบการณ์การโต้ตอบที่หลากหลายซึ่งขับเคลื่อนโดยร้านค้าข้อมูลมากมายที่มีอยู่ในอุปกรณ์ใด ๆ
CSSDB	รายการที่ครอบคลุมของคุณสมบัติ CSS และตำแหน่งของพวกเขาในกระบวนการของการใช้มาตรฐานเว็บที่ใช้งาน
เอกสารเว็บ MDN	ทรัพยากรสำหรับนักพัฒนาโดยนักพัฒนา
นักพัฒนาเว็บของ Google Web	สร้างประสบการณ์เว็บรุ่นต่อไป
W3Schools	บทเรียนเว็บออนไลน์
CSS-tricks	บทความประจำวันเกี่ยวกับ CSS, HTML, JavaScript และทุกสิ่งที่เกี่ยวข้องกับการออกแบบและพัฒนาเว็บ
นิตยสาร Smashing	สำหรับนักออกแบบเว็บไซต์และนักพัฒนา
webGlossary.info	อภิธานศัพท์ที่กว้างขวางของการพัฒนาเว็บและเงื่อนไขการออกแบบ

↥กลับไปด้านบน

เฟรมเวิร์ก

ชื่อ	คำอธิบาย
HTML5 Boilerplate	เทมเพลตส่วนหน้ายอดนิยมของเว็บ
รองเท้าบู๊ต	Bootstrap เป็น HTML, CSS และ JS Framework ที่ได้รับความนิยมมากที่สุดสำหรับการพัฒนาโครงการแรกที่ตอบสนองต่อมือถือบนเว็บ
พื้นฐาน	กรอบการตอบสนองส่วนหน้าแบบตอบสนองที่ทันสมัยที่สุดในโลก
-	-
ฐาน	กรอบ HTML/CSS ที่ตอบสนองได้ดี
basscss	ชุดเครื่องมือ CSS ระดับต่ำ
ป้อม	กรอบ CSS ที่ทันสมัยขึ้นอยู่กับ FlexBox
กรอบรัดกุม	เฟรมเวิร์กส่วนหน้าน้ำหนักเบาที่มีคุณสมบัติที่ยอดเยี่ยมมากมายโดยไม่ต้องขยายตัว
เกี่ยวกับพระ	Cardinal เป็นเฟรมเวิร์ก CSS แบบแยกส่วน "มือถือ" ที่สร้างขึ้นด้วยประสิทธิภาพและความสามารถในการปรับขนาด
CSS แร้ง	CSS Micro-Framework
คั้นน้ำ	เฟรมเวิร์ก FlexBox CSS
การออกแบบวัสดุ lite	การใช้งานส่วนประกอบการออกแบบวัสดุในวานิลลา CSS, JS และ HTML
ทำให้เป็นจริง	กรอบส่วนหน้าแบบตอบสนองที่ทันสมัยขึ้นอยู่กับการออกแบบวัสดุ
โฟตอน	วิธีที่เร็วที่สุดในการสร้างแอพอิเล็กตรอนที่สวยงามโดยใช้ HTML และ CSS อย่างง่าย
ไพรเมอร์ CSS	ทีม GitHub Design Systems สร้างและรักษาไพรเมอร์
บริสุทธิ์	ชุดโมดูล CSS ขนาดเล็กที่ตอบสนองได้ซึ่งคุณสามารถใช้ในทุกโครงการเว็บ
ตอบสนอง	กรอบการทำงานที่เป็นมิตรที่มีประสิทธิภาพเข้าถึงได้และเป็นมิตรสำหรับการสร้างเว็บไซต์ที่ตอบสนองได้
UI ความหมาย	กรอบการพัฒนาที่ช่วยสร้างเลย์เอาต์ที่สวยงามและตอบสนองได้โดยใช้ HTML ที่เป็นมิตรกับมนุษย์
ซอก	กรอบการตอบสนองที่มีน้ำหนักเบาสำหรับ www
โครงกระดูก	แผ่นหม้อต้มที่ตายแล้วง่าย
tailwind css	เฟรมเวิร์ก CSS แบบยูทิลิตี้แรกสำหรับการสร้างการออกแบบที่กำหนดเองอย่างรวดเร็ว
Uikit	เฟรมเวิร์ก Front-end ที่มีน้ำหนักเบาและเป็นโมดูลสำหรับการพัฒนาอินเตอร์เฟสเว็บที่รวดเร็วและทรงพลัง

↥กลับไปด้านบน

เฟรมเวิร์กเว็บมือถือ

ชื่อ	คำอธิบาย
onsen ui	วิธีที่สวยงามและมีประสิทธิภาพที่สุดในการพัฒนา HTML5 ไฮบริดและเว็บแอพมือถือ

↥กลับไปด้านบน

ส่วนประกอบส่วนหน้า

ชื่อ	คำอธิบาย
รูปปั้น	Formstone เป็นคอลเลกชันของส่วนประกอบส่วนหน้า
ส่วนประกอบ Le Wagon UI	-

↥กลับไปด้านบน

ธีม HTML5

ชื่อ	คำอธิบาย
bootstrap starter	ฟรีชุดรูปแบบและเทมเพลต Bootstrap Starter เพื่อเริ่มโครงการของคุณ
ชุดรูปแบบ WordPress ที่ว่างเปล่า HTML5	ชุดรูปแบบ HTML5 WordPress Boilerplate ที่ดีที่สุดบันทึกโดย Adobe, Smashing Mag, .net Mag
html5 ขึ้น!	แม่แบบไซต์ HTML5 และ CSS3 ตอบสนอง
เริ่ม bootstrap	ห้องสมุดฟรีในการดาวน์โหลดชุดรูปแบบ bootstrap และเทมเพลต

↥กลับไปด้านบน

HTML preprocessor

ชื่อ	คำอธิบาย
เสียงดัง	ภาษามาร์กอัพ Abstraction HTML
การทำเครื่องหมาย	เครื่องมือแปลงข้อความเป็น HTML สำหรับนักเขียนเว็บ
บาง	เครื่องยนต์เทมเพลตน้ำหนักเบา
หยก	โหนดเทมเพลตเอ็นจิ้น

↥กลับไปด้านบน

CSS preprocessor

ชื่อ	คำอธิบาย
น้อย	โหนด CSS pre processor
scss / sass	ภาษาส่วนขยาย CSS ระดับมืออาชีพที่เป็นผู้ใหญ่มากที่สุดมีเสถียรภาพและทรงพลังที่สุดในโลก
สไตลัส	Expressive, Dynamic, แข็งแกร่ง, Preprocessor CSS ที่อุดมไปด้วยคุณลักษณะ
postcss	เครื่องมือสำหรับการเปลี่ยน CSS ด้วย JavaScript

↥กลับไปด้านบน

JavaScript Preprocessor

ชื่อ	คำอธิบาย
CoffeeScript	ภาษาเล็ก ๆ ที่รวบรวมเป็น JavaScript
Livescript	ภาษาที่รวบรวมกับ JavaScript
ตัวพิมพ์ใหญ่	JavaScript ที่ปรับขนาด
บาเบล	คอมไพเลอร์สำหรับการเขียน JavaScript รุ่นต่อไป

↥กลับไปด้านบน

เฟรมเวิร์กเขี้ยว

ชื่อ	คำอธิบาย
ชาวบูร์บอง	ไลบรารี Mixin ที่เรียบง่ายและมีน้ำหนักเบาสำหรับ Sass
เข็มทิศ	กรอบการเขียน CSS โอเพนซอร์ซ
ซัลซี	เอ็นจิ้นเค้าโครงแบบกำหนดเองสำหรับ Sass

↥กลับไปด้านบน

Node.js Module และ Bundler

ชื่อ	คำอธิบาย
NPM	ตัวจัดการแพ็คเกจสำหรับ JavaScript
-	-
เบราว์เซอร์	เบราว์เซอร์ require() ทางโหนด
เสียงฮึดฮัด	นักวิ่งงาน JavaScript
อึก	ระบบสร้างสตรีมมิ่ง
พัสดุ	Blazing Fast, Zero การกำหนดค่าเว็บแอปพลิเคชัน Bundler
การหมุน	Bundler โมดูล ES รุ่นต่อไป
เว็บแพ็ค	Bundler สำหรับ JavaScript และเพื่อน
-	-
eslint	ค้นหาและแก้ไขปัญหาในรหัส JavaScript ของคุณ
สวยกว่า	Prettier เป็นรูปแบบรหัสที่มีความคิดเห็น
stylelint	linter อันทรงพลังและทันสมัยที่ช่วยให้คุณหลีกเลี่ยงข้อผิดพลาดและบังคับใช้การประชุมในสไตล์ของคุณ
ผู้กระทำความผิด	- ผ้าสำลีกระทำข้อความ
LinkInator	ตัวรวบรวมข้อมูลไซต์ที่เรียบง่ายสุดและตัวตรวจสอบลิงค์ที่เสีย
-	-
เบราว์เซอร์ซินซี	เก็บเบราว์เซอร์และอุปกรณ์หลายตัวไว้ในการซิงค์เมื่อสร้างเว็บไซต์
http-server	เซิร์ฟเวอร์ HTTP คำสั่ง HTTP คำสั่งที่ง่ายและกำหนดค่าเป็นศูนย์
ให้บริการ	การให้บริการไฟล์แบบคงที่และรายชื่อไดเรกทอรี
Server.js	เซิร์ฟเวอร์ที่เรียบง่ายและทรงพลังสำหรับ node.js
-	-
chokidar	เสื้อคลุมที่มีประสิทธิภาพรอบ node.js fs.watch / fs.watchfile / fsevents
พยักหน้า	ตรวจสอบการเปลี่ยนแปลงใด ๆ ในแอปพลิเคชัน Node.js ของคุณและรีสตาร์ทเซิร์ฟเวอร์โดยอัตโนมัติ - สมบูรณ์แบบสำหรับการพัฒนา
การเปลี่ยน	ใช้รูปแบบ GLOB เพื่อดูชุดไฟล์และเรียกใช้คำสั่งเมื่อมีอะไรเพิ่มเปลี่ยนหรือลบ
-	-
พร้อมกัน	เรียกใช้คำสั่งพร้อมกัน เช่น npm run watch-js & npm run watch-less แต่ดีกว่า
NPM-Run-all	เครื่องมือ CLI ที่จะเรียกใช้หลาย NPM-scripts ในแบบขนานหรือต่อเนื่อง
เปลือกขนาน	โมดูล NPM ที่เรียบง่ายเป็นพิเศษในการเรียกใช้คำสั่งเชลล์แบบขนาน
-	-
การต่อ	เชื่อมต่อหลายไฟล์
cpy-cli	คัดลอกไฟล์สำหรับโหนด
DEL	ลบไฟล์และไดเรกทอรีโดยใช้ Globs
ด่วน	เฟรมเวิร์กเว็บที่รวดเร็วไม่ได้รับการผ่าตัดมินิมัลลิสต์สำหรับโหนด
โหนด	ช่วยให้คุณสามารถรวบรวมไฟล์. sscss ไปยัง CSS ด้วยความเร็วที่เหลือเชื่อและผ่านมิดเดิลแวร์เชื่อมต่อโดยอัตโนมัติ
npm-check-updates	อัพเกรดแพ็คเกจของคุณการพึ่งพาการพึ่งพาเวอร์ชันล่าสุดโดยไม่สนใจเวอร์ชันที่ระบุ
purgecss	Purgecss เป็นเครื่องมือในการลบ CSS ที่ไม่ได้ใช้
rimraf	คำสั่ง UNIX rm -rf สำหรับโหนด
-	-
Bower [ ค่าเสื่อมราคา ]	ตัวจัดการแพ็คเกจสำหรับเว็บ

↥กลับไปด้านบน

JavaScript Library

ชื่อ	คำอธิบาย
jQuery	การเขียนน้อยลงทำมากขึ้นไลบรารี JavaScript
Modernizr	Modernizr บอกคุณว่า HTML, CSS และ JavaScript มีคุณสมบัติอย่างไรที่เบราว์เซอร์ของผู้ใช้มีให้
-	-
bliss.js	ต้องการใช้วานิลลา JS แต่พบว่า APIs พื้นเมืองไม่เป็นไปได้ไหม? ความสุขสำหรับคุณ
ร่ม JS	☔ไลบรารี JavaScript น้ำหนักเบาสำหรับการจัดการ DOM และเหตุการณ์
Zepto JS	Zepto เป็นไลบรารี JavaScript ที่เรียบง่ายสำหรับเบราว์เซอร์สมัยใหม่ที่มี API ที่เข้ากันได้กับ JQuery เป็นส่วนใหญ่
เงินสด js	ทางเลือก jQuery ขนาดเล็กที่ไร้สาระสำหรับเบราว์เซอร์ที่ทันสมัย
Chibi JS	จาวาสคริปต์ขนาดเล็กห้องสมุด

↥กลับไปด้านบน

ปลั๊กอินวานิลลาจาวาสคริปต์

ชื่อ	คำอธิบาย
Anchor.js	เพิ่มลิงค์สมอลึกลงในเอกสารของคุณ
anime.js	anime.js (/ˈæn.ə.meɪ/) เป็นไลบรารีแอนิเมชั่น JavaScript ที่มีน้ำหนักเบาด้วย API ที่เรียบง่าย แต่ทรงพลัง มันทำงานกับคุณสมบัติ CSS, SVG, คุณลักษณะ DOM และวัตถุจาวาสคริปต์
chart.js	ชาร์ตที่เรียบง่ายสะอาดและมีส่วนร่วมสำหรับนักออกแบบและนักพัฒนา
Chartist.js	แผนภูมิตอบสนองที่เรียบง่าย
(a) darkmode.js (b) สวิตช์โหมดมืด	- เพิ่มโหมดมืด / โหมดกลางคืนลงในเว็บไซต์ของคุณในเวลาไม่กี่วินาที
Velocity.js	แอนิเมชั่น JavaScript เร่งความเร็ว
favico.js	ใช้ประโยชน์จาก Favicon ของคุณด้วยป้ายรูปภาพหรือวิดีโอ
fluidvids.js	โมดูลวิดีโอความกว้างของเหลว (ตอบสนอง), 1KB, ผู้เล่นที่กำหนดเอง, องค์ประกอบไดนามิก/การสนับสนุน XHR
Highlight.js	Highlight.js เป็นปากกาเน้นข้อความไวยากรณ์ที่เขียนใน JavaScript
headroom.js	ซ่อนส่วนหัวของคุณจนกว่าคุณจะต้องการ
Holder.js	ตัวยึดภาพด้านข้างของลูกค้า
lazysizes.js	ประสิทธิภาพสูงและ SEO Lazy Loader ที่เป็นมิตรสำหรับรูปภาพ (ตอบสนองและปกติ), iframes และอื่น ๆ
littlefoot.js	Littlefoot เป็นไลบรารี JavaScript ที่มีน้ำหนักเบาซึ่งสร้างเชิงอรรถที่ยอดเยี่ยม
lunr.js	การค้นหาข้อความแบบเต็มง่าย ๆ ในเบราว์เซอร์ของคุณ
nprogress.js	แถบความคืบหน้าของนาโน
pace.js	แถบความคืบหน้าของเว็บเพจอัตโนมัติ
prism.js	Prism เป็นห้องสมุดไฮไลต์ไวยากรณ์ที่มีน้ำหนักเบามีน้ำหนักเบาและสง่างาม
React-Burger-Menu	ส่วนประกอบของแถบด้านข้างนอก-Canvas พร้อมคอลเลกชันของเอฟเฟกต์และสไตล์โดยใช้การเปลี่ยน CSS และภาพเคลื่อนไหวเส้นทาง SVG
NAV ตอบสนอง	ปลั๊กอินนำทางที่ตอบสนองได้โดยไม่ต้องพึ่งพาห้องสมุดและรองรับหน้าจอสัมผัสที่รวดเร็ว
slideout.js	เมนูการนำทางแบบ Slideout Touch สำหรับเว็บแอพมือถือของคุณ
smartcrop.js	การปลูกถ่ายภาพที่รับรู้เนื้อหา
tabella.js	ตารางตอบสนอง
โยง	ไลบรารี JavaScript เพื่อให้องค์ประกอบที่อยู่ในตำแหน่งอย่างมีประสิทธิภาพอยู่ถัดจากองค์ประกอบอื่นในหน้า
tippy.js	ไลบรารีคำแนะนำเครื่องมือ JavaScript Vanilla ที่มีน้ำหนักเบา
Tooltip.js	Tooltip.js เป็นไลบรารี JavaScript และ CSS สำหรับการสร้างคำแนะนำเครื่องมือที่มีสไตล์
เทือกเขา	Turbolinks®ทำให้การสำรวจเว็บแอปพลิเคชันของคุณเร็วขึ้น
เรียงพิมพ์	ตัวพิมพ์ก่อนตัวพิมพ์สำหรับ HTML ของคุณซึ่งใช้จาวาสคริปต์ฝั่งไคลเอ็นต์
Zeroclipboard.js	วิธีง่ายๆในการคัดลอกข้อความไปยังคลิปบอร์ด

↥กลับไปด้านบน

ปลั๊กอิน jQuery

ชื่อ	คำอธิบาย
Formstone - พื้นหลัง	ปลั๊กอิน jQuery สำหรับภาพฟูลเฟรมและพื้นหลังวิดีโอ
bigfoot.js	ปลั๊กอิน jQuery สำหรับการเพิ่มขีดความสามารถเชิงอรรถ
bigslide.js	ปลั๊กอิน JQuery Panel ที่มีความฝันอันยิ่งใหญ่
fitvids.js	ปลั๊กอิน jQuery ที่ใช้งานง่ายและใช้งานง่ายสำหรับการฝังวิดีโอความกว้างของเหลว
fullpage.js	ปลั๊กอินไซต์หนึ่งหน้า
โหลดขี้เกียจ	Lazy Load เป็นความล่าช้าในการโหลดภาพในหน้าเว็บยาว
ความมีชีวิตชีวา	ปลั๊กอิน Lightbox ที่มีน้ำหนักเบาเป็นพิเศษเข้าถึงได้และตอบสนองได้ซึ่งรองรับรูปภาพ iFrames และเนื้อหาอินไลน์ออกจากกล่อง

↥กลับไปด้านบน

ชุดเครื่องมือคอมเพรสเซอร์ JavaScript

ชื่อ	คำอธิบาย
ผู้เล่นตัวเล็ก ๆ	- JavaScript Parser, Mangler และ Compressor Toolkit สำหรับ ES6+
uglifyjs	UglifyJS เป็นตัวแยกวิเคราะห์ JavaScript, Minifier, Compressor และ Beautifier Toolkit

↥กลับไปด้านบน

ห้องสมุด CSS

ชื่อ	คำอธิบาย
Animate.css	ห้องสมุดข้ามเบราว์เซอร์ของแอนิเมชั่น CSS
CSSGRAM	ห้องสมุดเล็ก ๆ (<1kb gzipped!) สำหรับการสร้างตัวกรอง Instagram ใหม่ด้วยตัวกรอง CSS และโหมดผสมผสาน
CSS ตัวกรองสนามเด็กเล่น	เล่นกับเอฟเฟกต์ตัวกรอง CSS3 ใหม่
eqcss	ข้อมูลจำเพาะสำหรับไวยากรณ์การสืบค้นองค์ประกอบแบบคอนเทนเนอร์ใน CSS
กริดแบบยืดหยุ่น	ระบบกริดตามคุณสมบัติการแสดงผล Flex
การเรียนรู้ :nth-child	คลาส Pseudo CSS3 และ: ช่วง Nth-Child
Eric Meyer CSS รีเซ็ต	Eric Meyer CSS รีเซ็ต
กราฟ	การซ้อนทับกริด CSS บริสุทธิ์สำหรับการออกแบบ
แฮมเบอร์เกอร์	แฮมเบอร์เกอร์อนิเมชั่น CSS แสนอร่อย
ระบบกริด Mueller	ระบบกริดแบบแยกส่วนสำหรับเค้าโครงตอบสนอง/ปรับตัวและไม่ตอบสนองตามเข็มทิศ
Normalize.css	ทางเลือกที่ทันสมัยและพร้อมใช้งาน HTML5 สำหรับการรีเซ็ต CSS
RTLCSS	เฟรมเวิร์กสำหรับการแปลงแผ่นสไตล์การเรียงซ้อน (LTR) (LTR) (CSS) เป็นซ้ายไปซ้าย (RTL)
ขนมปังปิ้ง	บ้าคลั่ง CSS ที่ไร้สาระ
CSSWAND	มันเป็นเพียงห้องสมุดแอนิเมชั่นที่ใช้ CSS ที่เรียบง่ายและบริสุทธิ์
Water.css	คอลเลกชันสไตล์เพื่อสร้างเว็บไซต์ง่ายๆ
ลูกเกด CSS	ห้องสมุดยูทิลิตี้ CSS เท่านั้น
สเปกตรัม CSS	การใช้งาน CSS มาตรฐานของภาษาการออกแบบสเปกตรัมสำหรับบุคคลภายในและบุคคลที่สาม
Box-shadows.css	Mianly ขึ้นอยู่กับเงากล่อง

↥กลับไปด้านบน

ห้องสมุดไอคอน SVG, PNG และแบบอักษร

ชื่อ	คำอธิบาย
วิธีการทำงานกับไอคอน SVG	-
จัดเรียงไอคอน SVG เป็นข้อความและบอกลาไอคอนแบบอักษร	-
-	-
ไอคอน bootstrap	ไอคอน Bootstrap เป็น SVGs ดังนั้นจึงปรับขนาดได้อย่างรวดเร็วและง่ายดายและสามารถจัดสไตล์ด้วย CSS ในขณะที่พวกเขาถูกสร้างขึ้นสำหรับ bootstrap พวกเขาจะทำงานในโครงการใด ๆ
ไอคอนใบอนุญาตครีเอทีฟคอมมอนส์	ดาวน์โหลดไอคอนใบอนุญาต SVG, EPS และ PNG Creative Commons เพื่อใช้ในเว็บไซต์ของคุณ
ฟลาติกสัน	ฐานข้อมูลที่ใหญ่ที่สุดของไอคอนฟรีที่มีอยู่ใน PNG, SVG, EPS, PSD และรูปแบบฐาน 64
ขนนก	Feather เป็นคอลเล็กชั่นไอคอนโอเพนซอร์สที่สวยงาม
ตัวอักษรที่ยอดเยี่ยม	ชุดเครื่องมือแบบอักษรและ CSS ที่เป็นสัญลักษณ์
Font-ewesome-SVG-PNG	FONT Awesome Split ไปยังไฟล์ SVG และ PNG แต่ละไฟล์ที่มีขนาดต่างกันพร้อมกับเครื่องกำเนิดที่ใช้ node.js
ฟอร์ฟฟอร์จ	บรรณาธิการตัวอักษรฟรีและโอเพ่นซอร์สนำมาให้คุณโดยชุมชนของคนรักประเภทเพื่อน
ฟอนเทลโล	วิธีง่ายๆในการสร้างแบบอักษรไอคอนที่กำหนดเองสำหรับเว็บไซต์ของคุณ เลือกรูปภาพจากคอลเลกชันขนาดใหญ่ของเราและสร้างแพ็คเว็บฟ์ด้วยคลิกเดียว
icomoon	ICOMOON จัดเตรียมไอคอนเวกเตอร์พร้อมแอพ HTML5 ฟรีสำหรับการสร้างแบบอักษรไอคอนที่กำหนดเองหรือสไปรต์ SVG เรียกดูไอคอนที่สมบูรณ์แบบพิกเซลนับพันหรือนำเข้าเวกเตอร์ของคุณเอง
ไอออนนิกอน	ตัวอักษรไอคอนพรีเมี่ยมสำหรับกรอบไอออนิก
ไอคอนการออกแบบวัสดุ	ดูไอคอนการออกแบบวัสดุทั้งหมดและอื่น ๆ จากชุมชน
รายการขนาดใหญ่ของไอคอนแบนและแบบอักษรไอคอนโดย CSS-Triks	มีบทสรุปมากมาย อันนี้เป็นของฉัน
คำนามโครงการ - ไอคอนสำหรับทุกสิ่ง	ไอคอนเกือบหนึ่งล้านไอคอนที่สร้างขึ้นโดยชุมชนระดับโลก
แปดรัก	แบบอักษรไอคอนที่ปรับขนาดได้ทำด้วยมือด้วย <3 โดย GitHub
ไอคอนที่สมบูรณ์แบบ	วิธีที่ง่ายที่สุดในการสร้างไอคอนโซเชียลอิสระ
ไอคอนง่ายๆ	ไอคอน SVG ฟรีสำหรับแบรนด์ยอดนิยม
svg-icon	คอลเลกชันไอคอน SVG ที่ดีที่สุดทำถูกต้อง
ไอคอน SVG	พร้อมที่จะใช้ไอคอน SVG สำหรับเว็บ
ไอคอนเวกเตอร์ Roundup	การเปรียบเทียบแบบเคียงข้างกันระหว่างแบบอักษรไอคอนยอดนิยม
เราชอบแบบอักษรไอคอน	บริการโฮสต์ไอคอนฟรีและโอเพ่นซอร์สและโอเพ่นซอร์สเพื่อการทดสอบ

↥กลับไปด้านบน

PNG, JPEG, ชุดเครื่องมือคอมเพรสเซอร์ GIF

ชื่อ	คำอธิบาย
tinyjpg	การบีบอัด Smart Webp, JPEG และ PNG
บีบอัด PNG	-
ประคบ JPEG	-
ประคบ GIF	-

↥กลับไปด้านบน

รูปแบบ HTML

ชื่อ	คำอธิบาย
แผนภูมิ	ทำแผนภูมิในไม่กี่วินาที
แบบฟอร์ม	รูปแบบ HTML ที่ใช้งานได้สำหรับไซต์คงที่
Gridspree	แสดงข้อมูลสเปรดชีตของคุณตามที่คุณต้องการบนไซต์คงที่ด้วย Google Spreadsheet
รูปปั้น	ผู้สร้างแบบฟอร์ม
WTF แบบฟอร์ม?	Friendlier HTML แบบฟอร์มควบคุมด้วยเวทมนตร์ CSS เล็กน้อย ออกแบบมาสำหรับ IE9+รวมถึง Chrome ล่าสุด Safari และ Firefox
wufoo	ตัวสร้างแบบฟอร์มออนไลน์พร้อมฐานข้อมูลการจัดเก็บบนคลาวด์

↥กลับไปด้านบน

เครื่องมือบนเว็บ

ชื่อ	คำอธิบาย
API บทคัดย่อ	ชุดยูทิลิตี้ที่เรียบง่าย แต่ทรงพลังสำหรับนักพัฒนาเช่นการตรวจสอบอีเมลเครื่องกำเนิดอวตารผู้ใช้การบีบอัดรูปภาพและอื่น ๆ API ทั้งหมดมีเวอร์ชันฟรี
ระบบอัตโนมัติ	การวาดที่รวดเร็วสำหรับทุกคน Autodraw จับคู่เครื่องจักรการเรียนรู้ด้วยภาพวาดจากศิลปินที่มีความสามารถเพื่อช่วยให้คุณวาดสิ่งของได้อย่างรวดเร็ว
นักแปลไบนารี	แปลรหัสไบนารีฟรีแปลรหัสไบนารีเป็นข้อความ
ฐาน 16	สถาปัตยกรรมสำหรับการสร้างธีมตามไวยากรณ์ที่เลือกอย่างระมัดระวังโดยใช้ฐานที่มีสีสิบหกสี
Bootstrap 5 Cheat Sheet	รายการแบบโต้ตอบของคลาส bootstrap 5 ตัวแปรและ mixins
colors.css	สีเริ่มต้นที่ดีกว่าสำหรับเว็บ คอลเลกชันของคลาสผิวหนังสำหรับการสร้างต้นแบบที่เร็วขึ้นและเว็บไซต์ที่ดูดีกว่า
รหัสสีหกเหลี่ยมสี	Color-Hex ให้ข้อมูลเกี่ยวกับสีรวมถึงรุ่นสี (RGB, HSL, HSV และ CMYK), สี triadic, สีโมโนโครมและสีอะนาล็อกที่คำนวณในหน้าสี
การตามล่าสี	คอลเลกชันที่มีสีสันสวยงามอัปเดตทุกวัน
เครื่องกำเนิด CSS3	CSS3 คลาสสิก
cssmatic	เครื่องมือ CSS ที่ดีที่สุดสำหรับนักออกแบบเว็บไซต์
draw.io	draw.io เป็นซอฟต์แวร์ไดอะแกรมออนไลน์ฟรีสำหรับการทำผังงานแผนภูมิกระบวนการแผนภูมิองค์กร, UML, ER และไดอะแกรมเครือข่าย
สีแบน	เรียกดูสีแบนกว่า 11,000 สีในจานสีแบนกว่า 2,300 สี คัดลอกหรือดาวน์โหลดไฟล์ .ACO สำหรับใช้ใน Photoshop
เครื่องมือพัฒนาส่วนหน้าด้อยส่วนหน้า	เครื่องมือบนเว็บที่ได้รับการดูแลสำหรับนักพัฒนาเว็บไซต์และเจ้าของเพื่อการวิเคราะห์และการสำรวจ
พื้นหลังการไล่ระดับสี	ในฐานะที่เป็นรายการของเว็บไซต์ไล่ระดับสีที่ดีที่สุดผ่านอินเทอร์เน็ตพื้นหลังการไล่ระดับสีช่วยให้คุณสำรวจลองและเลือกจากจานสีผสมที่สวยงามหลายร้อยรายการ
ตัวช่วยสร้างสไตล์: Google Maps APIs	ปรับแต่งสีถนนป้ายและอื่น ๆ จากนั้นใช้สไตล์ที่กำหนดเองของคุณในโครงการแพลตฟอร์ม Google Maps ของคุณ
แผนที่ snazzy	พื้นที่เก็บข้อมูลที่แตกต่างกันสำหรับ Google Maps มุ่งเน้นไปที่นักออกแบบเว็บไซต์และนักพัฒนา
Solarized - สีที่แม่นยำสำหรับเครื่องจักรและผู้คน	Solarized เป็นจานสีสิบหกสี (แปดโมโนโทน, แปดสีสำเนียง) ที่ออกแบบมาเพื่อใช้กับแอปพลิเคชันเทอร์มินัลและ GUI
เครื่องกำเนิดแฮชศรี	แนะนำให้ใช้ SRI เป็นวิธีปฏิบัติที่ดีที่สุดเมื่อใดก็ตามที่ห้องสมุดถูกโหลดจากแหล่งที่มาของบุคคลที่สาม
ซุปเปอร์โดเมน	ตรวจสอบความพร้อมใช้งานของโดเมน
สร้างตารางน้ำยางออนไลน์	สร้างตารางยางพาราที่ซับซ้อนอย่างรวดเร็วด้วยเครื่องกำเนิดไฟฟ้าออนไลน์ - การรวมเซลล์ได้รับการสนับสนุนร่วมกับการแก้ไขพรมแดน
uigradients	คอลเล็กชั่นการไล่ระดับสีที่สวยงามสำหรับนักออกแบบและนักพัฒนา
ไม่ทำให้ไม่ลงรอยกัน	เครื่องมือออนไลน์ฟรีที่จะยกระดับ (unpack, deobfuscate) JavaScript, CSS และ HTML Code ทำให้สามารถอ่านได้และสวย
เครื่องมือเว็บรหัส	CSS3, HTML5, Microdata, Open กราฟและเครื่องกำเนิดการ์ด Twitter
ความละเอียดหน้าจอของฉันคืออะไร	เครื่องมือออนไลน์ในการตรวจสอบความละเอียดหน้าจอของอุปกรณ์แสดงผลใด ๆ
webgradients	คอลเลกชันฟรีของการไล่ระดับสีพื้นหลังที่คุณสามารถใช้เป็นฉากหลังเนื้อหาในส่วนใดส่วนหนึ่งของเว็บไซต์ของคุณ

↥กลับไปด้านบน

ไลบรารี CDN

ชื่อ	คำอธิบาย
bootstrapcdn	CDN ที่แนะนำสำหรับ Bootstrap, Font Awesome และ Bootswatch
cdnjs	CDN ฟรีและโอเพ่นซอร์สสำหรับไลบรารีที่เกี่ยวข้องกับเว็บเพื่อเพิ่มความเร็วเว็บไซต์ของคุณ!
coralcdn	เครือข่ายการกระจายเนื้อหาฟรีและเปิดใช้งานเกี่ยวกับเทคโนโลยีแบบเพียร์ทูเพียร์ซึ่งประกอบด้วยเครือข่ายพร็อกซีเว็บและ Nameservers ทั่วโลก
ตัวอักษร	เครื่องมือค้นหาสำหรับ Google Web Fonts
Google Fonts	ฟอนต์โอเพนซอร์สฟรีหลายร้อยตัวที่ได้รับการปรับให้เหมาะสมสำหรับเว็บ
Google Hosted Libraries	เครือข่ายการกระจายเนื้อหาที่มีความเสถียรเชื่อถือได้ความเร็วสูงและมีอยู่ทั่วโลกสำหรับไลบรารี JavaScript โอเพนซอร์ซที่ได้รับความนิยมมากที่สุด
jsdelivr	CDN สุดยอดฟรีสำหรับนักพัฒนาและเว็บมาสเตอร์
Microsoft Ajax CDN	ห้องสมุด JavaScript ของบุคคลที่สามยอดนิยมเช่น JQuery และช่วยให้คุณสามารถเพิ่มไปยังเว็บแอปพลิเคชันของคุณได้อย่างง่ายดาย
ซอฟต์แวร์โอเพ่นซอร์ส CDN	ซอฟต์แวร์โอเพ่นซอร์ส CDN โดย MaxCDN
Yandex CDN	บริการโฮสต์ไลบรารี JavaScript ที่ให้ผู้พัฒนาไซต์สามารถเข้าถึง Yandex Content Delivery (CDN) และสามารถจัดการกับ JavaScript-Frameworks และห้องสมุดที่หลากหลายจากเซิร์ฟเวอร์ Yandex

↥กลับไปด้านบน

ความเข้ากันได้ของเบราว์เซอร์วิกิ

ชื่อ	คำอธิบาย
ฉันสามารถใช้	ตรวจสอบความเข้ากันได้ของเบราว์เซอร์ของคุณสมบัติ CSS3 และ HTML5
ฉันควรนำหน้า	เพียงแสดงให้เห็นว่าคำนำหน้าใดที่จำเป็นสำหรับคุณสมบัติ CSS ที่ใหม่กว่า

↥กลับไปด้านบน

เครื่องมือทดสอบการตอบสนอง

ชื่อ	คำอธิบาย
ฉันตอบสนองหรือไม่?	ดูว่าไซต์ของคุณมีลักษณะอย่างไรบนเดสก์ท็อปแล็ปท็อป iPad และ iPhone
อ่านหนังสือ	ใช้เครื่องทดสอบอุปกรณ์เบราว์เซอร์และดาวน์โหลดภาพ Internet Explorer สำหรับ VM ของคุณ
อุปกรณ์สนับสนุน	แสดงตัวอย่างอย่างรวดเร็วเกี่ยวกับการตอบสนองของเว็บไซต์ของคุณต่อความละเอียดของอุปกรณ์ที่แตกต่างกันเช่น MacBook, iPad หรือ iPhone แบ่งปันตัวอย่างนี้กับลูกค้าของคุณ
แอพตอบสนอง	ต้องมี devtool สำหรับนักพัฒนาเว็บเพื่อการพัฒนาเว็บที่ตอบสนองได้เร็วขึ้น

↥กลับไปด้านบน

เครื่องมือทดสอบประสิทธิภาพ

ชื่อ	คำอธิบาย
Google Pagespeed Tools	เครื่องมือ pagespeed วิเคราะห์และเพิ่มประสิทธิภาพเว็บไซต์ของคุณตามแนวทางปฏิบัติที่ดีที่สุดของเว็บ
WebPagetest	เรียกใช้การทดสอบความเร็วเว็บไซต์ฟรีจากหลาย ๆ สถานที่ทั่วโลกโดยใช้เบราว์เซอร์จริงและด้วยความเร็วการเชื่อมต่อของผู้บริโภคจริง
การทดสอบความเร็วของเว็บไซต์	ใช้การทดสอบความเร็วเว็บไซต์ฟรีนี้เพื่อวิเคราะห์ความเร็วในการโหลดเว็บไซต์ของคุณและเรียนรู้วิธีทำให้เร็วขึ้น

↥กลับไปด้านบน

ผู้ถือครองตำแหน่ง

ชื่อ	คำอธิบาย
ผู้ถือ jsonplace	API REST ออนไลน์ปลอมสำหรับการทดสอบและการสร้างต้นแบบ
Lorem Ipsum	Lorem Ipsum เป็นเพียงข้อความจำลองของอุตสาหกรรมการพิมพ์และเรียงพิมพ์
Lorempixel	ภาพตัวยึดสำหรับทุกกรณี
Place Hold.it	บริการตัวยึดภาพที่ง่ายและรวดเร็ว

↥กลับไปด้านบน

ผู้ที่เก็บรักษา

ชื่อ	คำอธิบาย
สถานที่	โครงการที่ดีที่สุดในการวางโครงการของคุณในบริบทของอุปกรณ์ใด ๆ

↥กลับไปด้านบน

ไอคอนเว็บไซต์สำหรับเบราว์เซอร์

ชื่อ	คำอธิบาย
เครื่องกำเนิด Favicon	เครื่องกำเนิด favicon ออนไลน์ สำหรับจริง
สร้างเว็บไซต์ที่ถูกตรึงไว้	เครื่องมือออนไลน์เพื่อสร้างกระเบื้องหน้าจอเริ่ม Windows ที่กำหนดเองสำหรับเว็บไซต์ของคุณในเวลาไม่ถึงหนึ่งนาที
การปรับปรุงไซต์ที่ตรึงบน Windows / การสร้างกระเบื้องที่กำหนดเองสำหรับเว็บไซต์ IE11	การตั้งค่ากระเบื้องสดและการแจ้งเตือนสำหรับ Windows
การกำหนดค่าเว็บแอปพลิเคชันสำหรับ Apple	ข้อมูลแนวคิดและเทคนิคในการสร้างเนื้อหาเว็บที่มีประสิทธิภาพสำหรับ Safari และ WebKit โดยใช้ HTML และ CSS
เว็บแอพที่ติดตั้งได้พร้อมกับเว็บแอปมรายการใน Chrome สำหรับรูปแบบไฟล์ Android / Manifest	ใช้เว็บแอปมรายการเพื่อควบคุมวิธีการเปิดใช้งานเว็บแอปของคุณ

↥กลับไปด้านบน

ตัวอย่างและบทช่วยสอนที่สร้างแรงบันดาลใจฟรี

ชื่อ	คำอธิบาย
Codemyui	ตัวอย่างโค้ดที่ได้รับการคัดเลือกคุณสามารถใช้ในโครงการเว็บของคุณ ค้นหาแรงบันดาลใจในการออกแบบเว็บพร้อมตัวอย่างรหัส
โคไซเฮาส์	ห้องสมุดฟรีของ HTML, CSS, JS Nuggets
การเข้ารหัส	Codrops เป็นบล็อกการออกแบบและพัฒนาเว็บที่เผยแพร่บทความและบทช่วยสอนเกี่ยวกับแนวโน้มเว็บเทคนิคและความเป็นไปได้ใหม่ ๆ ล่าสุด
ย้ายไปที่ https	โยกย้ายจาก HTTP ไปยัง HTTPS ได้อย่างง่ายดาย
นาวานัฟ	ตัวอย่าง CSS, jQuery และ JavaScript ตัวอย่างการนำทางการสาธิตการสาธิตและบทช่วยสอนจากทั่วเว็บ
Papersizes.io - ทรัพยากรที่ดีที่สุดสำหรับขนาดกระดาษ	ทรัพยากรที่เรียบง่ายและฟรีสำหรับการค้นหามาตรฐานสากลสำหรับขนาดกระดาษในตัวชี้วัดและอิมพีเรียล
ขนม pdf	แก้ไขไฟล์ PDF ด้วย PDF Candy - ตัวแก้ไข PDF ออนไลน์ฟรี แปลง PDF เป็น Word, PDF เป็น JPG, ผสาน PDF, แยก PDF, บีบอัด PDF ฯลฯ
สก๊อต	บล็อกการพัฒนาเว็บที่พูดถึงการเขียนโปรแกรมการพัฒนาเว็บและชีวิตทุกอย่าง
นิตยสาร Smashing	นิตยสารออนไลน์สำหรับนักออกแบบเว็บและนักพัฒนามืออาชีพโดยมุ่งเน้นไปที่เทคนิคที่มีประโยชน์แนวทางปฏิบัติที่ดีที่สุดและทรัพยากรที่มีค่า
W3SCHOOLS การสอนเว็บออนไลน์	เว็บไซต์นักพัฒนาเว็บที่ใหญ่ที่สุดในโลก

↥กลับไปด้านบน

การอ้างอิง CSS

ชื่อ
เอกสารเว็บ Mozilla
เอกสาร css dev
ดัชนีคุณสมบัติ CSS
การอ้างอิง CSS
การอ้างอิง CSS - Codrops
เค้าโครง :
FlexBox - เคล็ดลับ CSS
CSS GRID - เคล็ดลับ CSS
สนามเด็กเล่น CSS Flexbox โดย Gabi
Flexbox Froggy
สวนกริด CSS
ภาพเคลื่อนไหว CSS :
การใช้ CSS Animation - MDN
แอนิเมชั่น - เคล็ดลับ CSS

↥กลับไปด้านบน

บทเรียน CSS

ชื่อ	คำอธิบาย
เบราว์เซอร์แบบอักษรที่ปลอดภัย	แบบอักษรทั่วไปสำหรับ Windows & MAC ทุกรุ่นเทียบเท่า
CSS FONT STACK	คอลเลกชันที่สมบูรณ์ของ Web Safe CSS Font Stacks
CSS Outline Property - โครงร่าง: ไม่มีและโครงร่าง: 0	คุณสมบัติ CSS Outline เป็นข้อกำหนดการเข้าถึง แต่มักจะถูกทารุณกรรมโดยนักออกแบบเว็บไซต์หลายคนทำไมพวกเขาถึงทำเช่นนั้น?
การอ้างอิงตัวเลือก CSS	ใน CSS ตัวเลือกเป็นรูปแบบที่ใช้ในการเลือกองค์ประกอบที่คุณต้องการสไตล์
ความจำเพาะของ CSS	ความจำเพาะของ CSS ความจำเพาะของ CSS กำหนดการแสดงตัวเลขของตัวเลือกเพื่อเปรียบเทียบในกรณีที่มีความขัดแย้งสไตล์ โปสเตอร์เว็บแสดงความจำเพาะของ CSS ด้วยไอคอนจากภาพยนตร์เรื่อง 'The Shining' ของ Stanley Kubrick
กริดโดยตัวอย่าง	ทุกสิ่งที่คุณต้องการเพื่อเรียนรู้เค้าโครงกริด CSS
สวนกริด	เกมสำหรับการเรียนรู้กริด CSS
สีเขียวขจี	เรียนรู้กริด CSS!
ลิงก์แท็กแฮชที่ไม่ตัดปุ่มหน้าต่างเบราว์เซอร์	CSS-Tricks โพสต์โดย Chris Coyier
เรียนรู้ CSS Grid	คู่มือการเรียนรู้กริด CSS
เรียนรู้ CSS Grid	Jen Simmons มีทรัพยากรที่ยอดเยี่ยมมากมาย
เรียนรู้เค้าโครง CSS	เว็บไซต์นี้สอนพื้นฐาน CSS ที่ใช้ในรูปแบบของเว็บไซต์ใด ๆ
เอาชนะสีการเลือกข้อความเริ่มต้นด้วย CSS	CSS-Tricks โพสต์โดย Chris Coyier
ลิงค์ที่ชาญฉลาดกว่าสำหรับทุกเว็บไซต์	โพสต์โดย Adam Schwartz
สีพื้นหลังเบราว์เซอร์-เบราว์เซอร์คืออะไรเมื่อเลือกข้อความ?	คำตอบเกี่ยวกับสแต็คล้น
ทำไมฉันถึงเปลี่ยนจากน้อยไปเป็น Sass?	โพสต์โดย Hugo Giraudel

↥กลับไปด้านบน

อินโฟกราฟิกส์

ชื่อ	คำอธิบาย
โปสเตอร์โฮมออฟฟิศ	ที่เก็บโฮมออฟฟิศของโปสเตอร์ที่ครอบคลุมหัวข้อต่าง ๆ - การวิจัยความต้องการการเข้าถึงการเข้าถึงการออกแบบ

↥กลับไปด้านบน

แรงบันดาลใจในการออกแบบ

ชื่อ
ชื่นชมเว็บ
ที่น่ากลัว
การดู
แกลเลอรี่เว็บไซต์ที่ดีที่สุด
codepen
แกลเลอรี่ CSS
ผู้ชนะ CSS
ตู้เย็นออกแบบ
deviantart
เลี้ยงลูก
รางวัลเว็บไซต์โปรด (FWA)
Goodui
Google Design
แรงบันดาลใจ html
แรงบันดาลใจสำหรับการค้นหาเอฟเฟกต์ UI
ความรักหน้าเดียว
ดีฉันชอบ
siiimple
การออกแบบที่ดีที่สุด
เว็บไซต์ที่ดีมาก
แรงบันดาลใจในการออกแบบเว็บ
webdesign - การค้นหา Tumblr

↥กลับไปด้านบน

ระบบประเภท

ชื่อ	คำอธิบาย
สำรวจเครื่องชั่งประเภทที่ตอบสนองได้	การค้นหาจังหวะ (เหมาะสมหลายอุปกรณ์และแนวตั้ง) ของคุณ
คู่แบบอักษร	Font Pair ช่วยให้นักออกแบบจับคู่ Google Fonts เข้าด้วยกัน ชุดและคู่ของ Google Font ที่สวยงาม
สร้างสเกลประเภทด้วย stackswell	ประหยัดเวลาด้วยการเปิดตัวล่าสุดของ Stackswell และสร้างระบบประเภทในไม่กี่วินาที!
ระบบประเภทการออกแบบวัสดุ	ใช้ตัวอักษรเพื่อนำเสนอการออกแบบและเนื้อหาของคุณอย่างชัดเจนและมีประสิทธิภาพที่สุดเท่าที่จะทำได้
มาตราส่วนแบบแยกส่วน	คำนวณสร้างภาพและเรียนรู้เกี่ยวกับเครื่องชั่งแบบแยกส่วน
พิมพ์การเชื่อมต่อ	Type Connection เป็นเกมที่ช่วยให้คุณเรียนรู้วิธีจับคู่แบบอักษร
ตัวอักษรสำหรับนักพัฒนา	นี่เป็นคำแนะนำที่เป็นประโยชน์สำหรับนักพัฒนาเพื่อเรียนรู้การพิมพ์เว็บ
การพิมพ์ดีด	มีแนวโน้มอะไรในประเภท
Type Scale - เครื่องคำนวณภาพ	ดูตัวอย่างและเลือกมาตราส่วนประเภทที่เหมาะสมสำหรับโครงการของคุณ ทดลองกับขนาดตัวอักษรขนาดและเว็บฟอนต์ที่แตกต่างกัน
whatfont - ส่วนขยาย Chrome	วิธีที่ง่ายที่สุดในการระบุแบบอักษรบนหน้าเว็บ

↥กลับไปด้านบน

เครื่องมือเว็บมาสเตอร์

ชื่อ	คำอธิบาย
schema.org	กิจกรรมการทำงานร่วมกันของชุมชนที่มีภารกิจในการสร้างรักษาและส่งเสริม Schemas สำหรับข้อมูลที่มีโครงสร้างบนอินเทอร์เน็ตบนหน้าเว็บในข้อความอีเมลและอื่น ๆ
ไมโครฟอร์แมต	วิธีที่ง่ายที่สุดในการทำเครื่องหมายข้อมูลที่มีโครงสร้างใน HTML
เข้าใจว่าข้อมูลที่มีโครงสร้างทำงานอย่างไร	เอกสารนี้อธิบายถึงคุณสมบัติที่จำเป็นต้องแนะนำหรือเป็นทางเลือกสำหรับข้อมูลที่มีโครงสร้างที่มีความหมายพิเศษในการค้นหาของ Google
เครื่องมือทดสอบข้อมูลที่มีโครงสร้างโดย Google	เครื่องมือทดสอบข้อมูลที่มีโครงสร้างของ Google
Pagespeed Insights โดย Google	ทำให้หน้าเว็บของคุณรวดเร็วในทุกอุปกรณ์
JSON สำหรับการเชื่อมโยงข้อมูล	ข้อมูลยุ่งเหยิงและตัดการเชื่อมต่อ JSON-LD จัดระเบียบและเชื่อมต่อมันสร้างเว็บที่ดีขึ้น
JSON-LD	วิกิ
ตัวค้นหาละติจูดและลองจิจูด	ละติจูดและลองจิจูดเป็นหน่วยที่เป็นตัวแทนของพิกัดที่ระบบพิกัดทางภูมิศาสตร์ ในการค้นหาให้ใช้ชื่อสถานที่เมืองรัฐหรือที่อยู่หรือคลิกตำแหน่งบนแผนที่เพื่อค้นหาพิกัด LAT ยาว

↥กลับไปด้านบน

ผู้จัดการแพ็คเกจ

ชื่อ	คำอธิบาย
รายการระบบการจัดการแพคเกจซอฟต์แวร์	นี่คือรายการของระบบการจัดการแพคเกจซอฟต์แวร์จัดหมวดหมู่ก่อนตามรูปแบบแพ็คเกจ (ไบนารีซอร์สโค้ดไฮบริด) และจากนั้นโดยตระกูลระบบปฏิบัติการ
เหมาะ	ผู้จัดการแพ็คเกจ Linux OS Debian
ยำ	ตัวจัดการแพ็คเกจ Linux OS ที่ใช้ Fedora
โฮมบรูว์	Homebrew เป็นระบบการจัดการแพ็คเกจที่ทำให้การติดตั้งซอฟต์แวร์ง่ายขึ้นในระบบปฏิบัติการ MacOS ของ Apple และ Linux
ปีก	Windows Package Manager (AKA Winget) เป็นผู้จัดการแพ็คเกจฟรีและโอเพ่นซอร์สที่ออกแบบมาสำหรับ Microsoft Windows 10
ช็อคโกแลต	ช็อคโกแลตเป็นตัวจัดการแพคเกจระดับเครื่องและตัวติดตั้งสำหรับแพ็คเกจซอฟต์แวร์ที่สร้างขึ้นสำหรับแพลตฟอร์ม Windows
Goenv	Goenv ตั้งเป้าหมายที่จะง่ายที่สุดเท่าที่จะเป็นไปได้และทำตามรูปแบบการจัดการรุ่นที่ประสบความสำเร็จของ Pyenv และ RBENV ที่ประสบความสำเร็จแล้ว
NPM	NPM (เดิมสั้นสำหรับ Node Package Manager) เป็นตัวจัดการแพ็คเกจสำหรับภาษาการเขียนโปรแกรม JavaScript
nodenv	ใช้ nodenv เพื่อเลือกเวอร์ชันโหนดสำหรับแอปพลิเคชันของคุณและรับประกันว่าสภาพแวดล้อมการพัฒนาของคุณตรงกับการผลิต
Pyenv	Pyenv ช่วยให้คุณสลับระหว่าง Python หลายรุ่นได้อย่างง่ายดาย
เส้นด้าย	เส้นด้ายเป็นทางเลือกสำหรับ NPM
RVM	RVM เป็นเครื่องมือบรรทัดคำสั่งที่ช่วยให้คุณสามารถติดตั้งจัดการและทำงานกับสภาพแวดล้อมทับทิมหลายแห่งได้อย่างง่ายดายตั้งแต่ล่ามไปจนถึงชุดอัญมณี
rbenv	ใช้ RBENV เพื่อเลือกรุ่นทับทิมสำหรับแอปพลิเคชันของคุณและรับประกันว่าสภาพแวดล้อมการพัฒนาของคุณตรงกับการผลิต

↥กลับไปด้านบน

การติดขัด

ชื่อ	คำอธิบาย
ทำให้เป็นตะลึง	ปรับใช้เว็บไซต์คงที่ทันสมัยด้วย Netlify รับ CDN, การปรับใช้อย่างต่อเนื่อง, 1-click https และบริการทั้งหมดที่คุณต้องการ เริ่มต้นฟรี
แบบคงที่	รายการเครื่องกำเนิดไซต์แบบคงที่โอเพ่นซอร์สด้านบน
คนงานคงที่	Staticman เป็นแอปพลิเคชัน Node.js ที่ได้รับเนื้อหาที่ผู้ใช้สร้างขึ้นและอัปโหลดเป็นไฟล์ข้อมูลไปยังที่เก็บข้อมูล GitHub และ/หรือ Gitlab
Gitalk	องค์ประกอบความคิดเห็นที่ทันสมัยขึ้นอยู่กับปัญหา GitHub และ preact
คำพูด	วิดเจ็ตความคิดเห็นที่มีน้ำหนักเบาสร้างขึ้นจากปัญหา GitHub ใช้ปัญหา GitHub สำหรับความคิดเห็นบล็อกหน้าวิกิและอื่น ๆ !

↥กลับไปด้านบน

Cheatsheet?

ชื่อ
หน้า tldr
tldr inbrowser.app
tldr-book.pdf
Brew Basic Commands - Devsheet
Cheat.sh
Devhints
Homebrew Cheatsheet
คู่มือ GitHub CLI
Cheatsheet Markdown
GitHub-Cheat-sheet
Cheatsheet.md
Octonator บน Twitter: "เพิ่ม. pibb ในตอนท้ายของ URL GIST ใด ๆ เพื่อรับรุ่น HTML เท่านั้นที่เหมาะสำหรับการฝังในเว็บไซต์อื่น ๆ http://t.co/hytfqbm2do"

↥กลับไปด้านบน

รายการรายการรายการ

ชื่อ	คำอธิบาย
56 เครื่องกำเนิดไฟฟ้า Lorem ที่ไม่ซ้ำกัน	เพิ่มความสามารถในการเติมข้อความฟิลเลอร์และโครงการออกแบบด้วยเครื่องกำเนิดไฟฟ้า Lorem Ipsum ที่เฮฮาเหล่านี้
คู่มือบทคัดย่อสำหรับรหัสสถานะ HTTP	รายการและคำอธิบายของรหัสสถานะ HTTP
สุดยอด	รายการรายการที่ยอดเยี่ยมของรายการที่ยอดเยี่ยม
สุดยอดเยี่ยมมาก	รายการที่คัดสรรมาอย่างน่าอัศจรรย์สุดยอดอย่างน่าอัศจรรย์
ยอดเยี่ยมมาก	รายการที่รวบรวมไว้ในรายการที่คัดสรรมาอย่างดีของหลายหัวข้อ
bootstrap ทรัพยากรโดยเริ่ม bootstrap	รายการที่ครอบคลุมของ bootstrap และทรัพยากรที่เกี่ยวข้อง
Bootstrap ตัวอย่างโดยเริ่ม Bootstrap	ห้องสมุด Bootstrap 4 ตัวอย่างโค้ดที่สมบูรณ์แบบสำหรับการวางลงในโครงการของคุณโดยไม่ต้องดาวน์โหลดธีมทั้งหมด!
การออกแบบสิ่งจำเป็นคอลเล็กชัน GitHub	คอลเลกชันของไลบรารีการออกแบบนี้ดีที่สุดบนเว็บและจะทำให้ชุดเครื่องมือของคุณเสร็จสมบูรณ์สำหรับการออกแบบผลิตภัณฑ์ที่สวยงาม
การออกแบบทรัพยากรสำหรับนักพัฒนา	รายการทรัพยากรการออกแบบและ UI ฟรีสำหรับนักพัฒนารวมถึงภาพถ่ายสต็อกเทมเพลตเฟรมเวิร์กชุด UI เครื่องมือออนไลน์และอื่น ๆ อีกมากมาย
GitHub - โอเพนซอร์สโชว์	เรียกดูที่เก็บยอดนิยมตามหัวข้อที่คุณสนใจมากที่สุด
พื้นหลังการไล่ระดับสี	ในฐานะที่เป็นรายการของเว็บไซต์ไล่ระดับสีที่ดีที่สุดผ่านอินเทอร์เน็ตพื้นหลังการไล่ระดับสีช่วยให้คุณสำรวจลองและเลือกจากจานสีผสมที่สวยงามหลายร้อยรายการ
พื้นที่เก็บข้อมูลปลั๊กอิน JavaScript	เครื่องมือวานิลลา JS สำหรับการเขียนเว็บแอปพลิเคชันที่ทรงพลังโดยไม่ต้อง jQuery
ดินแดนจาวาสคริปต์	แคตตาล็อก jster javascript
การเขียนแบบจาวาสคริปต์	ฐานข้อมูลของไลบรารี JavaScript เฟรมเวิร์กและปลั๊กอิน
Libraries.io	บริการการค้นพบโอเพ่นซอร์ส
รายการรหัสสถานะ HTTP	รายการรหัสสถานะการตอบสนอง Hypertext Transfer Protocol (HTTP)
URL ส่วนแบ่งทางสังคม	โครงการนี้มีวัตถุประสงค์เพื่อช่วยให้คุณรวมการแบ่งปันบนโซเชียลมีเดียภายในรหัสของคุณ
ภาพถ่ายสต็อกที่ไม่ดูด	รายการสถานที่เพื่อค้นหาภาพถ่ายสต็อกฟรีที่ดีที่สุด
ตัวแก้ไขข้อความคอลเลกชัน GitHub	การแสดงของบรรณาธิการโอเพนซอร์สที่ยอดเยี่ยมน่าอัศจรรย์
ไม่เท่ากัน	ที่เก็บที่เป็นระเบียบของปลั๊กอิน jQuery ที่จัดอยู่ในหมวดหมู่

↥กลับไปด้านบน