34 لقطة شاشة عالية الجودة

هل سبق لي أن قمت بعمل تسجيلات للشاشة لكي تجعل التعلم أسهل، ولكن إذا كانت اللغة الإنجليزية هي الشيء الذي تفضله ، أعتقد أنك ستستمتع كثيرًا بهذا الإدخال الذي أحضره لك.

Un سكرينكست هو تسجيل رقمي لإخراج الشاشة لملف كومبيوتر، تحتوي أحيانًا على السرد الصوتي. على الرغم من أن المصطلح سكرينكست التمور من 2004، منتجات مثل لوتس تم استخدام ScreenCam منذ ذلك الحين 1993. أنتجت المنتجات الرائدة ملفات ضخمة ولديها ميزات تحرير محدودة. تدعم أحدث المنتجات تنسيقات ملفات أكثر إحكاما مثل ماكروميديا ​​فلاش ولديها ميزات تحرير أكثر تعقيدًا تسمح بالتغييرات في التسلسل وحركة الماوس والصوت.

لا يوجد ما لا يقل عن أربعة وثلاثين لقطة شاشة لتحسين مهاراتك في التصميم والبرمجة ، كل ذلك باللغة الإنجليزية ولكن شرحها جيدًا وبجودة ممتازة ، لذلك لا داعي للقلق.

المصدر | الدفع الأول

أجاكس:

1.AJAX تحديث محتوى RSS

تغلب على متاعب تحديث الصفحة عن طريق تحديث المحتويات دون تحديث الصفحة يدويًا. يوضح هذا الفيديو ما يجب فعله وكيف يتم تحديث موجزات RSS بمساعدة AJAX.

إذا كنت تقوم بعمل موجز واحد فقط ، فأعتقد أنه سيكون من الأفضل أن تقوم بتدوير كود JavaScript الخاص بك ، خاصة إذا كان مجرد تحليل RSS. مما أتذكره ، بدا أن SimplePie كان كثيرًا من النفقات العامة.

2.تأثير بسيط-مسك-تجسس

إن الشيء العظيم في موقع Realmac's QuickSnapper هو أنه إذا تم إيقاف تشغيل JavaScript ، فإن قائمة اللقطات تكون مرئية بشكل افتراضي. لذلك سوف نحذو حذوها.

تجدر الإشارة أيضًا إلى أن نسختهم تستمر في سحب العناصر الجديدة فقط حتى تصل إلى النهاية. سأوضح لك كيف يمكنك الحفاظ على تكرار القائمة ، وفي برنامج تعليمي للمتابعة ، سأوضح لك كيفية ربط هذا بضربة Ajax التي لا تدق خادمك وتحافظ على التأثير لطيفًا وسلسًا.

3.أفضل 25 فيديو تعليمي AJAX من youtube

تقدم الدروس المقدمة هنا بداية من البداية لكيفية إنشاء مستند HTML وإضافة جافا سكريبت وأيضًا ربط جافا سكريبت خارجي بذلك وبناء محادثة أجاكس وإضافة عناصر أجاكس إلى صفحة ويب باستخدام إطار عمل تجسس وإدراج كائنات أجاكس في Adobe Dreamweaver ، كيفية إنشاء تطبيقات Mash up باستخدام إطار عمل AJAX ، وإنشاء Delphi for PHP web أيضًا حول قاعدة بيانات AJAX MySql

مسج:

4.رؤوس منزلقة مثل iphone

هل شعرت بالإحباط عندما لم تتمكن من العثور على العنوان أثناء تصفح المحتوى وفقدت موضوعك
عند الانتقال إلى الصفحة التالية ، تساعد شاشة العرض هذه الرأس على الاحتفاظ بالمحتوى وأيضًا استبدال العنوان التالي في نفس الوقت عند الانتقال إلى الصفحة التالية بطريقة خفية. إنها مفيدة جدًا لكل مصممي الويب الذين يتابعون الاتجاه.

5.تم إعادة النظر في قفزة الرسوم المتحركة المنزلق لأسفل

كنت قد لاحظت أن الرسوم المتحركة الخاصة بك تقفز نحو النهاية ، والتي قد تكون بسبب مشاكل الارتفاع. تساعدك هذه الشاشة على إيجاد حل من خلال النظر في عوامل الارتفاع من خلال تخزين ارتفاع مضمّن وتعيين ارتفاع مضمّن لاحقًا والمتابعة وفقًا لذلك. نحن نكشف عن العنصر أو نخفيه. يمكننا استخدام هذا الإجراء لإظهار نتائجنا أو يمكننا استخدام هذا في الأسئلة الشائعة أيضًا. لذلك ليست هناك حاجة لتحديث الصفحة.

