web development resources

موارد تطوير الويب

قائمة أدوات وموارد الواجهة الأمامية مفتوحة المصدر لمصممي الويب والمطورين.

جدول المحتويات

• ويكي
• الأطر
• أطر تطبيقات الويب المحمولة
• المكونات الواجهة الأمامية
• موضوعات HTML5
• HTML Preprocessor
• CSS Preprocessor
• JavaScript Preprocessor
• إطار ساس
• Node.js ميزة الوحدة النمطية وحزم
• مكتبة جافا سكريبت
• الإضافات الفانيليا جافا سكريبت
• الإضافات jQuery
• مجموعة أدوات ضاغط JavaScript
• مكتبة CSS
• مكتبة SVG و PNG و Font Icons
• PNG ، JPEG ، مجموعة أدوات ضاغط GIF
• أشكال HTML
• أدوات الويب
• مكتبة CDN
• توافق المتصفح ويكي
• أدوات اختبار الاستجابة
• أدوات اختبار الأداء
• عنصر نائب
• النماذج النائبة
• أيقونات الموقع للمتصفحات
• قصاصات ودروس ملهمة مجانية
• مرجع CSS
• دروس CSS
• الرسوم البيانية
• إلهام التصميم
• نظام النوع
• أدوات مدير المواقع
• مدير الحزمة
• Jamstack
• قائمة قوائم القوائم

---

ويكي

اسم	وصف
معايير W3C	تحدد معايير W3C منصة ويب مفتوحة لتطوير التطبيقات التي لديها إمكانات غير مسبوقة لتمكين المطورين من بناء تجارب تفاعلية غنية ، مدعوم من متاجر بيانات شاسعة ، متوفرة على أي جهاز.
CSSDB	قائمة شاملة من ميزات CSS ومواقفها في عملية أن تصبح معايير الويب المنفذة.
مستندات الويب MDN	الموارد للمطورين ، من قبل المطورين.
مطورو الويب Google	بناء الجيل القادم من تجارب الويب.
W3Schools	دروس ويب على الانترنت.
CSS-Tricks	المقالات اليومية حول CSS و HTML و JavaScript وجميع الأشياء المتعلقة بتصميم الويب وتطويرها.
مجلة تحطيم	لمصممي الويب والمطورين.
webglossary.info	مصطلحات واسعة من مصطلحات تطوير الويب وتصميمها.

↥ العودة إلى الأعلى

الأطر

اسم	وصف
HTML5 Boilerplate	القالب الأمامي الأكثر شعبية على الويب.
bootstrap	Bootstrap هو إطار HTML و CSS و JS الأكثر شعبية لتطوير المشاريع الأولى المستجيبة للهاتف المحمول على الويب.
مؤسسة	الإطار الأمامي الأكثر استجابة تقدما في العالم.
-	-
قاعدة	إطار HTML/CSS الصخور الصخور.
basscss	مجموعة أدوات CSS منخفضة المستوى.
بولما	إطار CSS الحديث على أساس Flexbox.
إطار موجز	إطار عمل أمامي خفيف الوزن يوفر عددًا من الميزات الرائعة دون الانتفاخ.
الكاردينال	الكاردينال هو إطار CSS "Mobile-First" الذي تم تصميمه مع الأداء وقابلية التوسع في الاعتبار.
CSS اللغوية	تفكير إلى الأمام ، CSS micro-framework.
عصير	إطار CSS Flexbox.
تصميم المواد لايت	تنفيذ مكونات تصميم المواد في الفانيليا CSS و JS و HTML
تتحقق	إطار عمل أمامي حديث استجابة على أساس تصميم المواد.
فوتون	أسرع طريقة لبناء تطبيقات الإلكترون الجميلة باستخدام HTML و CSS البسيطة.
التمهيدي CSS	يقوم فريق GitHub Design Systems ببناء ويحافظ على التمهيدي.
نقي	مجموعة من وحدات CSS الصغيرة المستجيبة التي يمكنك استخدامها في كل مشروع ويب.
استجابة	إطار قوي ، يمكن الوصول إليه ، ومطور صديق لبناء مواقع ويب مستجيبة.
واجهة المستخدم الدلالية	إطار عمل يساعد على إنشاء تخطيطات جميلة مستجيبة باستخدام HTML الصديقة للإنسان.
التسكين	إطار مستجيب للوزن خفيفة الوزن لشبكة WWW.
هيكل عظمي	ميتة بسيطة وسريعة الاستجابة.
Tailwind CSS	إطار عمل CSS الأول للمنفعة لبناء تصاميم مخصصة بسرعة.
Uikit	إطار أمامي خفيف الوزن ومعيار لتطوير واجهات الويب السريعة والقوية.

↥ العودة إلى الأعلى

أطر تطبيقات الويب المحمولة

اسم	وصف
onsen واجهة المستخدم	أجمل طريقة وفعالية لتطوير تطبيقات الويب HTML5 الهجينة والهاتف المحمول.

↥ العودة إلى الأعلى

المكونات الواجهة الأمامية

اسم	وصف
Formstone	Formstone هي مجموعة من المكونات الواجهة الأمامية.
مكونات Le Wagon UI	-

↥ العودة إلى الأعلى

موضوعات HTML5

اسم	وصف
bootstrap بداية	حرة Bootstrap Starter سمات وقوالب لبدء مشروعك.
HTML5 فارغة موضوع WordPress	أفضل موضوع HTML5 WordPress Boilerplate ، الذي لاحظه Adobe ، Smashing Mag ، .NET MAG.
HTML5 UP!	قوالب موقع HTML5 و CSS3 المستجيبة.
بدء bootstrap	مكتبة مجانية لتنزيل موضوعات وقوالب bootstrap.

