‏إظهار الرسائل ذات التسميات انشاء وتصميم صفحات ويب. إظهار كافة الرسائل

السبت، 18 يوليو 2020

الخطوط

في هذا الدرس سنتناول كيفية تنسيق الخطوط داخل صفحات الويب باستخدام لغة HTML

نستطيع إجراء العديد من التنسيقات على النص بأكثر من طريقة والتنسيق الأساسي للنص يشمل (حجم الخط font size- نوع الخط font type- لون الخط font color- حالة الخط مثل مائل - سميك - أسفله خط )
يوجود نوعين من الاوسمة داخل HTML لتنسيق الخطوط

وسم تنسيق خط الصفحه بالكامل <basefont>
وسم تنسيق نص محدد داخل الصفحة

أولاً: وسم <basefont> : هو وسم فردي اي لا يوجد له وسم نهايه ويستخدم لتنسيق نص الصفحة بالكامل أي يقوم بتغير نوع الخط الاساسي واللون والحجم للصفحة من بدايتها لنهايتها.ويفضل كتابته بعد وسم <body> مباشرة

ملحوظة: وسم <basefont> متوافق مع انترنت اكسبلورر, وتم ايقافه في لغة Html 5

الخاصية الاولي name : تستخدم لتغير نوع الخط المستخدم

الخاصية الثانية color : تستخدم لتغير لون نص الصفحة

الخاصية الثالثة size : تستخدم لتغير حجم الخط

مثال 1:

عند تطبيق هذا الوسم سيتم تغير نوع الخط المستخدم داخل الصفحة كاملة الي Simple Outline Pat وتغير لون الخط الافتراضي الي اللون الاحمر ويتم تغير حجم خط الكتابة الي الحجم 5.

ثانياً: وسم : يستخدم للتحكم في الخطوط من حيث النوع واللون والحجم لنص محدد

الخاصية الاولي face: تستخدم لتحديد نوع الخط المستخدم

الخاصية الثانية color : تستخدم لتحديد لون الخط المستخدم

الخاصية الثالثة size : تستخدم لتغير حجم الخط ويوجد سبعة أحجام لأى خط والقيم تتراوح ما بين 1 الي 7 والحجم الافتراضي للخط هو 3

مثال 2:

this font is impact , color is green and size is 5

عند تطبيق هذا الوسم سيتم تغير نوع الخط المستخدم الي impact واللون الي الاخضر والحجم الي 5 للنص المحدد وهو

"this font is impact , color is green and size is 5"

مثال 3:

this font is Arial , color is red and size is 3

عند تطبيق هذا الوسم سيتم تغير نوع الخط المستخدم الي Arial واللون الي الاحمر والحجم الي 3 للنص المحدد وهو

"this font is Arial , color is red and size is 3"

مثال 4:

عند تطبيق المثال السابق سيتم تطبيق كل وسم من الاوسمة علي النص المحدد داخل الوسم بنوع خط وحجم خط مشترك ولكن لون الخط هو المختلف لتظهر النتيجة كما في الصورة التالية

سيتم شرح بعض الاوسمة المستخدمة في تنسيق النصوص في درساً لاحق ان شاء الله

الخميس، 25 يونيو 2020

الشبكة العنكبوتية

سنتناول في هذا المقال مفهوم شبكة الانترنت ومفهوم الشبكة العنكبوتية (World Wide Web) وبعض المفاهيم والمصلحات المتعلقة بهما.

تمهيد:

كانت بداية الإنترنت في الأيام الأولى من ابتكار الحاسب الآلي وذلك في عام 1965م حيث تمّ إنشاء جهازي حاسب يتّصلان مع بعضهما البعض بواسطة تقنية تبديل الحزم ، وفي عام 1969م طوّر الباحثون في شبكة وكالة مشاريع الأبحاث المتقدّمة التّابعة لوزارة الدّفاع الأمريكية (ARPANET) العديد من البروتوكلات المستخدمة للاتّصال عبر الإنترنت في الوقت الحالي باستخدام طريقة إعادة التوجيه.

وفي 1973م تمّ التّواصل بين كلية لندن الجامعية في إنجلترا ومؤسّسة Royal Radar في النّرويج بواسطة ARPANET، ومن هنا وُلد مصطلح الإنترنت