6.معرض المنزلق

هل تريد إنشاء معرض به شريحة للتنقل بين العناصر؟ تساعدك شاشة العرض هذه بخطوات بسيطة لترجمة موضع أشرطة التمرير لتحريك المنتجات بشكل عكسي بمساعدة Markup و slider-widget control و jQueryUI و CSS وبعض المكونات الإضافية التي توفر تمريرًا أسرع وإيقافًا مؤقتًا عند الحاجة.يمكنك العرض منتجاتك ويمكنك تدوير صورك وما إلى ذلك.

7.مسج للمبتدئين

سلسلة المبتدئين المطلقة لمدة 15 يومًا في Jquery مع Theme forest.net كمرجع بواسطة Jeff Way الذي لديه مقاطع فيديو حصرية لكل يوم حيث يمكنك تعلم جميع الأساليب ، ومحول أسلوب Jquery ، وتأثير التحويم ، والكثير غيرها المستخدمة في Themeforest.net.

ستعلمك سلسلة الشاشة المصبوب Jquery بشكل واضح وفعال.

8.بناء قائمة التنقل نمط مصباح الحمم

تعلم كيفية إنشاء قائمة نمط مصباح الحمم من البداية والتي توضح في البداية نفس العملية باستخدام قائمة من ثلاثة مستويات ثم إنشاء قائمة مصباح الحمم باستخدام مكتبة Javascript في شاشة العرض هذه.

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

9.دائري تلقائي لانهائي

في معظم الأوقات ، لا يتوقف إجراء التمرير تلقائيًا ويتعين علينا التحكم فيه يدويًا عند الحاجة ، لذلك لجعل إجراء التمرير تلقائيًا وإيقافه مؤقتًا عندما يكون الماوس فوق الرف الدائري باستخدام Jquery ، يتم عرضه في هذه الشاشة.

يمكننا استخدام هذا الرف الدائري لأغراض ديناميكية أيضًا.

10Jquery look تيم فان دام

يمكن أيضًا أن تعمل التأثيرات الرئيسية لتأثير Tim the Accordion و Hover التي تعمل فقط في Webkit في jQuery عند أخذ عاملين هما الهامش المتحرك - تأثير التلاشي المتقاطع الأيسر والخلفية rgba في الاعتبار.

لمزيد من التفاصيل ، انتقل إلى screencast واعثر عليها بنفسك.

11نافذة تسجيل الدخول المنبثقة

تتم المصادقة دائمًا بمساعدة كلمة مرور ، وستكون شاشة العرض هذه مفيدة جدًا لأغراض التفويض.

في هذه الشاشة ، نقوم بإنشاء نافذة منبثقة بسيطة تتحقق من كلمة مرور حساب في خادم LDAP وحيث يتم تمرير البيانات من رابط إلى النافذة التي تم إنشاؤها ديناميكيًا.

12Screencasts لبناء البرنامج المساعد jquery الخاص بك

احصل على إرشادات الخبراء James Padolsey و Jeffery Way و Dan Wellman في هذه الشاشة لإنشاء ملحقات Jquery الخاصة بك واستخدامها في برامجك. تعلمت كيفية تعيين الإعدادات الافتراضية وتحميل الصور مسبقًا وإنشاء طرق معاودة الاتصال وإنشاء أزرار اختيار ديناميكية باستخدام Jquery و CSS.

لمعرفة الخطوات الكاملة ، قم بدراسة طاقم الشاشة الكامل.

13. سلسلة فيديو الاستفسار

نظام تدريب أكثر تفصيلاً ودقة لمدة 10 دقائق لـ Themeforest.net وباستخدام نفس كيفية استخدام مكتبة Jquery وإنشاء مشاريعك الخاصة بمساعدة وصف سلسلة الفيديو لمدة 15 يومًا.

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

تسجيلات PHP:

14الغوص في PHP

يتم تقديم جولة قصيرة حول مواضيع مختلفة في PHP كبرامج تعليمية منفصلة. تعلمك هذه البرامج التعليمية المستقلة بواسطة Jeffery Way كيفية تحميل الملفات باستخدام PHP بمساعدة مدونة ThemeForest التي تعد مصدرًا كاملاً لاستعلامات PHP.

تغطي شاشة العرض هذه أنواعًا مختلفة من الموضوعات للمستخدمين المبتدئين والمستوى المتوسط.

