الأربعاء, فبراير 08, 2012

كيف تنشىء صفحتك الأولى بإستخدام لغة HTML إتش تى إم إل

طبعا فيما سبق عرفنا أن لغة HTML تستعمل وسوم للتعريف بعنصر ( أمر ) أو خاصيه معينه حتى يظهر لنا المحتوى الذى هو بين وسم البدايه ووسم النهايه بالشكل الذى نريده.

والآن سنتعرف على أول أمر تبدأ به صفحة HTML :
<HTML>
.....................
</HTML>
ووظيفة هذا الأمر أنه يخبر المتصفح أننا سنتكلم معه بلغة HTML كى يبدأ هو فى التعامل معها.

ولاحظ معى أننا فى كتابة الأمر إستعملنا وسما للبدايه ووسما للنهايه, وهذا يعنى أن بقية أكواد HTML التى سنستخدمها لاحقا ستكون بين وسم البدايه ووسم النهايه الذى ذكرناهم.
وبقى لنا الآن أن نعرف ماذا سنضع بين هذين الوسمين, ولكن قبل ذلك أود أن أوضح أن

صفحة HTML تكون مكونه من جزئين

  1. الرأس ( HEAD ) وهو بمثابة تعريف للصفحه
  2. الجسم ( BODY ) أى محتوى الصفحه
وهكذا فإن شكل الكود لصفحة HTML يكون كالتالى
<HTML>
   <HEAD>
      <TITLE>
عنوان الصفحه
      </TITLE>
   </HEAD>

   <BODY>
المحتوى الذى تريد وضعه فى الصفحه
   </BODY>
</HTML>
وهذه الصيغه لابد لك أن تحفظها عن ظهر قلب, وهى ليست بالشىء الصعب ومع تكرار التعامل بها ستحفظها أعلم ذلك.

والآن دعونا نطبق هذه الأكواد عمليا

  1. إفتح Notepad جديده كى تقم بتحرير الأكواد فيها, وإنتبه أنه لابد لك من أن تكتب الأكواد بيدك ولا تقم بنسخها ولصقها فى النوت باد, وذلك حتى تحفظها بسهوله, لأنى أضع هذه الدروس لكى تتعلمها لا لكى تنسخها.
  2. قم بكتابة أكواد الصفحه التى اتفقنا عليها سابقا, وقم بكتابة عنوان الصفحه اذى تريده والمحتوى النصى الذى تريد وضعه فى جسم الصفحه
  3. قم بحفظ الملف ونسميه بالإسم الذى نريده, ولكن علينا أن نختار الإمتداد كالتالى ( yaso.html ) وذلك الإمتداد هو الإمتداد الخاص بلغة إتش تى إم إل.
بعد الحفظ ستجد الملف موجود على شكل المتصفح الذى تستخدمه على حاسبك, كأن يكون على شكل الفايرفوكس أو جوجل كروم أو إنترنت إكسبلورر, قم بفتحه وسترى أن عنوان الصفحه الذى وضعته موجود بالأعلى والنص الذى كتبته فى جسم الكود موجود فى الصفحه نفسها.
وهكذا أصبح لديك صفحة إنترنت قمت أنت بتكويدها بنفسك.

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