ما هي شبكة الانترنت؟

شبكة الانترنت :هي شبكة عالمية تربط الملايين من أجهزة الكمبيوتر حول العالم بعضها ببعض، وتقوم هذه الأجهزة بإرسال وإستقبال المعلومات من أي جهازلأي جهاز آخر باستخدام برتوكول الانترنت.
تضم الشبكة عدة خدمات (بريد الكتروني- الدردشة- تصفح الشبكة العنكبوتية – مؤتمرات الفيديو.......)

ما هي الشبكة العنكبوتية؟

الشبكة العنكبوتية: هي شبكة ضخمة من المواقع الالكترونية المختلفة المرتبطة ببعضها البعض من خلال روابط تشعبية ويستدل عليها من خلال عناوين مواقع الكترونية ويتكون الموقع من نوع أو اكثر من الملفات. الشبكة العنكبوتية هي أحد خدمات شبكة الانترنت.

ما هو موقع الانترنت؟

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

ما هي الصفحة الرئيسية؟

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

ما هو الرابط التشعبي؟

الرابط التشعبى:هو ارتباط من صفحة الى آخري. عندم يقوم الزائر بالنقر فوق الارتباط التشعبى يتم عرض الوجهة أو فتحها في مستعرض ويب.
امثلة للرابط التشعبي:

الفصل الثاني: المفاهيم الأساسية لتصميم ونشر وإدارة مواقع الانترنت

درس تمهيدي للغة html

شرح وسم body

ما هو الحاسب الخادم؟

الحاسب الخادم: يطلق على الحاسب الذى يستخدم في تقديم خدمات تفيد مجموعة من المستخدمين العاملين على حاسبات أخري (مكتبة أو محمولة).

بعض أنواع الحاسبات الخادمة:

1. الحاسبات الخادمة لمواقع الانترنت: يتم استخدامها في استضافة مواقع الانترنت وقد يستضيف الخادم موقع واحد أو أكثر، ويتيح لزوار الموقع تحميل صفحات الموقع على حاسبهم الشخصي.

2. الحاسبات الخادمة للبريد الالكترونى: تقدم خدمات البريد الالكترونى لمستخدمى الانترنت.

3. حاسبات الملفات الخادمة: يتم تخزين الملفات بها لكي يستطيع عدد من المستخدمين التعامل مع هذه الملفات في أي وقت. وتتميز بوحدات التخزين ذات السعات العالية.

يوجد العديد من الأجهزة الخادمة (خادم الطابعة – خادم قواعد البيانات وغيرها.....)

عنوان موقع الويب

عنوان موقع الويب: هو عنوان فريد لا يكرر أبدا يسمى العنوان الالكترونى ويستخدم في تحديد مصدر الموقع والمسار.

ويمكن ان يكتب على طريقتين

الاولي : أربعة أعداد تنفصل عن بعضها بنقاط.

الثانية: أحرف لغوية قد يكون معها ارقام وهى الطريقة المتبعة.مثال: http://www.google.com

ويتكون هذا العنوان من الاجزاء الآتيه:

http : وهو برتوكول من برتكولات الانترنت
www : الموقع المبني وفق معايير الشبكة العنكبوتية
اسم الموقع : ويكون بالانجليزية وبدون مسافات.
.com : ويدل على نوعية مجال الموقع وهو موقع تجاري ويوجد نوعية اخري مثل (edu - تعليمي) (mil - عسكري) (net - شبكة أعمال ).

متصفح الانترنت

متصفح الانترنت: برنامج يسمح للمستخدم باستعراض النصوص والصور والملفات ومحتويات أخرى مختلفة مخزنة على الحواسب الخادمة.

رقم الجهازIP Address

رقم الجهازIP Address: هو المعرف الرقمى لجهاز الحاسب الالى المتصل بالانترنت أو بالشبكة المحلية وكل جهاز له عنوان خاص به ويتميز بانفراده.

نظام أسماء النطاقات:

نظام أسماء النطاقات: هو نظام يخزن معلومات تتعلق بأسماء النطاقات في قاعدة بيانات موزعه علي الانترنت.

