معاً نحو مستقبل افضل: الأساسيات

بسم الله الرحمن الرحيم

أقدم هذه الدورة لأخوانى واخواتى فى (منتدى نجع الكلامنجية) وكمان فى( منتدى قهوة كتكوت) و(مدونتى)

فأرجوا من الله أن تستفيدو.

على فكرة فى أسئلة فى أخر الموضوع للى عايزا يجاوب عليها.

دورة تصميم المواقع بلغة Html

بعد انتهاء الدورة سوف نكون:-

1- قادرين على أن نصمم موقع بأنفسنا.

2- قادرين على تحليل أى موقع ومعرفة تكوينه ؟

سوف تكون دورتنا عبارة عن 11 درس, كل يوم درس فأرجوا المتابعة.

مقدمة

انها اللغة المستخدمة لانشاء صفحات الانترنت. (وأختصارتها Hyper Text Markup Language) وهى ليست لغة برمجة بالمعنى المتعارف عليه للغات البرمجة الأخرى كلغة . فهى مثلاً لا تحتوى على جمل التحكم والدوران , وعند الحاجة لأستخدام هذه الجمل يجب تضمين شيفرات من لغات أخرى مثل ,الجافا سكريبت, وكذلك لا تحتاج الى مترجم خاص به. وهى غير مرتبطه بنظام تشغيل معين, لأنه يتم تفسيرها وتنفيذ تعليماتها مباشرة من قبل متصفح الأنترنت وبغض النظر عن النظام المستخدم . لذلك فهى لغة بسيطة جداً, وسهلة الفهم والتعلم ولا تحتاج لمعرفة مسبقة بلغات البرمجة والهيكلية المستخدمة فيها. بل ربما كل ما تحتاجة هو القليل من التفكير المنطقى وترتيب الأفكار.

تتكون مفردات لغة(html) من شيفرات تسمى(Tags)أى الوسوم . (وتكتب من اليسار الى اليمين).

أنواع الوسوم:-

للوسوم ثلاثة أنواع , الأول يتكون من زوج من الوسوم مثلالوسم وهذا لجعل الكتابة بخط أسود عريض,وتكتب بهذا الشكل.

....text....

النوع الثانى

وهو وسم مفرد مثل الوسم لأنهاء السطر وهو ليس له وسم نهاية.

النوع الثالث

وسم يمكن أن يكون مفرد ويمكن أن يكون مزدوج مثل وسم الفقرات.

وسوف نتطرق الى هذه الوسوم فى حينه ان شاء الله.

ما نحتاجه؟

تصور أنت ما نحتاجه, بالطبع نحن نحناج الى برنامج لكتابة الشفرة فيه,ليس هذا بالأمر

الصعب فنحن نمتلك برنامج قوى لكتابة الشفرة ومعالجتها من خلاله , هو برنامج

(Note pad) الذى يأتى مع (windows).

وكيفية فتحة نذهب الى قائمة. start>>all programs>>accessories>>Note pad.

قبل أن نبدأ

أريد أن ألفت النظر الى أن أذا أردت أن تتعلم أى لغة برمجة فعليك بتطبيق كل ما تتعلمه.

من الأفضل أن تنشىء مجلد خاص لأعمالك , ليسهل عليك بعد ذلك أسترجاعهم.

والأن نبدأ

الدرس الأول

الأساسيات

سوف نتعلم فى هذا الدرس وسوم أساسية فى اللغة تذكرها جيداً.

<Html>

<body>

.........

</body>

</html>

هذا هو تكوين الصفحة, كما تلاحظ فوسم لغة html يحتوى على زوج من الوسوم أحدهم وسم البداية والأخر وسم النهاية.

وملف html يبدأ دائماً بالوسم <html> وينتهى بالوسم </html> لا تنسى ذلك.

أما الوسم <head> فيحتوى على معلومات تخص الصفحة ككل مثل عنوان الصفحة الذى يظهر فى شريط المتصفح, وهذا العنوان يحتاج لأن يوضع بين وسمى <title> عنوان الصفحة </title>.

أما الوسم <body> فيتضمن بداخله نصوص الصفحة , وجداول, وأدراج الصور,وباقى محتويات الصفحة.

ما رأيك لو لكتبنا أول صفحة ويب لنا,

قم بفتح برنامج Note pad واكتب بداخله ما يلى.