14 تَعْلِيق:

  1. اعادة سؤال لانك لم تجب :)
    السلام عليكم يا ياسر -- شكرا على تدوينات الرائعة

    بص أنا ليا سؤالين :-

    أول سؤال : ازاي أحط اعلانين أدسنس جنب بعض بالتوازي

    ثاني سؤال : أنا عندي مدونة حطيت فيها 3 وحدات اعلانات

    حسوب من الحجم 250*300 بس بتظهر في الصفحة الرئيسية فقط .

    طيب دلوقت هل أنا ليا الحرية في وضع أي نوع من اعلانات

    أدسنس و بأي حجم في صفحات التدوين "الصفحات الداخلية يعني"

    و لا لازم اعلانات معينة (نصية بس مثلا) -.

    ردحذف
  2. انا اسف ممكن اكون مش اخدت بالى من التعليق
    بالنسبه للسؤال الأول إقرا التدوينه دى
    http://www.abu-iyad.com/2011/11/double-adsense-in-index-page.html
    أما السؤال التانى فالاجابه أه ممكن ومفيش اى مشكله ولا مانع
    باتأسف مره تانيه عن عدم الرد المره الأولى وأرجو انك متكونش متدايق

    ردحذف
  3. درس جميل اخي ياسر مشكور
    وحتى نجعل التفاعل اكثر افادة في هذا الموضع ساحاول الاجابة على سؤال الاخ أحمد زعيتر بشكل اوضح واكثر تفصيل :
    فقط ضع سكريبت الاعلان الاول وبجانبه نص الاعلان الثاني وسيظهران مباشرة بالتوازي ولا تضع بينهما اي محدد او وسم احر كيفما كان... يعني ضع ما تريد وضعه قبل سكريبت الاعلان الاول وضع بعد ذلك سكريبتات الاعلانات بالتتابع بدون فواصل.. بشرط ان يكون عرض المكان كافيا طبعا :) ..
    مثلا لنقل ان الاعلانين اللذان ستضع بالتوازي هما اعلانين عرضهما 200 px ... اذن العرش المطلوب للصفحة او المكان في الموقع الذي ستضع فيه الاعلانين يجب ان يكون على الاقل 500
    لنحسبها : 200+200 = 400
    + 10 = 500
    ستسالني لماذا +10 ؟؟ ببساطة هذا لان هناك مميزات اخرى في الكود الذي ستضعه قبل السكريبتات الحاصة بالاعلانات ... مثلا
    < align=center color="#000000" ...etc" ...>
    ورغم انها لا تظهر في الصفحة فهي بالتاكيد يتم حميلها على الصفحة كباقي المكونات الحقيقية وبالتالي تاخذ مساحة ^^! وفي الغالب 10 px تكفي لكل المكونات الاخرى على الصفحة :)

    لكي ترى مثالا على ذلك هذه مدونة تخصني اضع فيها الاعلانات بهذا الشكل .. :
    http://ma-bodybuilding.blogspot.com/

    ردحذف
  4. شكراً لك اخى الكريم
    وإن شاء الله من المتابعين لمدونتك القيمة
    تقبل أخى خالص تقديرى واحترامى
    وبارك الله فيك وأعزك

    ردحذف
  5. Dev Nasser : شكرا جزيلا وهذا هو المثال الفعال للتعليقات .. ويشرفنا تكرار هذه المبادره فى كافة التدوينات

    محمد الجرايحى : شكرا على كلامك الجميل وأتمنى أن أقدم الإفاده لك دائما

    ردحذف
  6. اخي ياسر ... هذا شيء عادي جدا ان نتفاعل في مواضيع بناءة بطريقة جيدة
    هناك سؤال بعيد قليلا عن محتوى الموضوع ولكنه قريب جدا من مسار المدونة :
    مممم انت بالتاكيد زرت GoLD BLoG المدونة الذهبية
    كما ترى عدد التدوينات كبير جدا (هي الاكبر من ناحية عدد المواضيع في بلوجر)

    لكن هناك مواضيع لا احبها واحب ازالتها .. واجد مشكلة في ضلك لانه من شبه المستحيل الانتقال عبر المواضيع كلها واحدا تلو الاخر ... ممم فخطرت ببالي فكرة .. وهي ان ازيل التصنيف الضي يحتوي على تلك المواضيع كلها ... فهل هناك طريق لحذف التصنيف وحذف المواضيع التي تندرج تحته بسهولة ؟؟
    ثم انني لم اجد طريقة لحذف التصنيفات نهائيا من بلوجر ما عدا امكانية عرض بعضها دون الاخر (وهذا ما استعمله حاليا !)

    احتاج للرد السريع اخي ياسر ربنا يكرمك لانني منذ ساعتين تقريبا وانا اقلب في المواضيع واحذف واحد واحد وبمجموعة مجموعة ... ولقد مللت من ذلك حقا فهناك مواضيع في العام الماضي واخرى في العام الضي قبله ومتفرقة على حسب الشهور وبينها مواضيع جيدة وبالتالي لايمكن تعليمها وحذفها كلها !

    اعتذر عن الاطالة لكنني احببت ان اوضح الامر اكثر
    شكرا مسبقا :)
    وددي واحترامي

    ردحذف
  7. معذرة على الاخطاء الاملائية فوق : الضي == الذي ^^!
    على فكرة .. انت لساتك متسجلتش في مدونتي هاته !! :) ادعوك لتسجيل فيها ففيها دائما الجديد والمفيد ;)

    ردحذف
  8. اخى اذا كنت تود مسح تصنيف كامل فهذا امر سهل وهو أن تختار التصنيف الذى تريد مسحه ثم تختار عرض الموضوعات كلها فى صفحه واحده من الجانب الآخر من المنظقه التى تحجدد فيها عدد التدوينات التى تعرض فى الصفحه الواحده ,, ثم قم بتحديد المربع الصغير الذى فى الأعلى وسيقوم هو بتحديد كل التدوينات ثم قم بالضغط على زر الحذف ,, أعتقد أنه أمر سهل ,, كما يمكنك الوضول للموضوعات التى تريدها عن طريق البحث عن عنوان التدوينه بالضغط على clr+f وذلك طبعا وانت تعرض كل تدويناتك فى صفحه واحده ... هههههههههه فهمت حاجه ؟؟!!

    ردحذف
  9. نعم كلام مفهوم ... لكنني اعرف ذلك .. فالمشكل هو انني كما قلت لك هناك تصنيفات فيها مئات المواضيع (تقريبا اكبر تصنيف اريد مسحه يحتوي على اكثر من 200 موضوع) ولا يمكن عرضه في المتصفح .. وحتى لو تم عرضها فليس هنالك خيار مسح جميع المواضيع في حالة كنت تتحدث عن فتحها وكانك زائر ..
    اما في لوحة التحكم فهناك خيار تحديد المواضيع وبعد ذلك مسح التصنيفات التي تحتوي عليها .. ولك هناك بعض التصنيفات تحتوي على مواضيع في 2010 واخرى في شهر 6 في 2011 مثلا وهكذا .. اي انني حتى لو قمت بتعليم ومسح بعض التصنيفات فلن تسمح لانه ستكون هناك مواضيع لم يتم تعليمها وبالتالي لم يتم مسح التصنيف منها ولا مسحها هي نفسها
    اظن ان المشكلة واضحة ^^!
    وشكرا على ردك السريع :)

    ردحذف
  10. السلام عليكم يا ياسر ...
    تمام كده يا باشا متابعك ان شاء الله
    لكن استفساري بخصوص قالب المدونة نفسه المصنع "
    انا لما بستخدمه و بضع فيه اعلانات جوجل لا تظهر في جسم التدوينة هل انت عاملها يدوينااااً ؟؟
    ولا اية

    ردحذف
  11. السلام عليكم ورحمة الله
    جزاك الله خيرا
    جاري التجربه
    وعندي سؤال
    هل يمكن اضافة هيدر للمدونه
    واشكرك كل الشكر

    ردحذف
  12. Dev Nasser : للأسف مشكله ليس لها حل فى الوقت الحالى .. حاول تمشى امورك بالمتاح حاليا

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

    loveriver : طبعا يمكن اضافة هيدر للمدونه ولكن دا موضوع طويل ويحتاج تدوينات مش تدوينه واحده

    ردحذف
  13. طب يعني واحد عايز ينشر أفكاره ويطور أداءه بيحذف ردود الناس ليه؟ شيء غريب!

    ردحذف
  14. faissl : مش فاهم انت بتتكلم عن ايه

    ردحذف