تعريف آخر: هو نظام يقوم بترجمة أسماء النطاقات منكلمات الي أرقام تعرف باسم(ip address).

برتوكولات الانترنت

برتوكولات الانترنت: هي مجموعه من القوانين والاجراءات التي تستخدم للتحكم بجميع أشكال الاتصال والتفاعل بين أجهزة الكمبيوترالمختلفة علي الشبكة.

1- بروتوكول نقل النص الفائق(http): يستخدم في نقل ملفات المواقع من الخادم حيث يوجد الموقع الي جهازك للتصفح الموقع.

2- بروتوكول نقل الملفات(ftp): يستخدم لنقل الملفات من وإلي أي جهاز خادم عبر الانترنت.

3- بروتوكول smtp: يستخدم في إرسال رسائل البريد الالكتروني.

4- بروتوكول PoP3: يستخدم في إستقبال رسائل البريد الالكتروني.

5- بروتوكولSNMP: يستخدم في إدارة الشبكات البسيطة.

6- بروتوكول ARP: يستخدم لايجاد رقم كارت الشبكة الموجود بالحاسب المتصل بالانترنت.

7- بروتوكول telnet : يستخدم لتمكين أي شخص من الوصول لأي حاسب علي الانترنت والتحكم الكامل به باستخدام اسم الدخول وكلمة السر

كيفية الاتصال بالانترنت:

ما هي الوسائل المستخدمة للاصال بالانترنت؟

1- جهاز كمبيوتر يمكنه الاتصال بالانترنت.

2- مزود خدمة انترنت.

3- وسيلة اتصال.(خط هاتف ومودم – وصلة dsl – خط رقمي مستأجر – اتصال لاسلكي – هاتف محمول مدعم بالـ GPRS)

4- برامج الانترنت (تصفح – بريد الكتروني- مكافح فيروسات)

5- قد يقتضى الامر الي اسم مستخدم وكلمة مرور.

مجالات وتطبيقات استخدام الانترنت:

1- التصفح والبحث: التصفح هو الإطلاع علي الموقع والوصول الي المعلومة المطلوبة في حالة معرفة عنوان الموقع الموجود علي المعلومة ، أما في حالة عدم معرفة الموقع فيتم استخدام محركات البحث للبحث عن المعلومات علي الانترنت. ويتم البحث أما علي أساس الموضوع أو باستخدام الكلمات الاساسية.

محركات البحث: هي أنظمة خدمات مجانية متوفرة علي الانترنت تقدم خدمة البحث عن المعلومات على الانترنت. ويوجد العديد من محركات البحث

2- البريد الالكتروني: هو صندوق بريد خاص بك على الانترنت يمكنك من خلاله إرسال واستقبال الرسائل الالكترونية من والي أي شخص ويمكن ان ترفق مع الرسالة مرفقات(صور – مستندات – فيديو....)

يوجد نوعين من البريد الالكتروني ( قياسي – مبني علي الويب)

البريد القياسي: يتم الحصول عليه من مزود خدمة الانترنت.

المزايا:

1- مؤمن بشكل جيد.

2- تستطيع إرفاق ما تشاء من الملفات بأي عدد وبأي حجم.

3- مساحة الصندوق كبيرة.

4- لا توجد إعلانات.

العيوب :

1- لا تستطيع استخدامه إلا من جهازك.

2- التكلفة العالية.

البريد المبني علي الويب: هو الحصول علي بريد من أحدي الشركات المزودة لخدمة البريد بالمجان.

المزايا:

تسطيع استخدامه إينما كنت طالما توفر الانترنت.

العيوب:
· غير مؤمن.

· مساحة الصندوق محدودة.

· توجد إعلانات.

· لا تستطيع ارفاق ملفات كثيرة.

3- تبادل ونقل الملفات: يتم تبادل ونقل الملفات بين مستخدمين الانترنت وبعضهم البعض مباشرة أو من والي المواقع باستخدام برامج تبادل الملفات.

4- الدردشة: هي عملية تواصل مباشرة بين شخصين أو اكثرمتصلين في شبكة الانترنت في آن واحد من خلال برامج ومواقع خاصة بالدردشة.

أنواع الدردشة (محادثة نصوص – محادثة صوت – محادثة وسائط متعددة)