↥ العودة إلى الأعلى

HTML Preprocessor

اسم	وصف
هامل	لغة ترميز التجريد HTML
تخفيض السعر	أداة تحويل النص إلى HTML لكتاب الويب.
نحيل	محرك templating خفيفة الوزن.
يشم	محرك قالب العقدة.

↥ العودة إلى الأعلى

CSS Preprocessor

اسم	وصف
أقل	عقدة CSS قبل المعالجة
SCSS / ساس	الأكثر نضجا ، واستقرار ، وقوة لغة تمديد CSS من الدرجة المهنية في العالم.
القلم	التعبيرية ، الديناميكية ، القوية ، معالج CSS الغني بالميزات.
postcss	أداة لتحويل CSS مع JavaScript.

↥ العودة إلى الأعلى

JavaScript Preprocessor

اسم	وصف
Coffescript	القليل من اللغة التي تجمع في جافا سكريبت.
Livescript	لغة تجمع إلى جافا سكريبت.
TypeScript	JavaScript التي تقترب.
بابل	المترجم لكتابة الجيل القادم JavaScript.

↥ العودة إلى الأعلى

أطر العمل

اسم	وصف
بوربون	مكتبة Mixin بسيطة وخفيفة الوزن لـ Sass.
بوصلة	إطار تأليف CSS مفتوح المصدر.
سوسي	محرك تخطيط مخصص لساس.

↥ العودة إلى الأعلى

Node.js ميزة الوحدة النمطية وحزم

اسم	وصف
NPM	مدير الحزمة لجافا سكريبت.
-	-
المتصفح	require() طريقة العقدة
الناخر	عداء مهمة JavaScript
بلع	نظام بناء البث
قطعة	اشتعلت بسرعة ، حزمة تطبيق ويب التكوين صفر.
Rollup	الجيل التالي من وحدة ES Bundler.
WebPack	حزمة لجافا سكريبت والأصدقاء.
-	-
eslint	ابحث عن المشكلات وإصلاحها في رمز JavaScript الخاص بك.
أجمل	أجمل هو رمز الرأي تنسيق.
Stylelint	يخطئ قوي وحديث يساعدك على تجنب الأخطاء وفرض الاتفاقيات في أنماطك.
الالتزام	؟ ارتكاب الوبر رسائل
Linkinator	زاحف موقع بسيط للغاية ومدقق رابط مكسور.
-	-
متصفح	الحفاظ على متعددة المتصفحات والأجهزة متزامنة عند بناء مواقع الويب.
http-server	سطر أوامر بسيط ، سطر أوامر ، خادم HTTP.
يخدم	ملف ثابت وخدمة الدليل.
server.js	خادم بسيط وقوي لـ Node.js
-	-
Chokidar	غلاف فعال حول node.js fs.watch / fs.watchfile / fsevents.
Nodemon	رصد أي تغييرات في تطبيق Node.js الخاص بك وإعادة تشغيل الخادم تلقائيًا - مثالي للتطوير.
onchange	استخدم أنماط Glob لمشاهدة مجموعات الملفات وتشغيل أمر عند إضافة أي شيء أو تغييره أو حذفه.
-	-
في وقت واحد	تشغيل الأوامر في وقت واحد. مثل npm run watch-js & npm run watch-less ولكن أفضل.
NPM-RUN-ALL	أداة CLI لتشغيل العديد من NPM-scripts بالتوازي أو متسلسل.
قذيفة موازية	وحدة NPM بسيطة للغاية لتشغيل أوامر shell بالتوازي.
-	-
CONCAT	Concatenate عدة ملفات.
CPY-CLI	نسخ الملفات للعقدة.
ديل	حذف الملفات والأدلة باستخدام الكرات.
يعبر	إطار الويب السريع ، غير المبين ، الحد الأدنى من الإطار على شبكة الإنترنت للعقدة.
العقدة	يسمح لك بتجميع ملفات .SCSS أصليًا إلى CSS بسرعة لا تصدق وتلقائيًا عبر الوسيطة الوسيطة.
NPM-check-updates	ترقية تبعيات الحزمة الخاصة بك. json إلى أحدث الإصدارات ، متجاهلة الإصدارات المحددة.
Purgecss	Purgecss هي أداة لإزالة CSS غير المستخدمة.
rimraf	أمر UNIX rm -rf للعقدة.
-	-
باور [ انخفاض ]	مدير الحزمة للويب.

↥ العودة إلى الأعلى

مكتبة جافا سكريبت

اسم	وصف
jQuery	الكتابة أقل ، تفعل المزيد ، مكتبة جافا سكريبت.
Modernizr	يخبرك Modernizr بما يتميز به HTML و CSS و JavaScript الذي يقدمه متصفح المستخدم.
-	-
Bliss.JS	هل تريد استخدام الفانيليا JS ولكن العثور على واجهات برمجة التطبيقات الأصلية غير عملي قليلاً؟ النعيم لك.
المظلة ي	☔ مكتبة JavaScript خفيفة الوزن لمعالجة DOM والأحداث.
Zepto JS	Zepto هي مكتبة JavaScript الحد الأدنى للمتصفحات الحديثة مع واجهة برمجة تطبيقات متوافقة مع JQuery إلى حد كبير.
النقدية ي	بديل jQuery صغير السخيف للمتصفحات الحديثة.
تشيبي ي	مكتبة صغيرة جافا سكريبت

↥ العودة إلى الأعلى

الإضافات الفانيليا جافا سكريبت

