موضوعات التدريس
صفحة على الإنترنت
درجة قابلة للتطبيق
طالبة
وقت الفصل الدراسي
1 درس
تحليل الكتب المدرسية
التركيز: كيفية تعويض صفحات الويب الثابتة وصفحات الويب الديناميكية وعملية العمل الخاصة بهم
الصعوبة: عملية عمل صفحات الويب الديناميكية
أهداف التعلم
فهم المفاهيم الأساسية لصفحات الويب والصفحات المنزلية ومواقع الويب وعلاقاتها ، وفهم مفاهيم صفحات الويب الثابتة وصفحات الويب الديناميكية ، وفهم تكنولوجيا صفحات الويب الثابتة وصفحات الويب الديناميكية ، وشرح عملية العمل
الموارد والبيئة المطلوبة
الموارد الرقمية
1. محرك البحث (www.google.com ، www.baidu.com)
2. العديد من صفحات الويب العرضية (صفحات الويب الثابتة وصفحات الويب الديناميكية)
الموارد العامة
1. الفصل 5 ، القسم 1 من الكتاب المدرسي "تطبيق تكنولوجيا الشبكة" ؛ دعم القرص المضغوط
2. مواد تعليمية تدعم كتب المعلمين
3. قائمة مهام التعلم "صفحة الويب"
بيئة الدعم التدريس
فصول شبكة الكمبيوتر أو برنامج فصول الشبكة متعددة الوسائط أو جهاز عرض LCD
تصميم التدريس
سؤال
غاية
النقاط الرئيسية/الصعوبات/النقاط الرئيسية
تصميم مشكلة إرشاد التدريس
ما هو موقع الويب؟ ما هي صفحة الويب؟ ما هي الصفحة الرئيسية؟
فهم معنى المواقع الإلكترونية وصفحات الويب والصفحات المنزلية
ما الذي يتكون من الموقع؟
فهم مكونات الموقع المختلفة
شعار الموقع ، منطقة الرأس ، منطقة التوصية الساخنة
ما هي صفحات الويب التي نراها عادة على الإنترنت؟
دع الطلاب يفهمون رمز تكوين صفحات الويب الثابتة - HTML
فهم البنية والعلامات الأساسية للغة HTML
كيف تظهر صفحات الويب الثابتة في المتصفح؟
إتقان عملية العمل لصفحات الويب الثابتة في المتصفح
يفسر المتصفح رمز HTML
ما هي صفحات الويب التفاعلية المصنوعة من؟
دع الطلاب يفهمون تكوين صفحات الويب الثابتة
فهم لغة البرمجة النصية
كيف تظهر صفحات الويب الديناميكية في المتصفح تحت تفاعل المستخدم؟
إتقان عملية العمل لصفحات الويب الديناميكية في المتصفح
عملية تنفيذ صفحات الويب الديناميكية
عملية التدريس
1. مقدمة الدرس الجديد:
يجب أن يكون جميع الطلاب الذين تعرضوا للإنترنت قد زاروا موقع الويب وشاهدوا صفحة الويب. تحتوي صفحات الويب التي تراها عمومًا على بعض التنسيقات الثابتة ، مثل العناوين ، وشعارات الموقع ، وما إلى ذلك من حيث تصنيف صفحات الويب ، يمكن تقسيمها عمومًا إلى فئتين. لا تتغير فئة واحدة مع عمليات المستخدم ، والتي تسمى صفحات الويب الثابتة ، وتتغير الفئة الأخرى مع عمليات المستخدم. يسمى هذا النوع من صفحات الويب صفحات الويب الديناميكية.
سأناقش اليوم مشكلة صفحات الويب.
2. محتوى التدريس:
ابحث عن بعض المواقع النموذجية من خلال محركات البحث لعرضها للطلاب.
1. مفهوم موقع الويب وصفحة الويب والصفحة الرئيسية والعلاقة بين الثلاثة
يتكون الإنترنت الدولي الذي يزوره الأشخاص اليوم من مواقع الويب ، ويتكون الموقع من صفحات ويب محددة. الصفحة الرئيسية تعادل صفحة البداية للموقع وتلعب دورًا توجيهيًا ومتصلًا. بشكل عام ، يمكن للمستخدمين الوصول إلى معظم صفحات الويب الخاصة بالموقع من خلال الصفحة الرئيسية.
سؤال: ما هو موقع الويب؟ ما هي صفحة الويب؟ ما هي الصفحة الرئيسية؟
النشاط: يشرح المعلم معنى موقع الويب وصفحة الويب والصفحة الرئيسية والعلاقة بين الثلاثة.
2. بنية صفحة الويب
يتكون بنية صفحة المواقع الشائعة عمومًا من عنوان الصفحة وشعار موقع الويب (شعار) ، منطقة الرأس ، شريط التنقل ، منطقة تسجيل الدخول ، منطقة البحث ، منطقة الساخنة التوصية ، منطقة المحتوى الرئيسية ، منطقة تذييل ، إلخ.
3. مفهوم صفحات الويب الثابتة
صفحة الويب الثابتة هي صفحة ويب مخزنة في شكل ملف على الخادم وإرسالها إلى العميل بنفس التنسيق.
صفحات الويب الثابتة هي الملفات المكتوبة بلغة ترميز النص التشعبي.
سؤال: ما هي صفحات الويب التي نراها عادة على الإنترنت؟
النشاط: يشرح المعلم تكوين صفحات الويب الثابتة وخصائص لغة ترميز النص التشعبي (HTML).
استكشف: يقوم الطلاب بتشغيل ، وعرض الملفات المصدر لصفحة الويب عند تصفح صفحة الويب.
4. مبدأ عرض صفحة الويب الثابتة في المتصفح
يتم إرسال صفحة ويب ثابتة إلى العميل بنفس التنسيق من الخادم ، ولكن بعد وصول هذا الملف إلى المتصفح ، يحتاج المتصفح إلى العثور على رمز HTML في الملف ، ثم عرض رمز HTML المحدد في نموذج محدد لتشكيل صفحة الويب التي شاهدها المستخدم.
سؤال: كيف تظهر صفحات الويب الثابتة في المتصفح؟
النشاط: يشرح المعلم عملية تفسير المتصفح وتأثير لغة ترميز النص التشعبي.
5. مفهوم صفحات الويب الديناميكية
تشير صفحات الويب الديناميكية إلى صفحات الويب التي يتم إنشاؤها تلقائيًا بواسطة أنظمة الكمبيوتر أثناء تصفح المستخدم. عادة ما يتم استخدامها لعرض المعلومات في الوقت الفعلي أو عرض محتوى معين وفقًا لتفاعل المستخدم.
ميزات صفحات الويب الديناميكية: التحديث التفاعلي التلقائي ، التغيير من مكان لآخر
الأشكال الشائعة لصفحات الويب الديناميكية: العدادات ، غرف الدردشة ، مناطق المناقشة ، BBS ، سجلات الخريجين ، إلخ.
حالتان شائعتان لتشكيل صفحات ويب ديناميكية: صفحات ويب ديناميكية تتألف من أساليب عميل نقي وصفحات ويب ديناميكية مكونة من وضع خادم العميل
سؤال: ما هي صفحات الويب التفاعلية المصنوعة؟
النشاط: يشرح المعلم حالتين شائعتين لتشكيل صفحات الويب الديناميكية والتكوين المعني وخصائص صفحات الويب الديناميكية المكونة من أساليب العميل الخالصة وأنماط المتصفح/الخادم.
الاتصال: كيفية استخدام لوحة النظام لضبط الألوان بدقة
6. مبدأ عرض صفحة الويب الديناميكية
صفحات الويب الديناميكية المكونة من أساليب العميل الخالصة: لا تتطلب هذه الطريقة تفاعل مع الخادم ، وعادة ما تكون مضمنة مباشرة في صفحة الويب في تطبيقات Java ولغات البرنامج النصي. تنعكس دينامياتها في أن المستخدمين يستخدمون مختلف محتوى عرض صفحة الويب أو النماذج المدعومة من تقنيات مثل JavaScript و JavaApplet ، إلخ.
انعكاس بعد الفصل
مصمم خطة الدرس
الوحدة/العنوان/الرمز البريدي
بريد إلكتروني
رقم الاتصال
يقوم الطلاب بتصفح صفحة الويب وعرض موقع ويب بتخطيط صفحات واضح ومعقول ومميز ، ويكملون العمليات التالية.
اسم الموقع:
عنوان URL للصفحة الرئيسية:
عنوان الصفحة:
1. ما هي اللغة المكتوبة في صفحة الويب الثابتة؟ _____________________________________________________________
2. ما هي خصائص صفحات الويب الديناميكية؟ __________________________________________
3. ما هي تقنيات الويب الديناميكية الشائعة؟ _________________________________________________________________
المتطلبات التجريبية:
(1) تعرف على بعض الطرق البسيطة لتحقيق التأثيرات الديناميكية لصفحات ويب العميل من خلال الأمثلة القصيرة التالية لصفحات الويب الديناميكية.
(2) عن طريق تعديل خصائص كائن معينة في البرنامج ، Master طرق تعديل بسيطة للتأثيرات الديناميكية لصفحات الويب.
(3) إتقان طريقة بسيطة لإنشاء صفحات ويب ديناميكية عن طريق إدراج رموز التأثير الخاص على صفحة الويب في رموز صفحة الويب.
مثال على الخطوات التجريبية:
1. أدخل الكود المصدري لصفحة ويب ديناميكية على النحو التالي ، ومراقبة وتجربة التأثيرات الديناميكية لصفحة الويب التي تم إنشاؤها بواسطة قطاع التعليمات البرمجية على المتصفح.
<html>
<head>
<meta http-equiv = content-type content = text/html ؛ charset = gb2312>
<title> التأثير الديناميكي للنص </title>
</head>
<body>
<marquee onMouseover = this.stop () onMouseout = this.start () scrolllamount = 1 scrolldelay = 50 اتجاه = ارتفاع = 116 عرض = 188 الحدود = 1 bgColor = Olive> سوف يتوقف الماوس عند تحريكه ، ويستمر في التحرك عند تحريكه. قد تجربها كذلك </marquee>
</body>
</html>
2. صف التأثيرات الديناميكية التي يمكن تحقيقها بواسطة الكود أعلاه:
3. التطبيق العملي: وفقًا للمتطلبات في الجدول ، قم بتحليل وتعديل قيم السمة المختلفة في الكود ، ومراقبة التأثيرات الشخصية من خلال المتصفح ، وقارن التغييرات قبل التعديل وبعدها ، وملء النموذج بالكامل بناءً على نتائج الملاحظة الخاصة بك.
رمز في صفحات الويب الديناميكية
ما الذي يلعبه الرمز
1
onMouseover = this.stop () onMouseout = this.start ()
2
يشير إلى سرعة حركة النص
3
الاتجاه = UP (يمكن تغييره إلى: الاتجاه = الاتجاه الأيمن = يسار)
4
الارتفاع = 116 عرض = 188
5
يمثل لون الخلفية للنص المتحرك (يمكن تغييره إلى الألوان التالية: أحمر ، أصفر ، أزرق ، فضية ، إلخ)
4. التقييم التجريبي:
مؤشرات التقييم
التقييم الذاتي
جودة النشاط
تحليل وظيفة الكود في صفحات ويب العميل واضح للغاية
6
تحليل وظيفة الكود في صفحات ويب العميل أكثر وضوحًا
5
تحليل دور الكود في صفحات ويب العميل ، والتفاهم العام
3
يجب تحسين تحليل وظيفة الكود في صفحات ويب العميل
2
__________________________________________________________________________________0
__________________________________________________________________________________0
__________________________________________________________________________________0
__________________________________________________________________________________0
__________________________________________________________________________________0
__________________________________________________________________________________0
__________________________________________________________________________________________
__________________________________________________________________________________________