5- مؤتمرات الفيديو: هي أحد وسائل الاتصالات المرئية من خلال الانترنت حيث يتم نقل الصوت والصورة في مكان آخر في العالم.

المزايا:

1. يوفر الوقت والجهد والتكاليف.

2. إدارة الحوار بين مجموعة من الأشخاص يصعب تجميعهم في وقت واحد.

3. تكلفة زهيدة الي حد كبير.

4. تبادل الملفات والوثائق.

الأنواع: (مؤتمر بين شخصين – مؤتمر بين عدة أشخاص)

6- التعليم الالكتروني: هو طريقة للتعليم باستخدام وسائل الاتصالات الحديثة من حاسب وشبكات ووسائط متعددة ووسائل بحث ومكتبات الكترونية لإيصال المعلومة إلي المتعلم بأقصر وقت وأقل جهد.

7- التجارة الالكترونية: تنفيذ كل ما يتصل بعمليات بيع وشراء السلع والخدمات والمعلومات بين المؤسسات والأفراد والحكومات باستخدام شبكة الانترنت.

وتضم التجارة الالكترونية عدة انشطة:

عمليات توزيع وتسليم السلع ومتابعة الاجراءات
سداد الالتزامات المالية
ابرام العقود والصفقات
الاعلان عن السلع والبضائع والخدمات
تبادل البيانات الكترونياً (سداد الفواتير - كتالوجات الاسعار - الاستعلام عن السلع)
التفاوض بين البائع والمشتري

مثال شركة جوميا وشركة سوق دوت كوم

8- الطب : تم استخدام الانترنت في المجال الطبي حيث استخدمه الأطباء في التواصل فيما بينهم وتطوير البحوث الطبية وإجراء العمليات الجراحية وأخذ استشارة الأطباء من عدة دول.

الثلاثاء، 16 يونيو 2020

الدرس الثاني في لغة HTML (وسم body)

الدرس الثاني في لغة HTML

وسم الـ <body>

تحدثنا في الدرس السابق عن البنية الاساسية لملف HTML الدرس الاول في لغة HTML في هذا الدرس سنتعلم كيفية التحكم في وسم <body> وتعديل خصائص الوسم المختلفة.

س: ما فائدة وسم الـ <body> داخل صفحة الويب؟

ج: وسم الـ <body> يعتبر اهم جزء في صفحة الويب حيث انه المتحكم الكامل في المظهر العام للصفحة واضافة تأثيرات جمالية للصفحة. وهذا الوسم يكتب في بداية الصفحة فقط وعند نهاية الصفحة نستخدم وسم النهاية <body/>

لكل وسم في لغة HTML مجموع من الخصائص للتحكم في الكيفية الذي يعمل بها الوسم.

لنبدأ شرح خصائص وسم الـ <body>:

الخاصية الاولي bgcolor لوسم الـ <body> :تقوم بتحديد لون خليفة للصفحه

مثال1:

</body>

في هذا المثال تم تغيير لون الصفحة من اللون الافتراضي الي اللون الاخضر باستخدام الخاصية "bgcolor="green

مثال2:

</body>

في هذا المثال تم تغيير لون الصفحة من اللون الافتراضي الي اللون الاحمر باستخدام الخاصية "bgcolor="red

لاحظ اننا كتبنا الخاصية متبوعه بعلامة = ثم كتبنا قيمة الخاصية

مثال3:

</body>

في هذا المثال تم تغيير لون الصفحة الي اللون الابيض باستخدام الخاصية "bgcolor="ffffff

لاحظ اننا في هذا المثال تم استخدام كود بدلاً من استخدام اسم اللون فما يعني هذا الكود " الكود هو مزيح من الالوان الاساسية الاحمر والاخضر والازرق" لمعرفة المزيد راجع هذا المقال القليل عن الالوان في لغة HTML

الخاصية الثانية background لوسم الـ <body> :تقوم بتحديد صورة خليفة للصفحه

وتكتب كالتالي

background="اسم الصورة. امتدادالصورة"

مثال1:

</body>

مثال 2:

</body>

قبل الشروع في العمل مع خاصية جديدة من خواص وسم الـ <body> نحتاج ان نعرف المزيد عن انواع الصور من اجل الالمام بالخاصية السابقة:

