تصميم مواقع الإنترنت - تكنولوجيا المعلومات والاتصالات 1 - سادس ابتدائي

الدرس 8 تصميم مواقع الإنترنت الأهداف بعد الدرس، أضع علامة / في المربع المناسب لـ «يمكنني أن...». بحاجة إلى مجهود أكبر جيد جدًّا بحاجة إلى مجهود أكبر بحاجة إلى مجهود أكبر في نهاية الدرس، سأكون قادرًا على أن: • أكتب كود لغة ترميز النص التشعبي HTML لأجزاء جيد جدا أساسية من صفحة ويب. . أحدّد بعض مكوّنات لغة ترميز النص التشعبي HTML الخاصة بصفحات الويب. . أبتكر فكرة وأخطّط لإنشاء موقع إلكتروني يروج لمنتج متطوّر. لنتفاعل معا أذكر ثلاثة مواقع إنترنت مفضّلة لديك. ما الذي يعجبك فيها؟ لنتعلم وسوم لغة ترميز النص التشعبي HTML لغة ترميز النص التشعبي (HTML) هي لغة البرمجة القياسية المستخدمة في إنشاء صفحات الويب. وهي تصف هيئة صفحة الويب، وتتكوّن من سلسلة من العناصر الأساسية لإنشاء هذه الصفحة، مثل العناوين، والفقرات والروابط، والصور. تقرأ متصفحات الويب مستندات مكتوبة بلغة ترميز النص التشعبي، وتعرض المحتوى وفقًا لوسم لغة ترميز النصّ التشعبي (HTML (Tag). تتكوّن الوسوم من ثلاثة أجزاء رئيسة : وسم البداية opening tag)، والمحتوى النصّي (content) ، ووسم النهاية closing tag). أكبر عنوان أكبر عنوان • عنوان فرعي عنوان فرعي أصغر عنوان أصغر عنوان 38 فقرة استخدم هذا الوسم لإنشاء فقرة. وعادة ما تحوي الفقرة عدة جمل. هذا هو أكبر خط. مقاس الخطّ ولونه هذا هو أصغر خطّ، ولونه أحمر. الرابط التشعبي زر موقع بنك المعرفة المصري https://www.ekb.eg" كتابة بارزة خط عريض <h1>Largest heading</h1> <h2>Subheading</h2> <h6>Smaller Subheading</h6> <p>Use this tag to create a paragraph. A paragraph usually has more than one sentence.</p> <font size="1"> <font size="a"> <a href= <font color=red> "https://www.ekb.eg"> Visit the Egyptian Knowledge Bank</a> <i>Emphasized text</i> <strong>Bold text</strong>

تصميم موقع الكتروني تقسم عناصر لغة ترميز النص التشعبي صفحات الويب لتسهيل إمعان النظر فيها وقراءتها وتصفّحها. يساعد كود لغة ترميز النص التشعبي أيضًا الأشخاص ضعاف البصر على التمييز بين أجزاء صفحة الويب. يمكنك بمساعدة معلّمك إضافة وسمي صورة ونصّ بديل. تجذب الصور الانتباه أيضًا، ويمكن أن تثير مشاعر مختلفة. Name My web page أكبر عنوان يكون في الجزء العلوي من الصفحة ويلفت الانتباه. سيارات ذاتية القيادة السيارات ذاتية القيادة وإمكانية التنقل تسهل العناوين الفرعية فحص النص بدقة حتى يتمكن القارئ من العثور على المعلومات التي يريدها. توجد الآن السيارات ذاتية القيادة، ولكن قد يستغرق الأمر سنوات قبل أن تكون هذه السيارات وسائل مساعدة على الحركة للأفراد المكفوفين وضعاف البصر. يمكن تصميم السيارات بأبواب واسعة وأرضيات مسطّحة بحيث تسع الكراسي المتحركة. متاحة للجمهور. لنستكشف يسهل النص المقسم إلى فقرات على القارئ البحث عن المعلومات التي يريدها. سوف تُنشئ موقعا إلكترونيًا باستخدام لغة ترميز النص التشعبي. فكَّر في المعلومات التي جمعتها عن منتج التكنولوجيا المساعدة المتطوّرة الذي اخترته في الدرس .4 ما أفضل طريقة يعرض بها الموقع الإلكتروني هذا المنتج؟ ممَّ يستفيد المستخدمون عند زيارة هذا الموقع الإلكتروني؟ لنراجع .1. أي مر من عناصر لغة ترميز النص التشعبي التي قرأت عنها في قسم "لنتعلَّم" تظهر عندما تطلع على صفحة ويب ؟ ما الذي لا تستطيع رؤيته إلّا عند اختيار خاصية "فحص " على صفحة الويب؟ 2. الآن بعد أن تعلّمت المزيد عن كيفية إنشاء صفحة ويب هل لديك فكرة أفضل، أو فكرة مختلفة عن سبب إعجابك بالموقع الإلكتروني الذي وصفته في قسم "لنتفاعل معا"؟ ما هذه الأفكار ؟ تقييم ذاتي هي ارجع إلى الأهداف المذكورة في بداية الدرس، وضَع علامة 7 في المربع المناسب لـ «يمكنني أن 39

