آخذ هذا المنشور للإجابة على سؤال طرحته مؤخرًا في تعليقات أحد المقالات:
ما هو الوقت المناسب لبدء التصميم بالكامل باستخدام HTML5؟
حسنًا ، بصراحة ، هذا يعتمد على الهدف الذي تستهدفه. إذا كنت لا تخطط للزائرين لاستخدام Internet Explorer (على سبيل المثال: صفحة برنامج Mac) ، فابدأ فورًا باستخدام HTML5 ، ولكن إذا كنت بحاجة إلى أشخاص لديهم IE لرؤية موقع الويب الخاص بك ، فمن الأفضل الانتظار ...
عند الدخول ، بعد القفزة بوقت طويل ، هناك 48 عرضًا تجريبيًا لـ HTML5 مدهشة وتستحق المشاهدة. عظيم قليلا.
المصدر | هونغكيات
audioburst الرسوم المتحركة
رسم متحرك مريح ورائع تم إنشاؤه باستخدام لوحة HTML5 وعلامة الصوت.
تجمع الكرة
نظرًا لعرضه في حدث Google I / O الأخير ، يوضح لك هذا العرض التوضيحي مدى ديناميكية HTML5.
بلوب سلاد
مخلوق نتج عن HTML5 يرضيك.
بومومو
باستخدام Bomomo ، يمكنك مراقبة حركة ذرية مختلفة تمت محاكاتها باستخدام HTML5.
كرة المستعرض
ستندهش من كرة HTML5 "عبر المتصفح".
فقاعات
استمتع بإنشاء فقاعات عائمة لا نهاية لها بألوان مختلفة.
قماش كارتون للرسوم المتحركة
رسم كاريكاتوري HTML5 بسيط ومضحك يساعدك على فهم ما يمكن أن يفعله عنصر لوحة HTML5.
كولكلوك
ساعة تناظرية لطيفة وقابلة للتخصيص تم إنشاؤها بواسطة HTML5 و JavaScript.
عرض شرائح Flickr PS3
اعرض صورك على Flickr باستخدام عرض شرائح نمط PS3 في متصفح الويب.
بولارويد التفاعلية
عرض تفاعلي يشبه إلى حد كبير واجهة اللمس المتعدد.
الألعاب النارية شبيبة
استمتع بلحظة الألعاب النارية بالجاذبية والسرعة المفضلين لديك ، بدعم من HTML5 و Javascript.
المشكال
مشكال HTML5 جميل جدًا ومستقبلي.
الجسيمات السائلة
الرسوم المتحركة الحساسة للجسيمات التي تتفاعل بناءً على حركة الماوس.
يفتن
عرض HTML5 حساس ومميز آخر يوضح كيفية تفاعل العناصر القريبة مع حركة الماوس.
سحابة سديم
تضيع مع هذا السديم HTML5 الرائع.
إختلاف المنظر
اعرض جميع الأشكال ثنائية الأبعاد في منظور متوازي.
الرسوم المتحركة الجسيمات
رسم متحرك أنيق للجسيمات بتنسيق HTML5 يمكن أن يتشكل في رسالتك المفضلة.
الهامش
تضيع مع هذه الرسوم المتحركة التي لا نهاية لها.
سترفيلد
رسوم متحركة رائعة جدًا في مجال HTML5 من شأنها تغيير الاتجاه والسرعة بناءً على حركة الماوس.
تدمير الفيديو
نقرة واحدة لتنشيط تشغيل الفيديو.
الموجي
لاحظ كيف تتحرك موجة قماش HTML5 عن طريق تغيير السعة والطول الموجي والعرض وما إلى ذلك.
تأثير 3D
أعجب بالرسوم المتحركة القماشية؟ هذا هو المزيد الذي يمكن أن يفعله عنصر لوحة HTML5 ، ويسمى التأثير ثلاثي الأبعاد. يمكن للمطور الاعتماد على عنصر Canvas و DOM و JavaScript لإنشاء تأثير ثلاثي الأبعاد ، والذي يمكن تطويره لاحقًا إلى رسوم متحركة أو لعبة ثلاثية الأبعاد.
Canvas3D و Flickr
استمتع بتجربة ثلاثية الأبعاد جديدة تمامًا مع تدفق الصور من Flickr.
محاكاة القماش
محاكاة قماشية واقعية تستند إلى HTML5.
تطور الوحش
لاحظ أن وحشًا يتطور إلى مخلوق معقد ، أحد منشئه هو HTML5.
جوجل Giftbox
يتم تقديم محرك البحث العملاق Google في عرض ثلاثي الأبعاد قابل للتشغيل.
شبيبة تاتش
عرض "ثلاثي الأبعاد على قماش ثنائي الأبعاد" عالي الجودة وواقعي.
عرض بيانات
بينما يمكن استخدام عنصر قماش HTML5 لإنشاء رسوم متحركة وتأثير ثلاثي الأبعاد ، يمكن أيضًا تنفيذه لتقديم بيانات رياضية.
غنوبلوت
Gnuplot ، تطبيق تخطيط البيانات في إصدار HTML5.
RGraph
يوفر RGraph مجموعة واسعة من عروض البيانات مثل الرسم البياني الشريطي وشريط التقدم ومخطط الرادار التقليدي.
تطبيق ويب
في النهاية ، باستخدام جميع الاحتمالات التي يتم دمجها بواسطة HTML5 ولغات أخرى ، يمكن للمرء إنشاء تطبيق أو لعبة تفاعلية قريبة من تطبيق Flash.
CanvasPaint
شاهد شقيق Microsoft Paint يأتي إلى متصفح الويب الخاص بك ، ووالده هو HTML5.
قماش
تطبيق علمي مصمم لمساعدتك على فهم بنية معينة لعنصر الأرض.
كارتون باني
ارسم صورة كرتونية مثيرة للاهتمام باستخدام باني الرسوم المتحركة البسيط والتفاعلي.
اسحب أي شيء هنا
اسحب أي شيء يمكنك سحبه في العرض التوضيحي لإظهار التفاصيل.
رسم الجارتيك
تطبيق HTML5 أصلي يسمح لك بعمل بعض الرسومات الأساسية التي يمكن حفظها في تنسيق صور مختلف مثل jpeg أو png.
فيزيكسكيتش
ارسم ما تريد وانظر كيف تتفاعل مع محاكاة الجاذبية.
دفتر الرسم
تطبيق رسم HTML5 قوي يمكّنك من رسم صورتك وتحريرها بدقة.
حديث قصير
تطبيق ويب يؤكد الموقع الجغرافي للرسالة المتعلقة بالطقس المكتسبة من Twitter ، وبالتالي تشكيلها في خريطة "طقس اجتماعي" قائمة على القماش ، تافهة تمامًا (كما ذكر المؤلف) ولكنها مثيرة للاهتمام.
لعبة Rocket League – CD Playstation
3 بالملل
لن تشعر بالملل أبدًا إذا تمكنت من تفادي مئات من رموز HTML5 النقطية في الثانية التالية.
انطلق
ارتد الكرة لكسر كل الطوب.
كانفاسكيب
ليست لعبة تمامًا ، لكنها توضح كيف يمكن استخدام HTML5 لتطوير لعبة متصفح First Person Shooting.
إمسكها
كم عدد الكرات التي يمكنك مراوغتها للحصول على مربع HTML5 الفائز؟
التفاعل المتسلسل
سلسلة الانفجار لتحقيق الهدف ، لا تدمن.
كيوبوت
قم بتشغيل Tetris في عرض ثلاثي الأبعاد من أعلى لأسفل.
إتشا
ارسم عنصرًا لتحريك الكرة إلى النجم ، ولا تنس الجاذبية.
أحجية الصورة المقطوعة
انقر فوق قطع الألغاز وقم بتدويرها وإسقاطها لحل أحجية الصور المقطوعة القائمة على HTML5.
لغز الشريحة
انتقل إلى النصر ، لعبة HTML5 أخرى تم تصميمها لضغط عقلك.
نفس اللعبة
قم بإزالة مجموعة معينة لتحصل على مجموعة أخرى بنفس اللون وستحصل في النهاية على نصر.
تتريس
واحدة من أكثر الألعاب الكلاسيكية التي أعاد HTML5 الحياة إليها.
نتوء مستدير
لعبة Tetris أخرى في نسخة زائفة ثلاثية الأبعاد.
TETRIS لا تذهب ، أضع قطعتين في والوقوف ولكن الباقي هو تحديات رائعة للغاية
انا احب هذه الصفحة ... ماعدا اللعبة الاولى. أحبك فران =)
وداعا قبلة جدا للعالم
لا يصدق ، مذهل. لا أصدق إلى أي مدى وصل تطوير الويب!
لا أعرف لماذا تُنسب هذه الموارد إلى HTML5 ، هذا هو جافا سكريبت خالص ، قبل ظهور الفلاش ، مع جافا سكريبت يمكنك القيام بكل هذه الأشياء ، كانت هناك دراسة في برشلونة جعلت بعض المواقع التي فاجرت في ذلك الوقت ، كل ذلك في جافا سكريبت لدرجة أنني تعلمت منهم وصممت زوجين مع الكرات المرتدة وكل شيء ، لقد فقدتهم تمامًا وما زلت أشعر بالأسف لذلك لا أتذكر اسم الاستوديو ، فقد كان شيئًا مثل you2 أو 2you2 في عام 98 أو نحو ذلك.
Joe Vega …… فإنه يظهر أنه ليس لديك فكرة سخيف عن HTML5… .lol
قد لا يكون لديك أي فكرة عن HTML5 دموية ، هذا صحيح ، لكن يا رفاق يخطئون في أن الديك هو حظيرة الدجاج ولا تفرق بين لغة وبيئة. أتحداك أن تصنع مثالًا مثل الأمثلة الموجودة هنا دون استخدام Javascript ، فقط مع html5 ، وستفهم ما قصدته في المنشور الذي حذفته. علاوة على ذلك ، كنت أبحث في الكود المصدري للأمثلة وهناك العديد من الأشياء التي يمكن القيام بها بسهولة دون تحميلها على html5.
أن html5 يجلب العديد من التحسينات والأشياء التي تسهل الكثير هو أمر صحيح ، لكن أمجاد الشيء الرائع الذي يظهر في هذه الصفحة هو Javascript.
أنا مهتم بعمل عروض تقديمية من هذا النوع ... هل لديك برنامج تعليمي أو صفحة بها موارد ؟؟؟ شكرا!!!