اسم	وصف
Anchor.JS	أضف روابط مرساة عميقة إلى مستنداتك.
anime.js	anime.js (/ˈæn.ə.me/) هي مكتبة الرسوم المتحركة JavaScript خفيفة الوزن مع واجهة برمجة تطبيقات بسيطة ولكنها قوية. إنه يعمل مع خصائص CSS ، SVG ، سمات DOM وكائنات JavaScript.
Chart.JS	مخططات بسيطة ونظيفة وجذابة للمصممين والمطورين.
chartist.js	الرسوم البيانية البسيطة الاستجابة.
(أ) darkmode.js (ب) مفتاح وضع الظلام	؟ أضف وضعًا مظلمًا / وضعًا ليليًا إلى موقع الويب الخاص بك في بضع ثوانٍ
السرعة	تسارع javaScript الرسوم المتحركة.
favico.js	استفد من Favicon الخاص بك مع الشارات أو الصور أو مقاطع الفيديو.
fluidvids.js	وحدة مقاطع الفيديو عرض السوائل (استجابة) ، 1 كيلو بايت ، اللاعبين المخصصين ، عناصر ديناميكية/دعم XHR.
تسليط الضوء على	Aightly.js هو أداة تمييز بناء جملة مكتوب في JavaScript.
headroom.js	إخفاء رأسك حتى تحتاج إليه.
حامل	العميل الجانبي للصور نائبة.
lazysizes.js	الأداء العالي وعمليات تحسين محركات البحث (SEO) LAZY LOADER للصور (استجابة وطبيعية) ، والإحالة والمزيد.
Littlefoot.js	Littlefoot هي مكتبة JavaScript خفيفة الوزن تنشئ حواشي استثنائية.
Lunr.JS	البحث عن النص الكامل البسيط في متصفحك.
nprogress.js	شريط التقدم النانوي.
PACE.JS	شريط التقدم التلقائي لصفحة الويب.
Prism.JS	Prism هي مكتبة بناء جملة خفيفة الوزن وقوية وأنيقة.
رد فعل بورغر مينو	مكون الشريط الجانبي خارج Canvas مع مجموعة من التأثيرات والأنماط باستخدام انتقالات CSS والرسوم المتحركة Path Path.
NAV مستجيبة	المكوّن الإضافي للتنقل المستجيب بدون تبعيات المكتبة ودعم الشاشة السريعة للمس.
slideout.js	قائمة التنقل Slideout Touch لتطبيقات الويب الخاصة بك.
smartcrop.js	محتوى إدراك الصورة زراعة.
تابيلا	جدول استجابة.
حبل	مكتبة JavaScript لإقامة عنصر مخصص تمامًا في وضعه بجوار عنصر آخر على الصفحة.
tippy.js	مكتبة أدوات جافا سكريبت خفيفة الوزن.
Tooltip.js	Tooltip.js هي مكتبة JavaScript و CSS لإنشاء تلميحات الأدوات القابلة للتصميم.
turbolinks	يجعل Turbolinks® التنقل في تطبيق الويب الخاص بك بشكل أسرع.
الأنسجة	المعالج المسبق للطباعة لـ HTML الخاص بك والذي يستخدم JavaScript من جانب العميل.
Zeroclipboard.js	طريقة سهلة لنسخ النص إلى الحافظة.

↥ العودة إلى الأعلى

الإضافات jQuery

اسم	وصف
Formstone - خلفية	مكون إضافي jQuery لخلفيات الصور والفيديو كاملة الإطار.
bigfoot.js	البرنامج المساعد jQuery لتمكين الحواشي.
bigslide.js	مكونات جاكري لوحة شريحة صغيرة مع أحلام كبيرة.
fitvids.js	مكونات مكوّنة خفيفة الوزن وسهلة الاستخدام لفيديو عرض السوائل.
fullpage.js	صفحة واحدة تمرير SCROLL SITE PLUCIN.
حمولة كسول	الحمل الكسول هو تأخير تحميل الصور في صفحات الويب الطويلة.
ليتي	مكون إضافي لضوء Lightbox الخفيف للغاية ، ويمكن الوصول إليه وسريع الاستجابة والذي يدعم الصور والإطارات والمحتوى المضمّن خارج المربع.

↥ العودة إلى الأعلى

مجموعة أدوات ضاغط JavaScript

اسم	وصف
تيرسر	؟ JavaScript Parser و Mangler و Attairs Tools for ES6+
uglifyjs	UglifyJS هو محلل جافا سكريبت ، Minifier ، الضاغط ومجموعة أدوات التجميل.

↥ العودة إلى الأعلى

مكتبة CSS

اسم	وصف
animate.css	مكتبة متصفح من الرسوم المتحركة CSS.
CSSGRAM	مكتبة صغيرة (<1kb gzipped!) لإعادة إنشاء مرشحات Instagram مع مرشحات CSS وأنماط مزيج.
CSS Filters Playground	العب مع تأثيرات مرشح CSS3 الجديدة.
EQCSS	مواصفات لبناء بناء جملة استعلام عناصر على غرار الحاوية في CSS.
شبكة مرنة	نظام الشبكة يعتمد على خاصية Display Flex.
إتقان :nth-child	CSS3 فصول Pseudo و: نطاقات Nth-Child.
إعادة تعيين إريك ماير CSS	إعادة تعيين إريك ماير CSS
غراف	تراكبات شبكة CSS النقية للتصميم.
الهامبرغر	الهامبرغر اللذيذ CSS.
نظام شبكة مولر	نظام الشبكة المعياري للتخطيطات المستجيبة/التكيفية وغير المستجيبة ، استنادًا إلى البوصلة.
تطبيع. CSS	بديل عصري ، HTML5 جاهز لإعادة ضبط CSS.
RTLCSS	إطار لتحويل أوراق نمط متتالية من اليسار إلى اليمين (CSS) إلى اليمين إلى اليسار (RTL).
نخب	جنون ، لا معنى له شبكة CSS.
csswand	إنها في الحقيقة مجرد حفنة من مكتبة الرسوم المتحركة البسيطة القائمة على CSS
water.css	مجموعة من الأساليب لصنع مواقع ويب بسيطة
Raisin CSS	فائدة CSS فقط مكتبة.
الطيف CSS	تنفيذ CSS القياسي للغة تصميم الطيف للطرف الداخلي والثالث
box-shadows.css	تعتمد على ظلال الصندوق