15PHP Json Jquery Ajax Screencast

لإنشاء اتصال بين مصدر بيانات PHP و JSON باستخدام وظيفة AJAX في jQuery حيث نقوم بإنشاء برنامج نصي لإرسال بيانات JSON ، ثم مصفوفة PHP ثم نقوم بتحميل الملف ويتم ملء مصدر البيانات الخاص بنا.

لمعرفة الخطوات الكاملة ، يرجى الاطلاع على الشاشة الكاملة. إنها شاشة متقدمة لمحبي PHP.

16- موقع ادارة الصور باستخدام PHP و Jquery

يساعدك هذا screencast على إنشاء موقع للصور باستخدام PHP و jquery حيث يتم إنشاء قاعدة بيانات مع مجموعة من الصور ، ويتم منح المسؤول حقوق تحديث عنوان الصور وكذلك الحفاظ على أي أدلة فرعية من خلال النقر على النص .

يمكنك إدارة معرض الصور بالكامل وفقًا لمتطلباتك. تخصص هذه الشاشة هو استخدام Jquery نحن ندخل إلى المعارض.

تسجيلات CSS:

17HTML و CSS هما الأساسيات

ساعد المبتدئين المطلقين في أساسيات HTML و CSS وهي ملفات نصية فقط إلى مستوى يمكنك من خلاله استخدامها كمعاينة في موقع الويب الخاص بك.

تعلمك شاشة العرض هذه أن HTML هو المحتوى وأن CSS هي تصميم موقع الويب وأيضًا كيفية إنشاء موقع ويب بجودة جيدة. هنا يمكنك تعلم أساسيات كل من HTML و CSS حتى تتمكن من التعامل مع مواقع الويب بسهولة عندما تتعلم الأساسيات جيدًا.

18معرض صور CSS3 قابل للتحرير

نقوم ببناء نمط تصميم معرض صور نموذجي جدًا ، شبكة من الصور التي تظهر بشكل أكبر عند النقر عليها ، سيعطيك معرض الصور هذا مظهرًا احترافيًا للغاية لتطوير الويب الخاص بك.

لكن صفحة معرض الصور هذه تستخدم ترميز HTML5 الدلالي الساخن ، والكثير من المعالجات المرئية باستخدام CSS3 و jQuery ، وجعلها قابلة للتحرير من خلال CMS PageLime.

19. كيفية استخدام CSS sprites

لطالما كان CSS Sprites موضوعًا ساخنًا لفترة طويلة الآن. الحقيقة هي أن كل صورة على صفحة الويب هي طلب خادم منفصل ويمكنك زيادة أداء الصفحة بشكل كبير.إن تقليل عدد طلبات HTTP يحسن أوقات التحميل. لتحقيق ذلك ، نستخدم CSS sprites وكيفية إنشاء كائن CSS وكيفية وصف هذه النقوش هنا.

سيعطيك هذا فكرة جيدة عن CSS sprites وكيفية استخدامها مع جانب تطوير الويب الخاص بك.

20نظرة مفصلة على 960 إطار عمل CSS

يعد نظام 960 Grid System بمثابة جهد لتبسيط سير عمل تطوير الويب من خلال توفير أبعاد شائعة الاستخدام ، بناءً على عرض 960 بكسل. هناك نوعان مختلفان: 12 و 16 عمودًا ، والتي يمكن استخدامها بشكل منفصل أو جنبًا إلى جنب.

ليس عليك إتقان الكود لإنشاء تطبيق ويب. توجد أطر عمل CSS لك لكتابة التعليمات البرمجية الخاصة بك. اقض بعض الوقت مع هذه الشاشة لتتعرف على أطر العمل ولتطوير تطبيقات الويب الخاصة بك بكفاءة.

21. محوّل الصور

Image Switcher هو برنامج JavaScript مجاني يقوم تلقائيًا بإدراج سلسلة من الصور في منفذ عرض واحد قابل للتبديل السريع ، وهو محول صور CSS خالص وخفيف الوزن ومتوافق مع المعايير. يمكن استخدامه لمعرض أو أي وظيفة مماثلة. يمكن استخدام أي عدد من خيارات تحديد القائمة طالما أن العرض يمكنه استيعابها.

لتغيير الصور أثناء تنقلك عبر ارتباط هو ما تعلمه لك شاشة العرض هذه بدون مساعدة JavaScript. تحتاج فقط إلى مفتاح z-index عند التمرير وقليلًا من الموضع المطلق لتحقيق ذلك.