يزخر عالم الحاسب الآلي بالعديد من انواع الصور تختلف عن بعضها في الدقة وعدد الالوان التي تستوعبها الصورة والحجم لذلك يوجد العديد منها (.jpg, .jpeg, .bmp, gif ,وغيرها)

الخاصية الثالثة text لوسم الـ <body> : تقوم بتغيرلون نص الصفحه الاساسي

مثال1:

</body>

الخاصية الرابعة link لوسم الـ <body> : تقوم بتغيرلون الارتباط التشعبي

الارتباط التشعبي هو الارتباط بملف او صوره او صفحة خارجية أو داخلية او ارتباط الي جزء من أجزاء الصفحة مثل الروابط الظاهرة في نتائج البحث لموقع جوجل

مثال1: لون الارتباط التشعبي الافتراضي ازرق قبل تعديله باستخدام الخاصية كما هو ظاهر بالصورة التالية:

مثال 2: تطبيق الخاصية link

في هذا المثال تم تغير لون الارتباط التشعبي الي اللون الوردي بدلا من اللون الافتراضي (الازرق) كما في الصورة التالية

الخاصية الخامسة vlink لوسم الـ <body> : تقوم بتغيرلون الارتباط التشعبي الذي تم زيارته:

مثال: في هذا المثال يتم تغير لون الارتباط التشعبي الذي تم زيارته (اي الرابط الذي سننتقل اليه) الي اللون الرمادي

الخاصية السادسة alink لوسم الـ <body> : تقوم بتغيرلون الارتباط التشعبي النشط:

مثال: في هذا المثال يتم تغير لون الارتباط التشعبي النشط (الذي يتم الضغط عليه الآن) الي اللون الاصفر

القليل عن الالوان في لغة HTML

تستخدم الالوان في لغة HTML لاضافة تاثيرات جمالية الي الصفحة.

ويوجد طريقتين لاستخدام الالوان في لغة HTML

استخدام اسم اللون المطلوب للخاصية. (red, green, black, pink,.....)
استخدام كود اللون و هي تستخدم رموز " hexadecimal "(يتم كتابة هذا الكود باستخدام النظام العددي السادس عشر) وهو خليط من الأحمر و الأخضر و الأزرق. وهذا ما يستخدمة العاملين في مجال الدهانات باستخدام الحاسب الآلي.

أسماء الألوان :

qua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, pink, and yellow

وهذه الالوان هي ما تدعمه" W3C CSS standard " اما باقي الالوان يتم استخدام نظام الكود hexadecimal وفي الصور التالية يظهر فيها الكود المخصص للون وهذا الكود مكون من ثلاثة خانات (خانة للون الاحمر - خانة للون الاخضر- خانة للون الازرق ) وكل لون من الالوان الثلاثة له قيمة تبدأ من 0 وتنتهي 255 والمزيج من هذه الالوان بدرجاتها نحصل علي الالوان الأخري.

الكود المخصص للون الازرق هو 0000ff نلاحظ اول رقمين من ناحية اليسار هو 00 للون الاحمر ويليها 00 للون الاخضر اما ff في هي اعلي قيمة للون الازرق

الكود المخصص للون الاخضرهو 00ff00 نلاحظ اول رقمين من ناحية اليسار هو 00 للون الاحمر ويليها ff للون الاخضر وهي اعلي درجة للون الاخضر اما 00 هي للون الازرق

نلاحظ أن أي لون هو مزيج وبنسبة معينة من درجات الالوان الثلاثة واليكم امثله لبعض الالوان كما بالصورة التاليه

نلاحظ من المثال السابق ان اللون الابيض يشار اليه بالكود ffffff# اما اللون الاسود يشار اليه بالكود 000000#

ملحوظة: عند استخدام نظام الاكواد داخل لغة HTML بعض المتصفحات لاتتعرف علي رموز الالوان الا عن طريق استخدام إشارة # لذلك من المفضل استخدامها مع الكود المخصص للون.

س: ما اقصى عدد من الالوان الموجودة؟

كما تحدثنا سابقاً أن الالوان المستخدمة ما هي الا مزيج من الالوان الثلاثة RGB الاحمر والاخضر والازرق بدرجاتها ولكل لون 256 درجة اي اننا نحصل علي عدد اجمالي 256*256*256=16777217 لون