↥ العودة إلى الأعلى

مكتبة SVG و PNG و Font Icons

اسم	وصف
كيفية العمل مع أيقونات SVG	-
قم بمحاذاة أيقونات SVG للنص وداعًا لأيقونات الخطوط	-
-	-
رموز bootstrap	أيقونات bootstrap هي SVGs ، لذلك تتوسع بسرعة وسهولة ويمكن تصميمها مع CSS. على الرغم من أنها مصممة من أجل bootstrap ، فإنها ستعمل في أي مشروع.
أيقونات ترخيص العموم الإبداعية	قم بتنزيل رموز ترخيص SVG و EPS و PNG Creative Commons لاستخدامها في موقعك.
ففلاتيون	أكبر قاعدة بيانات للأيقونات المجانية المتوفرة في تنسيقات PNG و SVG و EPS و PSD و BASE 64.
ريشة	Feather عبارة عن مجموعة من أيقونات المصدر المفتوح الجميلة ببساطة.
الخط رائع	مجموعة أدوات الخط الأيقونية و CSS.
خط الهجوم SVG-PNG	Font Awesome Split to SVG و PNG Files من أحجام مختلفة جنبا إلى جنب مع مولد Node.js.
fontforge	محرر خط مجاني ومفتوح المصدر جلبه لك مجتمع من زملائه من عشاق النوع.
فونتيلو	طريقة سهلة لإنشاء خط رمز مخصص لموقعك. حدد الصور من مجموعتنا الكبيرة ، وقم بعمل حزمة WebFont بنقرة واحدة.
icomoon	يوفر Icomoon مجموعة من أيقونات المتجهات ، إلى جانب تطبيق HTML5 مجاني لصنع خطوط رمز مخصصة أو Sprites SVG. تصفح بين الآلاف من الرموز المثالية للبكسل أو استيراد المتجهات الخاصة بك.
الأيوني	خط الرمز المميز للإطار الأيوني.
أيقونات تصميم المواد	عرض جميع أيقونات تصميم المواد وأكثر من المجتمع.
القائمة الكبيرة من الرموز المسطحة والأيقونات من قبل CSS-TRIKS	هناك العديد من هذه الجولات. هذا واحد لي.
مشروع الاسم - أيقونات لكل شيء	ما يقرب من مليون رموز برعاية ، أنشأها مجتمع عالمي.
الثمن	خط رمز قابل للتطوير يدويًا مع <3 بواسطة Github.
أيقونات مثالية	أسهل طريقة لخلق قرار أيقونات اجتماعية مستقلة.
أيقونات بسيطة	أيقونات SVG مجانية للعلامات التجارية الشعبية.
SVG-ICON	مجموعة الرموز SVG النهائية التي تم القيام بها بشكل صحيح.
الرموز SVG	جاهز لاستخدام أيقونات SVG للويب.
رموز المتجهات Roundup	مقارنة جنبًا إلى جنب بين خطوط الأيقونات الشعبية.
نحن نحب خطوط الأيقونة	خدمة استضافة الأيقونات المجانية والمفتوحة المصدر لأغراض الاختبار.

↥ العودة إلى الأعلى

PNG ، JPEG ، مجموعة أدوات ضاغط GIF

اسم	وصف
tinyjpg	Smart WebP و JPEG و PNG ضغط
ضغط PNG	-
ضغط JPEG	-
ضغط GIF	-

↥ العودة إلى الأعلى

أشكال HTML

اسم	وصف
Chartspree	جعل المخططات في ثوان.
formspree	أشكال HTML الوظيفية للمواقع الثابتة.
الشبكة	اعرض بيانات جدول البيانات الخاصة بك ولكنك تحب مباشرة على موقعك الثابت مع جدول بيانات Google.
Jotform	نموذج البناء
WTF ، أشكال؟	أدوات التحكم في شكل HTML الأكثر ودية مع القليل من السحر CSS. تم تصميمه لـ IE9+، بالإضافة إلى أحدث Chrome و Safari و Firefox.
wufoo	منشئ النماذج عبر الإنترنت مع قاعدة بيانات التخزين السحابية.

↥ العودة إلى الأعلى

أدوات الويب

