الدروس

‏Home ‏تصميم وتطوير الويب
  • تصميم وتطوير الويب تغذية RSS

    بواسطة FloatBird نشر في 22-08-2010 07:22  عدد المشاهدات: 1592 
    1. التصانيف:
    2. الأساسيات

    أسماء الألوان المدعومة في جميع المتصفحات ...
    بواسطة FloatBird نشر في 20-08-2010 04:57  عدد المشاهدات: 4260 
    1. التصانيف:
    2. الأساسيات

    سوف نقوم بالتعرف على الإطارات Frames وطريقة عرض صفحات الويب باستخدامها …

    فهل تعرف ما هي الإطارات؟ حسناً، سأوضحها لك … هل سبق لك وأن زرت إحدى الصفحات لتشاهد أنها مقسّمة إلى عدة أقسام بحيث يظهر في كل منها صفحة مستقلة، وتبدو بصورة منفصلة عن الأقسام الأخرى. وربما تكون قد قمت بالنقر على إحدى الوصلات التشعبية الموجودة في أحد الأقسام لتظهر الصفحة المتعلقة بها في القسم الآخر.

    إذا كنت قد شاهدت مثل هذه الصفحات فهذا يعني أن الإطارات مألوفة لديك وإلا قم بالنقر هنا لتشاهد مثالاً على صفحة ذات إطارات (ولا تنسى العودة لكي تتابع الدرس معا).

    كما شاهدت، فإن الصفحة مكونة من ثلاثة أقسام … والحقيقة أن كل قسم منها هو عبارة عن ملف Html كامل ومستقل بحد ذاته. وهي مجرد صفحات عادية لا تختلف أبداً عن تلك التي تعلمت إنشاءها في الدروس السابقة، ولا علاقة لكل منها بالصفحات الأخرى من حيث التركيب والتعريف.

    أما كيف تم جمعها معا لتظهر بالشكل الذي شاهدته؟ فهنا بيت القصيد. فبالإضافة إلى الصفحات والملفات الإعتيادية يوجد دائماً ملف أساسي يتم إنشاؤه خصيصاً لتعريف صفحة الإطارات وتجميعها وتحديد خصائصها.

    مع الإطارات، يمكنك عرض عدة صفحات في نفس نافذة المتصفّح.


    أمثلة جربه بنفسك - أمثلة

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

    إطارات أفقية
    كيفية عمل إطارات أفقية مع ثلاثة مستندات مختلفة.

    (يمكنك الحصول على مزيد من الأمثلة في أسفل هذه الصفحة).


    إطارات الـ HTML

    مع الإطارات، يمكنك أن تقوم بعرض أكثر من مستند HTML في نفس نافذة المتصفح. كل مستند HTML يسمى إطار (frame) ، وكل إطار مستقل عن الآخر.

    سلبيات استخدام الإطارات:

    • مطور الويب يجب أن يتابع ملفات HTML أكثر
    • من الصعب طباعة الصفحة بأكملها

    عنصر الإطارات (frameset) في الـ HTML

    العنصر frameset يحمل اثنان أو أكثر من عناصر الإطار frame. كل عنصر إطار يحمل مستند منفصل.

    العنصر frameset يعيّن فقط كم عدد الأعمدة أو الصفوف التي ستكون فيه.


    عنصر الإطار frame في الـ HTML

    الوسم <frame> يعرف أحد النوافذ أو الإطارات (frame) المعينة في frameset.

    في المثال بالأسفل ...

    بواسطة FloatBird نشر في 19-08-2010 17:34  عدد المشاهدات: 4898 
    1. التصانيف:
    2. الأساسيات

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

    مع أن النماذج تعتبر من المواضيع المتقدمة (وغير السهلة) نوعاً ما في الـ HTML إلا أن معظم مواقع الويب تكاد لا تخلو من وجودها، وذلك لعدة أسباب لعل من أهمها إيجاد إمكانية للتفاعل بين الموقع وصاحبه من جهة والزوار من جهة أخرى ... أحيانا قد تحتاج كمصمم لموقع ويب أن تعرف آراء زوار موقعك في مسائل معينة وقد تكتفي برسائل البريد الإلكتروني التي يرسلوها لك، لكن عندما تريد معرفة أشياء محددة بذاتها فإن النماذج هي الخيار الأفضل لك. بالإضافة إلى إمكانية تنظيم البيانات المدخلة من خلالها وسهولة وسرعة استخدامها من قبل زوار الموقع. ومن أبرز الأمثلة على النماذج في مواقع الويب هي دفاتر الزوار وصفحات البحث عن الكلمات أو العبارات داخل المواقع وناهيك عن المنتديات والتسجيل والمشاركة ...
    بواسطة FloatBird نشر في 19-08-2010 05:07  عدد المشاهدات: 2068 
    1. التصانيف:
    2. الأساسيات

    تحتوي لغة HTML على مجموعة من الوسوم الخاصة بتنظيم البيانات في قوائم وباستخدام عدة خيارات. والقوائم الأكثر شيوعاً هي القوائم المتسلسلة/المرتّبة/المنظّمة (ordered) والغير متسلسلة (unordered) ...
    بواسطة FloatBird نشر في 18-08-2010 21:15  عدد المشاهدات: 2989 
    1. التصانيف:
    2. الأساسيات

    هذا الدرس سيكون حول الجداول. بما فيها من تعدد لخصائص الجداول واستخدام في صفحات الويب. فالجداول تعد من أقوى الأدوات التي تتضمنها الـ HTML وأكاد أجزم بأنه لا يوجد موقع في الإنترنت إلا ويستخدمها بصورة أو بأخرى. حيث أن وضع الجداول في صفحات الويب لا يقتصر على تلك القوائم من البيانات التي نحتاج لترتيبها في صفوف وأعمدة، بل يتعدى ذلك إلى استخدامها في تصميم الصفحات نفسها وتنظيمها، والتحكم بمظهرها بصورة قوية وفعالة لا يمكن أداؤها مهما استخدمنا من وسوم خاصة بتنسيق الصفحات. والحقيقة أنه اليوم أصبحت قليلة الاستعمال بعد الانتقال إلى استخدام الـ div والـ css الجديد عوضاً عن الجداول، وأصبحت تقتصر أكثر على إفراز المعلومات وجدولتها، ولكني أعتبرها الأسهل في التصميم على أية حال حتى وإن كانت ستعتبر قديمة ...
    بواسطة FloatBird نشر في 18-08-2010 02:04  عدد المشاهدات: 1647 
    1. التصانيف:
    2. الأساسيات

    في هذا الدرس سوف يكون الحديث عن الصور والرسوميّات وكيف يمكن إضافتها في صفحة الويب، نعم من أجمل ما نزيّن به صفحاتنا هو وضع الصور الجميلة ولكن علينا أن نختارها بانتقاء وبالشكل الصحيح تعلّم معي الطريقة لوضع الصور في صفحات الـ HTML ومحاذاتها يميناً ويساراً، وأيضاً طريقة وضع الوصلات التشعبية عليها ...
    بواسطة FloatBird نشر في 17-08-2010 22:11  عدد المشاهدات: 1148 
    1. التصانيف:
    2. الأساسيات

    كيف وصلت إلى هذه الصفحة؟! لعلّك تجد هذا سؤالاً سخيفاً وأن الإجابة عليه بديهية، ... صحيح! فمن المؤكد أنك وصلت إلى هنا إما عن طريق إحدى صفحات أقسام هذا الموقع، أو من خلال أحد محركات البحث، أو أحد المواقع التي قمت بزيارتها مؤخراً ... وفي جميع الأحوال أنت قمت بالنقر على وصلة ما.

    الوصلات (Links) هي شبكة الوصل بين صفحات الإنترنت، فهي خيوط شبكة العنكبوت الكبيرة هذه وتصل حلقات صفحات الويب مع بعضها البعض. فتنقر على وصلة تذهب بك إلى صفحة أخرى، ووصلة أخرى تقوم بتحميل ملف ما، وأخرى تشغّل لك مقطعاً صوتياً وغيرها تعرض لك صورة ...
    بواسطة FloatBird نشر في 17-08-2010 21:31  عدد المشاهدات: 910 
    1. التصانيف:
    2. الأساسيات

    من أجمل ما يكون في صفحة الـ HTML هو بأن تقوم بتصميمها كما تريد وتحب، من ألوان وخطوط كبيرة كانت أو صغيرة وحواف وحدود وحاشية تريدها لعناصرك. في هذا الدرس سنتعلم كيف يمكننا تزيين صفحتنا بأجمل الألوان وباستخدام النظام المستجد نسبياً في عمل ذلك. وسنقوم بشرح دروس الـ CSS لتتكامل معرفتنا عنها في وقت لاحق إن شاء الله.

    الأنماط أو الستايل هي خاصية متوفرة في كل عنصر تقريباً، يمكنك استخدامها ووضع جميع الخواص الشكلية التي تريدها لظهور عنصرك. فهي تستخدم لتصميم شكل الصفحة وعناصرها في مستند الـ HTML ...
    بواسطة FloatBird نشر في 17-08-2010 00:42  عدد المشاهدات: 1685 
    1. التصانيف:
    2. الأساسيات

    سنتعرّف في هذا الدرس على كيفية تنسيق النصوص في صفحة الـ HTML، كتبويب الخطوط وعملها مائلة، بالإضافة إلى المزيد من الأكواد التي تستخدم في إظهار النصوص في صفحة الـ HTML ...
    بواسطة FloatBird نشر في 16-08-2010 22:51  عدد المشاهدات: 540 
    1. التصانيف:
    2. الأساسيات

    في هذا الدرس سوف نناقش الوسوم الخاصة بالفقرات في صفحات الويب وكيفية إضافتها وهي أيضاً من الأساسيات. فمحتوى صفحة الـ HTML هو عبارة عن فقرات.

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