لنتعلم من الدرس 8 تصميم مواقع الإنترنت خلال التطبيق المهارات الحياتية .1. خطّط واكتب لغة .1 استخدم المعلومات التي ناقشتها مع زميلك في الفصل في قسم "لنستكشف" لكتابة وسوم ترميز النص التشعبي لعنوان صفحة الويب الخاصة بك (موضوعك) ، والعناوين الفرعية لأفكارك الثلاث الرئيسة. عنوان الصفحة 40 العنوان الفرعي 1: العنوان الفرعي 2: العنوان الفرعي 3 2. استخدم وسم لغة ترميز النصّ التشعّبي الخاصة بالفقرة لكتابة جملة تمهيدية لكلّ فكرة من .1 .2 .3 أفكارك الثلاث الرئيسة. صور 3. استخدم وسوم لغة ترميز النصّ التشعّبي الخاصة بالصورة لتحديد ثلاث ستستخدمها داخل صفحة الويب الخاصة بك. بعدها، استخدم وسوم لغة ترميز النص التشعبي الخاصة بالنص البديل لوصف الصور. .1 .2 .3 وسوم لغة ترميز النصّ التشعّبي الخاصّة بالصورة وبالنص البديل

4. فكّر في موضوع موقعك الإلكتروني، والهدف من إنشائه، ثمّ دوّن الملاحظات في الجدول التالي. ما الألوان التي ستستخدمها ما نوع الخط الذي في كتابة النص ؟ وماذا عن ستستخدمه؟ هل تسهل قراءته؟ ما مقاس الخطّ ؟ ألوان الخلفية؟ ما تنسيق الموقع الإلكتروني؟ كيف يمكنك تنظيم المحتوى بحيث يسهل على الأشخاص الوصول إليه ؟ .2. ضع مخطط صفحة الويب الخاصة بك ضَع مخطّط صفحة الويب الخاصة بك على شكل مُلصَق ، أو صمِّمه باستخدام برنامج مايكروسوفت .Word 3. شارك مخطّط صفحة الويب الخاصة بك اعرض مخطّط صفحة الويب الخاصة بك على زملائك في الفصل. سيقدّم لك زملاؤك ملاحظاتهم، لذا أصغِ إلى آرائهم بانتباه. أنا وتكنولوجيا المعلومات والاتصالات 4. إقرأ وناقش 1. ما نقاط القوّة في مخطّط صفحة الويب الخاصة بك ؟ وما التغيير الذي قد ترغب في إحداثه في هذا المخطّط؟ .2 ما شعورك بعد أن تعلمت أساسيات لغة ترميز النص التشعّبي، وكيفية تصميم صفحة ويب؟ .3 كيف يمكنك تطبيق هذه المهارات الجديدة في المستقبل ؟ 41