اسم	وصف
API التجريدي	مجموعة من واجهة برمجة تطبيقات الأداة المساعدة البسيطة والمتطورة للمطورين ، مثل التحقق من صحة البريد الإلكتروني ، ومولد الصورة الرمزية للمستخدم ، وضغط الصور ، وأكثر من ذلك. جميع API لها نسخة مجانية.
الذروة التلقائية	رسم سريع للجميع. أزواج الذروة التلقائية التعلم الآلي مع رسومات من الفنانين الموهوبين لمساعدتك في رسم الأشياء بسرعة.
مترجم ثنائي	مترجم رمز ثنائي مجاني ، ترجمة الكود الثنائي إلى النص.
BASE16	بنية لبناء الموضوعات بناءً على بناء جملة تم اختيارها بعناية باستخدام قاعدة من ستة عشر لونًا.
ورقة الغش 5 bootstrap	قائمة تفاعلية من فئات Bootstrap 5 والمتغيرات والمزيج.
Colors.css	ألوان افتراضية أفضل للويب. مجموعة من فصول الجلد للنماذج الأسرع والمواقع الأكثر مظهرًا.
رموز ألوان سداسي عشرية	يعطي Color Hex معلومات حول الألوان بما في ذلك نماذج الألوان (RGB ، HSL ، HSV و CMYK) ، والألوان الثلاثي ، والألوان أحادية اللون والألوان المماثلة المحسوبة في صفحة الألوان.
مطاردة اللون	مجموعة منسقة من الألوان الجميلة ، محدثة يوميا.
مولد CSS3	CSS3 الكلاسيكيات
cssmatic	أدوات CSS النهائية لمصممي الويب.
Draw.io	Draw.io هو برنامج مخطط مجاني عبر الإنترنت لصنع مخططات انسيابية ، مخططات عملية ، مخططات ORG ، UML ، ER ومخططات الشبكة.
ألوان مسطحة	تصفح أكثر من 11000 لون مسطح في أكثر من 2300 لوحة ألوان مسطحة. انسخها أو قم بتنزيل ملف .ACO للاستخدام في Photoshop.
أدوات تطوير الواجهة الأمامية للعقيدة	الأدوات القائمة على الويب المنسقة لمطوري ومالكي المواقع ، للتحليل والاستكشاف.
خلفيات التدرج	كقائمة منسقة لأفضل مواقع الويب التدرج عبر الإنترنت ، تتيح لك الخلفيات التدرجية الاستكشاف ، ومحاولة الاختيار من بين مئات من لوحات الألوان المخلوطة الجميلة.
معالج التصميم: واجهات برمجة تطبيقات خرائط Google	تخصيص الألوان والطرق والعلامات والمزيد. ثم استخدم أسلوبك المخصص في مشروع منصة Google Maps.
خرائط snazzy	مستودع لأساليب مختلفة لخرائط Google التي تهدف إلى مصممي الويب والمطورين.
Solarized - ألوان دقيقة للآلات والأشخاص	Solarized هي لوحة ألوان ستة عشر (ثمانية أحجار ، ثمانية ألوان لهجة) مصممة للاستخدام مع تطبيقات الطرفية و GUI.
مولر التجزئة سري	يوصى باستخدام SRI كأفضل ممارسات ، كلما تم تحميل المكتبات من مصدر طرف ثالث.
Superdomain	تحقق من توفر المجال.
قم بإنشاء طاولات LaTex عبر الإنترنت	قم بإنشاء طاولات مطاطية معقدة بسرعة مع مولد عبر الإنترنت - يتم دعم الخلايا المدمجة مع تحرير الحدود.
uigradains	مجموعة مختارة من التدرجات الملونة الجميلة للمصممين والمطورين.
غير معبأ	أداة مجانية عبر الإنترنت لإلغاء تحديد (Unpack و Deobfuscate) JavaScript و CSS ورمز HTML ، مما يجعلها قابلة للقراءة وجميلة.
أدوات رمز الويب	CSS3 و HTML5 و Microdata و Open Graph و Twitter Card Generators
ما هو دقة الشاشة	أداة عبر الإنترنت للتحقق من دقة الشاشة لأي جهاز عرض.
WebGradients	مجموعة مجانية من تدرجات الخلفية التي يمكنك استخدامها كخلفيات المحتوى في أي جزء من موقع الويب الخاص بك.

↥ العودة إلى الأعلى

مكتبة CDN

اسم	وصف
bootstrapcdn	CDN الموصى به لـ Bootstrap ، Font Awesome و Bootswatch.
CDNJS	CDN المجاني والمفتوح للمكتبات ذات الصلة على الويب لتسريع موقع الويب الخاص بك!
كورالكدن	تتألف شبكة توزيع محتوى مجانية ومفتوحة حول تقنيات نظير إلى نظير ، تتألف من شبكة عالمية من وكلاء الويب وخوادم الأسماء.
fontcdn	أداة بحث عن Google Web Fonts.
خطوط جوجل	مئات من الخطوط المجانية المفتوحة المصدر المحسنة للشبكة.
المكتبات المستضافة جوجل	شبكة توزيع محتوى مستقرة وموثوقة وعالية السرعة ومتاحة عالميًا لمكتبات JavaScript الأكثر شعبية ومصدر.
JSDelivr	CDN فائقة السرعة المجانية للمطورين ومشرفي المواقع.
Microsoft Ajax CDN	مكتبات JavaScript الشائعة مثل JavaScript مثل JQuery وتمكنك من إضافتها بسهولة إلى تطبيقات الويب الخاصة بك.
برنامج مفتوح المصدر CDN	برنامج مفتوح المصدر CDN بواسطة maxcdn.
Yandex CDN	تستضيف الخدمة مكتبات JavaScript التي توفر لمطوري الموقع إمكانية الوصول إلى تسليم محتوى Yandex (CDN) ويمكنه التعامل مع مجموعة متنوعة من المصادر المفتوحة JavaScript-Frameworks والمكتبات من خوادم Yandex.

↥ العودة إلى الأعلى

توافق المتصفح ويكي

اسم	وصف
هل يمكنني استخدام	تحقق من توافق المتصفح لخصائص CSS3 و HTML5.
هل يجب علي البادئة	ما عليك سوى إظهار البادئات المطلوبة لخاصية CSS الأحدث.

↥ العودة إلى الأعلى

أدوات اختبار الاستجابة

اسم	وصف
هل أنا مستجيبة؟	تعرف على كيف ينظر موقعك على سطح المكتب والكمبيوتر المحمول و iPad و iPhone.
التصفح	استخدم اختبار جهاز المستعرض وقم بتنزيل صور Internet Explorer لـ VM.
DevicePonsive	اعرض معاينة سريعة لموقع الويب الخاص بك استجابة لقرارات الأجهزة المختلفة مثل MacBook أو iPad أو iPhone. شارك هذه المعاينة مع عميلك.
التطبيق استجابة	DevTool يجب أن يكون لمطوري الويب لتطوير الويب أسرع مستجيبة.