الثلاثاء، 19 مايو 2020

المفاهيم الأساسية لتصميم ونشر وإدارة مواقع الانترنت

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

المفاهيم الأساسية لتصميم ونشر وإدارة مواقع الانترنت:

تصميم موقع الويب: يعني تصميم الشكل أو الإطار الذي ستوضع فيه مكونات الموقع من نصوص وصور وأفلام وغيرها.
برمجة الموقع : هي الآلية التي تتحكم في عمل مكونات الموقع باستخدام أحد لغات البرمجة(html – php - asp )
إنشاء الموقع: يعنى التنفيذ ودمج العناصر المختلفة من التصميم والبرمجة للخروج بموقع متكامل قابل للعمل.
نشر الموقع: نسخ كافة الملفات التي تكون موقع الويب الي جهاز خادم لاستضافة مواقع الويب.

يجب إتباع هذه الإرشادات قبل نشر الموقع:

التحقق من عدم وجود ارتباطات تشعبية مقطوعة.

التحقق من أن الصفحات لها المظهر الذي تريده

معاينة الموقع في المستعرض والتنقل فيه.

مراجعة حالة الملفات في طريقة العرض تقارير.

5. إدارة الموقع: التحكم الكامل بالوقع ويقوم بهذه المهمة مدير الموقع.

مهام مدير الموقع :

· إدارة صلاحيات المستخدمين.

· الإشراف علي التغييرات في محتوى الموقع.

· الاهتمام بالطلبات والشكاوى.

· الاهتمام بمشاكل الاستضافة.

· عمل نسخة احتياطية من الموقع.

موقع الانترنت يشتمل علي مكونين رئيسين:

المحتوي: هو المعلومات المتوفرة لزوار الموقع بجميع أشكالها من نصوص وصور وأفلام وغير ذلك. وهو الجزء الأهم في الموقع ويتم صياغته باستخدام لغة موحدة لبرمجة صفحات الويب وهي لغة HTML.

التصميم: هو طريقة تقديم محتوى الموقع باستخدام الخطوط والالوان وترتيب العناصر والصور وغيرها. هدف التصميم هو تسهيل الوصول الي المعلومة مع إضفاء لمسه جمالية للمحتوي وكسر جموده.

أنواع الصفحات موقع الانترنت :

أ- الصفحة الرئيسية:تحتوي علي عنوان الموقع وهدف الموقع وعناوين بمحتوياته. وهذه الصفحة دائما تقع في مقدمة الموقع علي شبكة الويب ، وهي تحتوي علي روابط إلى الصفحات الفرعية.

ب- صفحات المحتوي : تحتوي علي المحتوي نفسه ، وكل صفحة محتوي يجب ان تحتوي علي وصلة خاصة بالصفحة الرئيسية للموقع ، كما يجب ان تحتوي علي وصلة خاصة بالصفحات السابقة والصفحات التالية التي تدعم محتوي الصفحة.

وتحتوي صفحات المحتوي علي الاجزاء الاتية :

رأس الصفحة :يحتوي علي عنوان الموقع او شعار خاص بالمؤسسة التابع لها الموقع ويحتوي علي وصلات تقودنا الي صفحات اخري موجودة في الموقع ويحتوي ايضا علي وصلات خاصة بالخدمات التفاعلية مثل البريد الالكتروني الخاص بمؤلف الموقع والخاص بالمؤسسة التي تضمنت الموقع بالرعاية ووصلة التحادث.

جسم الصفحة (Body) :وهي تحتوي علي الموضوع الفعلي للصفحة ويكون الموضوع او محتوي الصفحة في منتصف الشاشة حتي يكون اول جزء يقع عليه عين المستخدم. وهذا الجزء يحتوي علي نصوص وروابط.
ذيل الصفحة: هذا الجزء يحتوي علي معلومات هامة عن الموقع مثل اسم المؤلف والبريد الخاص به ، واسم المؤسسة التي تضمنت موقع الانترنت بالرعاية ان وجدت كما يحتوي ايضا علي تاريخ بناء الموقع واخر تحديث له. وعدم وجود هذه المعلومات قد يقلل من مصداقية الموقع عند المستخدم.

