Directory UMM :Networking Manual:computer_network_books:

‫الثانية‬
‫المحاضرة الثانية‬
‫المحاضرة‬

‫المحتوى‬
‫تأليف المحتوى‬
‫أدوات تأليف‬
‫أدوات‬

‫على‬
‫ونشرها على‬
‫صفحات ونشرها‬
‫تصميم صفحات‬
‫تصميم‬
‫النترنت‬
‫النترنت‬

‫مقرر التعلم اللكتروني ‪ -‬دبلوم مصادر التعلم‬
‫عمادة خدمة المجتمع والتعليم والمستمر بجامعة جازان‬
‫أ‪.‬محمد أحمد مطهر‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫علين التعليم ‪ /‬التعلم اللكتروني في مج‬
‫كيف تف ع‬
‫• التعليم عن طريق البريد اللكتروني‪.‬‬
‫• التصميم التعليمي بواسطة برامج‬
‫التصميم التعليمي‪.‬‬
‫• التصميم التعليمي بواسطة برامج التصميم‬
‫عبر النترنت‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫ماذا تعرفين من برمجيات تصميم المحتوى‬
‫عبر النترنت؟‬
‫‪‬برمجيات تأليف المحتوى الثابت‪.‬‬
‫‪‬برمجيات تأليف المحتوى المتغير‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬

‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫ماذا تعرفين من برمجيات التصميم التعليمي‬
‫عبر النترنت؟‬
‫برمجيات تأليف المحتوى الثابت‪.‬‬
‫• باستخدام لغة كتابة النصوص المترابطة )‪- (HTML‬بالعتماد على‬
‫نقل النصوص ‪HTTP‬‬
‫ومن البرمجيات المستخدمة لذلك مثل ‪.Front page‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬

‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫ماذا تعرفين من برمجيات التصميم التعليمي‬
‫عبر النترنت؟‬
‫برمجيات تأليف المحتوى التعليمي ذات‬
‫المحتوى المتغير‪.‬‬
‫باستخدام بعض برمجيات ‪ Java‬أو أكتف إكس ‪Active‬‬
‫‪X‬‬
‫زة‬
‫جاه ن فر‬
‫م ص‬
‫ال‬

‫ويستخدم لذلك لغات خاصة مثل ‪:‬‬
‫)‪Microsoft Visual basic : (VBscripts‬‬
‫‪ASP‬‬
‫‪PHP‬‬
‫‪Java script‬‬
‫‪AuthorWare… Dream waver ...Swish …FLash..‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫تطبيق عملي‪ :‬عمل درس عبر النترنت )صفحة ساكنة بواسطة‬
‫‪FrontPage)0‬‬
‫تدريب )‪ (1‬إنشاء موقع ويب صفحة واحدة ويتم عن طريق‬
‫الخطوات التالية‪:‬‬

‫‪ (1‬ملف – جديد‪ -‬موقع ويب جديد – موقع ويب‬
‫صفحة واحدة‪.‬‬

‫‪ (2‬حدد موقع ويب صفحة واحدة ثم اكتب اسم‬
‫مجلد حفظ الصفحة‪ learning .‬على سبيل‬
‫المثال‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬

‫أدوات‬
‫ونشرها على النترنت‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫• نحاول نكتشف مكونات شاشة‬
‫برنامج فرونت بيح وكذا أوضاع‬
‫عرض الصفحات‪.‬‬
‫• نلحظ أن الصفحة سميت‬
‫بـ‪ Index,html‬وكذلك أنشئ‬
‫أكثر من مجلد منها مجلد‬
‫‪.Images‬‬
‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫ميم صفحة تعليمية‬
‫تص‬
‫‪ -‬تدريب )‪(2‬‬

‫‪(1‬‬
‫‪(2‬‬
‫‪(3‬‬
‫‪(4‬‬
‫‪(5‬‬

‫أدرج جدول ‪.4 ×1‬‬
‫نقسم الصف الول إلى ‪. 1×3‬‬

‫ندرج في الخلية ‪ ،1‬والخلية ‪ 3‬من الصف‬
‫الول صور مناسبة‪.‬‬
‫نكتب عنوان مناسب في الخلية ‪ 2‬من‬
‫الصف الول‪.‬‬
‫نعمل معاينة للصفحة بعد النتهاء من‬
‫تنفيذ الخطوات السابقة مع الحفظ‪.‬‬
‫هناك طريقتان للمعاينة اكتشفيها‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫ح ة تعل يم ية‬
‫ص مي م ص ف‬
‫ت‬
‫ت در يب ‪(3‬‬
‫‪)-‬‬

‫‪(1‬‬
‫‪(2‬‬
‫‪(3‬‬
‫‪(4‬‬

‫نضع المؤشر في السطر الثاني‪.‬‬
‫اختر إدراج )‪ ، (Insert‬ثم مكونات ويب)‪Web‬‬
‫‪(Components‬‬
‫اختر ‪ -Marquee‬ثم اكتب عبارة ترحيبية أو مثل أو‬
‫شعار ‪...‬‬
‫انقر الزر ‪ OK‬موافق‪.‬‬
‫نعمل معاينة‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫م ص فحة‬
‫ي تصمي‬
‫ال بدء ف‬
‫كت رون ية‬
‫ال‬
‫ر يب ‪(4‬‬
‫) تد‬
‫‪(1‬‬
‫‪(2‬‬
‫‪(3‬‬
‫‪(4‬‬
‫‪(5‬‬

‫انتقل إلى الصف الثالث بالجدول وانقر زر‬
‫الدخال عدد من المرات‪.‬‬
‫ننتقل إلى الصف الخير في الصفحة ثم نكتب‬
‫جميع الحقوق محفوظة©‪.2009‬‬
‫أضف اسم معد الموقع‪.‬‬
‫كتابة عنوان بريد الكتروني للمراسلة‪.‬‬
‫اعمل أمر الرجوع إلى أعلى الصفحة‪.‬‬
‫انقر زر معاينة‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫ص فحة‬
‫ي تص مي م‬
‫دء ف‬
‫الب‬
‫ل كت روني ة‬
‫ا‬
‫ري ب ‪(4‬‬
‫)تد‬

‫انتقل وانقر زر‬
‫بالجدول‬
‫اللكتروني‪-‬الثالث‬
‫إلى الصف‬
‫‪(1‬‬
‫استخدام أمر‬
‫انتقلالبريد‬
‫عمل ارتباط‬
‫الصفحة‬
‫الى أعلى‬
‫عدد من المرات‪.‬‬
‫الدخال‬
‫‪ (2‬انتقل إلى الصف الخير في الصفحة ثم قم‬
‫بكتابة جميع الحقوق محفوظة‪.‬‬
‫‪ (3‬اكتب اسم معد الصفحة‪.‬‬
‫‪ (4‬كتابة ” اتصل بنا“ ثم عمل ارتباط لعنوان‬
‫البريد اللكتروني‪.‬‬
‫‪ (5‬عمل أمر الرجوع إلى أعلى الصفحة‪ .‬انقر زر‬
‫معاينة‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬
‫تصميم صفحة تعليمية‬
‫‪ -‬تدريب )‪(6‬‬

‫طريقة كتابة المر الرجوع إلى أعلى‬
‫الصفحة‬
‫‪(1‬كتابة النص“ أعلى الصفحة“ في المكان‬
‫المرغوب‪.‬‬
‫‪ (2‬اختيار المر ”‪ “Insert Hyperlink‬من‬
‫القائمة إدراج ” ‪.“Insert‬‬
‫‪ (3‬أكتب المر ‪. Top#‬‬
‫‪ (4‬موافق‪.‬‬
‫اختر معاينة لختبار صحة تنفيذ المر‪.‬‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫حة تعل يم ية‬
‫ميم صف‬
‫تص‬

‫تمارين‬
‫‪(1‬‬
‫‪(2‬‬
‫‪(3‬‬
‫‪(4‬‬

‫لو أردنا عمل خلفية للصفحة ‪ ،‬ما الخطوات‬
‫اللزمة لعمل ذلك؟‬
‫كيف يمكن تغيير عنوان الصفحة ؟‬
‫هل يمكن عمل خلفية صوتية للصفحة؟‬
‫لو أردت معرفة مدى القبال على الصفحة ‪ ،‬ما‬
‫الخطوات التي نقوم بها؟‬

‫السابق‬

‫خروج‬

‫التالي‬

‫الثالثة‬
‫المحاضرة‬
‫المحتوى‪ :‬تصميم صفحات‬
‫تأليف‬
‫أدوات‬
‫ونشرها على النترنت‬

‫السابق‬

‫خروج‬

‫التالي‬