↥ العودة إلى الأعلى

أدوات اختبار الأداء

اسم	وصف
Google PageSpeed ​​Tools	تقوم أدوات PageSpeed ​​بتحليل موقعك وتحسينه بعد أفضل الممارسات على الويب.
WebPagetest	قم بتشغيل اختبار سرعة موقع الويب المجاني من مواقع متعددة في جميع أنحاء العالم باستخدام متصفحات حقيقية وبسرعة اتصال مستهلك حقيقية.
اختبار سرعة الموقع	استخدم اختبار سرعة الموقع المجاني هذا لتحليل سرعة تحميل مواقع الويب الخاصة بك ، وتعلم كيفية جعلها أسرع.

↥ العودة إلى الأعلى

عنصر نائب

اسم	وصف
JSonplaceholder	واجهة برمجة تطبيقات الراحة المزيفة على الإنترنت للاختبار والنماذج الأولية
لوريم Ipsum	Lorem ipsum هو ببساطة نص وهمية لصناعة الطباعة والأنشاش.
Lorempixel	صور العنصر النائب لكل حالة.
التمهيات	خدمة نائبة للصورة سريعة وبسيطة.

↥ العودة إلى الأعلى

النماذج النائبة

اسم	وصف
مكان	أفضل ما لإسقاط مشروعك في أي سياق جهاز.

↥ العودة إلى الأعلى

أيقونات الموقع للمتصفحات

اسم	وصف
مولد فافيكون	مولد فافيكون على الانترنت. لريال مدريد.
بناء موقعي المثبت	أداة عبر الإنترنت لإنشاء بلاط شاشة بدء تشغيل Windows مخصص لموقعك في أقل من دقيقة.
تحسينات المواقع المثبتة على Windows / إنشاء بلاطات مخصصة لمواقع IE11	إعداد البلاط والإشعارات الحية لنظام التشغيل Windows
تكوين تطبيقات الويب لـ Apple	المعلومات والتقنيات المفاهيمية حول إنشاء محتوى ويب فعال لـ Safari و WebKit باستخدام HTML و CSS.
تطبيقات الويب القابلة للتثبيت مع بيان تطبيق الويب في Chrom	استخدم بيان تطبيق الويب للتحكم في كيفية تشغيل تطبيق الويب الخاص بك.

↥ العودة إلى الأعلى

قصاصات ودروس ملهمة مجانية

اسم	وصف
Codemyui	قصاصات التعليمات البرمجية المختار بعملية يمكنك استخدامها في مشاريع الويب الخاصة بك. ابحث عن مصدر إلهام لتصميم الويب مع عينات التعليمات البرمجية.
كوديهاوس	مكتبة مجانية من HTML ، CSS ، JS Nuggets.
codrops	Codrops هي مدونة لتصميم الويب وتطويرها تنشر مقالات وبرامج تعليمية حول أحدث اتجاهات الويب والتقنيات والإمكانيات الجديدة.
الانتقال إلى HTTPS	ترحيل من HTTP إلى HTTPS بسهولة.
نافناف	هناك الكثير من أمثلة التنقل المستجيبة لـ CSS و JQuery و JavaScript والعروض التجريبية والتعليمية من جميع أنحاء الويب.
Papersizes.io - أفضل مورد لأحجام الورق	مورد بسيط مجاني لإيجاد المعايير الدولية لأحجام الورق في المقياس والإمبراطوري.
حلوى PDF	تحرير ملفات PDF مع PDF Candy - محرر PDF مجاني عبر الإنترنت. تحويل PDF إلى Word ، PDF إلى JPG ، دمج PDF ، تقسيم PDF ، ضغط PDF ، إلخ.
سكوتش	مدونة لتطوير الويب تناقش كل الأشياء البرمجة والتطوير والويب والحياة.
مجلة تحطيم	مجلة على الإنترنت لمصممي الويب والمطورين المحترفين ، مع التركيز على التقنيات المفيدة وأفضل الممارسات والموارد القيمة.
دروس ويب عبر الإنترنت W3Schools	أكبر موقع لمطور ويب في العالم.

↥ العودة إلى الأعلى

مرجع CSS

اسم
موزيلا ويب مستندات
مستندات CSS DEV
فهرس خصائص CSS
مرجع CSS
مرجع CSS - codrops
تَخطِيط :
Flexbox - حيل CSS
شبكة CSS - حيل CSS
ملعب CSS Flexbox بواسطة Gabi
Flexbox Froggy
حديقة شبكة CSS
الرسوم المتحركة CSS :
باستخدام الرسوم المتحركة CSS - MDN
الرسوم المتحركة - حيل CSS

↥ العودة إلى الأعلى

دروس CSS