تصنيف مواقع الانترنت :

أولاً: حسب غرض الاستخدام:

أ‌-مواقع شخصية:تأخذ هذه المواقع طابع الشخص الذي تتحدث عنه بين صفحاتها وهي تخدم توجيهاته وأهدافه وتقدم لزائري الموقع تغطية لنشاطاته وتزودهم بالكثير من الوصلات والعناوين المفيدة علي صعيد الاهتمامات الشخصية. وهذه المواقع تحتوي علي بيانات شخصية خاصة بفرد معين علي سبيل المثال موقع الانترنت الخاص بالأستاذ الجامعي

ب- مواقع مؤسسية :هي كل المواقع التجارية والمؤسسات العالمية والمنظمات التي تعني بالعمل العام أو التجاري أو الرياضي وكافة المجالات والأنشطة.

ج- المواقع البوابية: وهي مواقع ضخمة تتضمن محركات بحث وفهارس للمواضيع والشركات ، وتختص في عدة مجالات مثل الروايات الادبية، الحاسب ومجالاته، مواقع دينية وغيرها.

ثانياً: حسب الإنشاء والبنية التحتيه:

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

ثالثاً: حسب تنظيم الموقع:

1. التنظيم المتسلسل: يعد من ابسط طرق التنظيم حيث يتم تقديم صفحات الموقع في صورة خطية (Liner) مع ربط الصفحات مع بعضها البعض في صورة منطقية بشكل متتالي. ويستخدم هذا التنظيم في مواقع الويب الصغيرة.

2. التنظيم الشبكي: ويستخدم هذا التنظيم عادة في مواقع الانترنت الخاصة بمقررات او كورسات لمؤسسة تعليمية في الطب مثلا او أي علم آخر. ومن أهم مميزات هذا التنظيم ان مستخدم الموقع يستطيع ان يقرأ المحتوي بصورة منطقية من اعلي الي اسفل او من أي مكان فيه ، كما ان هذا النوع من التنظيم يساعد المستخدم علي المقارنة بين المتغيرات الخاصة بمحتوي الموقع.

3. التنظيم الهرمي: ويتم البدء في هذا التنظيم بالصفحة الرئيسية ويتفرع منها عدة صفحات وكل صفحة منهم تقودنا الي صفحة اخري او عدة صفحات فرعية اخري.

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

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

الخميس، 7 مايو 2020

الدرس الاول في لغة HTML

لغة HTML

—يشير الإختصار HTML إلى عبارة HyperText Markup Language أو لغة الترميز المتشعبة.

—وهي اللغة المستخدمة في تصميم جميع صفحات الويب.

—تكتب ملفات HTML في صورة ملفات نصوص بسيطة، تأخذ الإمتداد .html عادة، وتكتب في أي برنامج للنصوص البسيطة مثل الـ Notepad

—لغة HTML لا تراعي حالة الأحرف من حيث كونها كبيرة أو صغيرة.

—يمكن إحاطة قيم الخصائص بعلامة إقتباس مزدوجة ( " ) أو مفردة ( ' )، ويمكن أيضا عدم إحاطتها بأي منها إذا كانت القيمة تتألف من كلمة واحدة دون مسافات.

—بعض الوسوم تحتاج إلى وسم إغلاق وبعضها لا يحتاج إليه.

—لغة HTML لا تراعي المسافات البيضاء، وتعتبرها جميعا مسافة واحدة

—توضع التعليقات بين  أي أن المتصفح يتجاهل أي شيء بينهما وكأنه غير موجود.

بنية ملف HTML

يتكون ملف من جزئين رئيسيين هما :

—الرأس Head : يحتوي على المعلومات الإضافية الخاصة بالمستند مثل عنوان الصفحة والكلمات المفتاحية فيها وغيرها من الأمور الخاصة بالصفحة والتي لا تعتبر من ضمن المحتوى.

—الجسم Body : وهو يحتوي على المحتوى الذي يراه المستخدم.

<html>

<head>

<title> عنوان الصفحة </title>

</head>

<body>

جميع محتويات الصفحة من صور ونصوص وغيرها

</body>

</html>