22بناء معرض للصور

مثل العديد من الأشخاص ، قد ترغب في إنشاء موقع ويب لعرض صور الأصدقاء والعائلة والإجازة والزفاف وما إلى ذلك. حسنًا ، سيوضح لك هذا البرنامج التعليمي الصغير كيفية إنشاء معرض للصور وتحميله على الإنترنت.

معرض الصور الذي يبني نفسه تلقائيًا مع الصور من الدليل وكذلك الأدلة الفرعية ممكن بواسطة CSS. يعلم كريس كويير في هذه الشاشة كيفية إنشاء معرض صور تلقائي.

23تضمين الصوت

كيف تقوم بتضمين ملف MP3 (مثل بودكاست أو أغنية أو موسيقى خلفية) في صفحة ويب أو موجز RSS بحيث يمكن للزوار الاستماع إلى الصوت في المتصفح نفسه دون الحاجة إلى مشغل خارجي مثل QuickTime أو Windows Media Player.

معظم الصور إما نستخدم صورة أو ملف صوتي. لكن الصورة التي تحتوي على صوت في الخلفية تجعل المستخدم مرتاحًا جدًا لفهم المعلومات. يعلم Chris Coyier الشيء نفسه بمساعدة JavaScript و Flash في هذه الشاشة.

24باستخدام CSS3

يتم التفكير في العديد من الوظائف والميزات الجديدة المثيرة CSS3. سنحاول عرض بعضها على صفحة الويب هذه. للحصول على التحسينات المرئية مثل الخلفيات المتعددة ، RGB ، صورة الحدود ، نصف قطر الحدود ، وجه الخط @ ، الرسوم المتحركة / الانتقالات والكثير غير ذلك لـ CSS3 قيد التنقل الآن.

لمتابعة هذه الموجة الأخيرة ، يمكنك إلقاء نظرة على هذا الشاشة.

25إدخال Firebug

يمكنك الحصول على معلومات حول الترميز و CSS والتخطيط و DOM لعنصر في صفحة باستخدام Firebug ، وهو امتداد لـ Firefox أصبح حتميًا لمصممي ومطوري الويب حيث يمكنك تحرير النتائج ومشاهدتها مباشرة في المتصفح.

لمعرفة المزيد ، تعلم هذه الشاشة.

26صفحة فريدة لتحديثات تويتر

عندما تصمم بشكل صحيح ، أ  تويتر يمكن أن تحسن التغذية من جماليات تصميم موقع الويب. إذا كان التغريد هو هوايتك ، فيجب أن تكون حريصًا على عرض تغريداتك من البداية إلى النهاية. على سبيل المثال ، يمكنك تغطية التصميم في Photoshop وتصميم صفحتك أيضًا.

لتحقيق هذه المهمة ، اتبع هذه الشاشة التي ترشدك من عناصر جافا سكريبت إلى CSS لتصميم صفحتك.

كودجنايتير:

27لقطات الشاشة الأساسية

Code Igniter هو تطبيق ويب مفتوح المصدر لكتابة برامج PHP وأيضًا لإنشاء تطبيقات ويب كاملة الميزات. كتابة التعليمات البرمجية من البداية ، من خلال توفير مجموعة غنية من المكتبات للمهام المطلوبة بشكل عام ، بالإضافة إلى واجهة بسيطة وهيكل منطقي للوصول هذه المكتبات.

في هذه الشاشة ، تمنحك مقدمة حول CodeIgniter وأيضًا لإنشاء مدونة في CodeIgniter باستخدام PHP بواسطة Derek Jones.

28تطوير سهل باستخدام Codeigniter

مع PHP الخام ، يمكن أن يكون هذا مضيعة للوقت إلى حد ما. ومع ذلك ، مع كود إغنيتر، إنها ببساطة مسألة الرجوع إلى المكتبة الصحيحة ، وتمرير بعض خيارات التكوين! دعنا نتعمق.

حرصًا على ضبط مهارات PHP بعد تعلم المقدمة ، انتقل إلى الخطوة التالية ، هذه الشاشة تعلمك تحميل صورة وحفظها بعد التحقق الأولي باستخدام PHP في CodeIgniter.

29تسجيلات بدء التشغيل القاتلة لـ Codeigniter