اسم	وصف
المتصفح خطوط آمنة	الخطوط الشائعة لجميع إصدارات Windows & Mac المكافئات.
مكدس الخط CSS	مجموعة كاملة من مداخن خط CSS الآمن على الويب.
خاصية مخطط CSS - الخطوط العريضة: لا شيء ومخطط: 0	خاصية مخطط CSS هي متطلبات إمكانية الوصول ، ولكنها في كثير من الأحيان تعرضها العديد من مصممي الويب ، لماذا يفعلون ذلك؟
مرجع CSS المحدد	في CSS ، فإن المحددات هي أنماط مستخدمة لتحديد العناصر (العناصر) التي تريد نمطها.
خصوصية CSS	خصوصية CSS. يعين خصوصية CSS تمثيلًا رقميًا لمحدد من أجل المقارنة في حالة وجود تعارضات في الأناقة. يعرض ملصق الويب خصوصية CSS مع أيقونات من فيلم Stanley Kubrick's "The Shining".
الشبكة بالقدوة	كل ما تحتاجه لتعلم تخطيط شبكة CSS.
حديقة الشبكة	لعبة لتعلم شبكة CSS.
شبكات	تعلم شبكة CSS!
روابط علامة التجزئة التي لا تبرز نافذة المتصفح	CSS-Tricks Post by Chris Coyier.
تعلم شبكة CSS	دليل لتعلم شبكة CSS.
تعلم شبكة CSS	الكثير من الموارد الرائعة التي كتبها جين سيمونز.
تعلم تخطيط CSS	يقوم هذا الموقع بتدريس أساسيات CSS المستخدمة في تخطيط أي موقع ويب.
تجاوز لون اختيار النص الافتراضي مع CSS	CSS-Tricks Post by Chris Coyier.
يرتبط الرابط الأكثر ذكاءً لكل موقع ويب	بعد آدم شوارتز.
ما هو لون خلفية المتصفح-الافتراضي عند اختيار النص؟	إجابة على verflow
لماذا تحولت من أقل إلى ساس؟	بعد هوغو جيروديل.

↥ العودة إلى الأعلى

الرسوم البيانية

اسم	وصف
ملصقات المكتب المنزلي	مستودع المكاتب المنزلية للملصقات التي تغطي مواضيع مختلفة - البحث ، احتياجات الوصول ، إمكانية الوصول ، التصميم.

↥ العودة إلى الأعلى

إلهام التصميم

اسم
معجب بالويب
أوواردز
بهزان
أفضل معرض موقع ويب
Codepen
معرض CSS
الفائز CSS
تصميم الثلاجة
Deviantart
سال لعابه
جوائز الموقع المفضل (FWA)
Goodui
تصميم جوجل
HTML إلهام
مصدر إلهام لبحث تأثيرات واجهة المستخدم
صفحة واحدة الحب
جميل واحد أحب
Siiimple
أفضل التصميمات
مواقع جميلة جدا
إلهام تصميم الويب
WebDesign - بحث Tumblr

↥ العودة إلى الأعلى

نظام النوع

اسم	وصف
استكشاف مقاييس النوع المستجيب	العثور على إيقاع (مناسب ، متعدد الجهد ورأسي)
زوج الخط	يساعد Pont Pair المصممين في إقران خطوط Google معًا. توليفات خطوط Google الجميلة والأزواج.
إنشاء موازين نوع مع stackswell	وفر الوقت مع أحدث إصدار من Stackswell وإنشاء أنظمة النوع في ثوان!
نظام تصميم المواد	استخدم الطباعة لتقديم التصميم والمحتوى الخاص بك بشكل واضح وكفاءة قدر الإمكان.
مقياس وحدات	حساب وتصور والتعرف على المقاييس المعيارية.
اكتب الاتصال	TYPE CONNECTION هي لعبة تساعدك على تعلم كيفية إقران المحاكاة.
الطباعة للمطورين	ويهدف هذا كدليل عملي للمطورين لتعلم طباعة الويب.
الآلة الكاتبة	ما يتجه في النوع
مقياس الكتابة - آلة حاسبة مرئية	معاينة واختر مقياس النوع الصحيح لمشروعك. تجربة مع حجم الخط ، المقياس و webfonts مختلفة.
Whatfont - تمديد الكروم	أسهل طريقة لتحديد الخطوط على صفحات الويب.

↥ العودة إلى الأعلى

أدوات مدير المواقع

اسم	وصف
schema.org	نشاط مجتمعي تعاوني مع مهمة لإنشاء مخططات وصيانتها والترويج لها للبيانات المنظمة على الإنترنت ، على صفحات الويب ، في رسائل البريد الإلكتروني ، وما بعدها.
التنسيقات الدقيقة	أبسط طريقة لتمييز المعلومات المنظمة في HTML.
فهم كيفية عمل البيانات المنظمة	تصف هذه الوثائق الخصائص المطلوبة أو الموصى بها أو اختياري للبيانات المنظمة ذات المعنى الخاص لبحث Google.
أداة اختبار البيانات المنظمة بواسطة Google	أداة اختبار البيانات المنظمة من Google.
PageSpeed ​​Insights by Google	اجعل صفحات الويب الخاصة بك بسرعة على جميع الأجهزة.
JSON لربط البيانات	البيانات فوضوية وفكابة. JSON-LD تنظمها وتوصيلها ، وإنشاء شبكة أفضل.
JSON-LD	ويكي
مكتشف خط العرض وخط الطول	Latitude وعرض الطول هما الوحدات التي تمثل الإحداثيات في نظام الإحداثيات الجغرافية. لإجراء بحث ، استخدم اسم مكان أو مدينة أو ولاية أو عنوان ، أو انقر فوق الموقع على الخريطة للعثور على إحداثيات طويلة.

↥ العودة إلى الأعلى

مدير الحزمة

اسم	وصف
قائمة أنظمة إدارة حزم البرامج	هذه قائمة بأنظمة إدارة حزم البرمجيات ، والتي تم تصنيفها أولاً حسب تنسيق الحزمة (الثنائي ، الرمز المصدر ، المختلط) ثم عن طريق عائلة نظام التشغيل.
شقة	Debian مقرها Linux OS Manager.
نعم	Fedora مقره Linux OS Manager.
البيرة	Homebrew هو نظام إدارة الحزم يقوم بتبسيط تثبيت البرامج على نظام تشغيل MacOS من Apple و Linux.
وينجيت	يعد Windows Package Manager (AKA Winget) مدير حزمة مجاني ومفتوح المصدر مصمم لـ Microsoft Windows 10.
الشوكولاتة	Chocolatey هو مدير حزمة على مستوى الماكينة ومثبت حزم البرامج ، تم تصميمه لمنصة Windows.
Goenv	تهدف Goenv إلى أن تكون بسيطة قدر الإمكان واتباع نموذج إدارة الإصدار الناجح بالفعل من Pyenv و RBENV.
NPM	NPM (قصير في الأصل لمدير حزمة العقدة) هو مدير حزمة للغة البرمجة JavaScript.
NODENV	استخدم NODENV لاختيار إصدار عقدة لتطبيقك وضمان أن بيئة التطوير الخاصة بك تتطابق مع الإنتاج.
بينينف	يتيح لك Pyenv التبديل بسهولة بين إصدارات متعددة من Python.
غزل	الغزل هو بديل لـ NPM.
RVM	RVM هي أداة سطر أوامر تتيح لك تثبيت بيئات روبي متعددة من المترجمين المترجمين المترجمين إلى مجموعات من الأحجار الكريمة.
Rbenv	استخدم RBENV لاختيار إصدار Ruby لتطبيقك وضمان أن بيئة التطوير الخاصة بك تتطابق مع الإنتاج.

↥ العودة إلى الأعلى

Jamstack

اسم	وصف
NetLify	نشر مواقع الويب الثابتة الحديثة مع NetLify. احصل على CDN ، والنشر المستمر ، و 1 انقر فوق HTTPS ، وجميع الخدمات التي تحتاجها. ابدأ مجانًا.
Staticgen	أعلى قائمة مولدات الموقع الثابتة مفتوحة المصدر.
staticman	Staticman هو تطبيق node.js يتلقى محتوى تم إنشاؤه بواسطة المستخدم ويقوم بتحميله كملفات بيانات إلى مستودع github و/أو gitlab.
Gitalk	مكون تعليق حديث يعتمد على قضية GitHub و Preact.
الكلام	تعليقات خفيفة الوزن القطعة المبنية على قضايا جيثب. استخدم مشكلات GitHub لتعليقات المدونة ، صفحات الويكي وأكثر من ذلك!

↥ العودة إلى الأعلى

Cheatsheet؟

اسم
صفحات TLDR
TLDR inbrowser.app
tldr-book.pdf
أوامر Brew Basic - Devsheet
Cheat.sh
devhints
حبيبية الغش في البيرة
يدوي جيثب كلي
Marmdown Cheatsheet
جيثب شيت ورقة
Cheatsheet.md
Octonator على Twitter: "أضف .pibb إلى نهاية أي عنوان URL GIST من أجل الحصول على إصدار HTML فقط مناسب للتضمين في أي موقع آخر. http://t.co/HYTFQBM2DO"/Twitter

↥ العودة إلى الأعلى

قائمة قوائم القوائم

اسم	وصف
56 مولدات فريدة من نوعها	قم بتوابل مشاريع نص الحشو الخاصة بك وتصميمها مع مولدات Lorem Ipsum المرحة.
دليل مجردة لرموز حالة HTTP	قائمة وشرح رموز حالة HTTP
مذهل	قائمة منسقة من القوائم الرائعة.
رهيبة رهيبة	قائمة منسقة من الذهول الرائع المثير للدهشة.
رائع رائع	قائمة منسقة من القوائم المنسقة الرائعة للعديد من الموضوعات.
موارد bootstrap عن طريق بدء bootstrap	قائمة شاملة من bootstrap والموارد ذات الصلة.
قصاصات bootstrap عن طريق بدء bootstrap	مكتبة منسقة من قصاصات Bootstrap 4 Code ، مثالية للإسقاط في مشروعك دون تنزيل موضوع كامل!
أساسيات التصميم ، مجموعات جيثب	هذه المجموعة من مكتبات التصميم هي الأفضل على الويب ، وستكمل مجموعة أدواتك لتصميم المنتجات المذهلة.
موارد تصميم للمطورين	قائمة منسقة من موارد التصميم وواجهة المستخدم المجانية للمطورين بما في ذلك صور الأسهم ، والقوالب ، والأطر ، وأدوات واجهة المستخدم ، والأدوات عبر الإنترنت وأكثر من ذلك بكثير.
Github - يعرض المصدر المفتوح	تصفح المستودعات الشعبية بناءً على الموضوع الذي يثير اهتمامك أكثر.
خلفيات التدرج	كقائمة منسقة لأفضل مواقع الويب التدرج عبر الإنترنت ، تتيح لك الخلفيات التدرجية الاستكشاف ، ومحاولة الاختيار من بين مئات من لوحات الألوان المخلوطة الجميلة.
مستودع الإضافات JavaScript	أدوات الفانيليا JS لكتابة تطبيقات الويب القوية دون jQuery.
منطقة جافا سكريبت	كتالوج Jster JavaScript.
javascripting	قاعدة بيانات مكتبات JavaScript ، والأطر ، والمكونات الإضافية.
المكتبات	خدمة اكتشاف المصدر المفتوح.
قائمة رموز حالة HTTP	قائمة من رموز حالة استجابة بروتوكول نقل النص التشعبي (HTTP).
عناوين URL للمشاركة الاجتماعية	يهدف هذا المشروع إلى مساعدتك في دمج المشاركة على وسائل التواصل الاجتماعي ضمن الكود الخاص بك.
صور المخزون التي لا تمتص	قائمة الأماكن للعثور على أفضل صور مخزون مجانية.
محرري النص ، مجموعات جيثب	عرض لبعض محرري المصدر المفتوح الرائعين بشكل مثير للدهشة.
لم يسبق له مثيل	مستودع مرتبة للمكونات الإضافية JQuery مصنفة في الفئات.

↥ العودة إلى الأعلى