استعد لإنشاء تطبيقك الأول باستخدام CodeIgniter ، وأنشئ نموذجًا باستخدام Form Builder ، وأنشئ نموذجًا للتطبيق ، وأنشئ مدونة في 20 دقيقة ، وأنشئ ترقيم الصفحات ، وأرسل واستقبل البيانات عبر jQuery Post و JSON في هذه الشاشة التي مدتها 10 دقائق بواسطة Derek Jones .

نأمل أن تتعلم المزيد إطار تطوير تطبيق CodeIgniter بعد احترس من screencast.

XML:

30بناء نظام تسجيل الدخول والتسجيل مع XML

يمكن أن يكون بناء نظام عضوية كامل مهمة شاقة وتستغرق وقتًا طويلاً. سيوضح لنا Tim Cooper كيفية بناء الشيء بالكامل في حوالي ثلاثين دقيقة.

باستخدام XML ، يمكننا إنشاء نموذج تسجيل الدخول والتسجيل في وقت أقل بكثير من MySQL ، يوضح Tim Cooper في هذه الشاشة هذا من خلال مراجعة PHP و. htaccess والملفات والجلسات والمزيد.

31بناء نموذج

قد يبدو من الغريب محاولة توحيد أنواع البيانات في نظام تم تصميمه ليكون مرنًا للغاية ، ولكن أكثر من مؤسسة واحدة أفادت بأن وضع توقعات معقولة لعمليات نشر المحفظة عبر الحرم الجامعي وإدارة موارد تكنولوجيا المعلومات الخاصة بك للاستفادة من قدر معين من التوحيد تفعل الكثير لتحقيق ذلك. مشروع مستدام.

تعرف على أساسيات بناء نموذج باستخدام أداة Form Builder التي يمكن استخدامها لإنشاء ملف مخطط XML وأيضًا استخدامها للعديد من الأغراض في العديد من الأشكال. يعلمك Sean Keesler أن تبني نموذجًا في هذه الشاشة.

32حدد بيانات الاختبار باستخدام XML

قم بإنشاء برامج نصية للتشغيل الآلي لاختبار وظائف تطبيق الويب في Internet Explorer على Windows.

من هذا Screen cast ، حقق هذه المهمة بمساعدة Pamie - ملف فئة Python الذي ينشئ برنامجًا نصيًا لاختبار Pamie لأتمتة نموذج وإنشاء ملف XML وقراءة البيانات وتشغيل الاختبار.

تظهر لك:

  • كيفية إنشاء برنامج نصي لاختبار Pamie لأتمتة نموذج
  • كيفية العثور على أسماء ومعرفات عناصر DOM لأتمتة
  • إنشاء ملف XML من البداية باستخدام Notepad ++
  • كيفية قراءة البيانات في ملف XML باستخدام ElementTree
  • كيف تجري الاختبار

33يلقي الشاشة لتحصل على ركل الحمار مع دروبال

تجد صعوبة في تعلم دروبال ، فهذه الشاشة تجعل من السهل التعلم العملي خطوة بخطوة بدءًا من التثبيت ونظام العقدة ونظام الحظر وأنواع المحتوى وتطوير السمات والمزيد.

يمكنك أيضًا العثور على موارد لكتب دروبال ، بودكاست دروبال ، منتديات دروبال ، قنوات دروبال.

34- جولة دورية

احصل على جميع المعلومات التي تريد معرفتها عن دروبال ، حيث تمنحك هذه الشاشة أفضل لقطات شاشة دروبال وأفضل الكتب عن دروبال والموارد والوحدات النمطية وأيضًا مضايقات دروبال. احصل على أحدث لقطات الشاشة على دروبال 6 ، وتعرف على CSS Injector ، وتحويل العقدة ، ومتلازمة البوفيه المفتوح ، وإنشاء نسخة احتياطية ، وحول Webform ، وتسجيل الدخول Toboggan ، ومرشحات الإدخال ، وطول الدعابة ، والمزيد حول منصة إدارة المحتوى هذه - دروبال.


اترك تعليقك

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها ب *

*

*

  1. المسؤول عن البيانات: ميغيل أنخيل جاتون
  2. الغرض من البيانات: التحكم في الرسائل الاقتحامية ، وإدارة التعليقات.
  3. الشرعية: موافقتك
  4. توصيل البيانات: لن يتم إرسال البيانات إلى أطراف ثالثة إلا بموجب التزام قانوني.
  5. تخزين البيانات: قاعدة البيانات التي تستضيفها شركة Occentus Networks (الاتحاد الأوروبي)
  6. الحقوق: يمكنك في أي وقت تقييد معلوماتك واستعادتها وحذفها.