دروس لتعلم لغة HTML الشهيرة

الدرس الاول :

ان شاء الله سوف اضع دروس لتعلم الHTML من الصفر الى الاحتراف الكافيه لانشاء موقع متميز ولكن طبعا بدون تفاعل مع الزائر يعنى مش هايكون فيه داتا زى البى اتش بى

قبل ما ندخل فى الHTML افتح نفسكم بكلام عام لازم تبقى عارفه علشان موقعك يبقى متميز و يدخله عدد كبير من الزوار .... فمعظم المواقع العربيه تقع بعد خمس سنين من انشائها نتيجه لانشغال اصحابها عنها ... علشان كده هاقولكم نصائح ذهبيه لتجعل موقعك متميز
1-ابتعد عن الجرافيك و الفلاش

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

لذا ننصح بالإعتماد على الـ CSS و الـ HTML و الـ DHTML فقط في تصميم صفحات الويب مع إضافات بسيطة عند الحاجة فقط للجرافكس أو الفلاش .

2-الجافا سكربت .. الحذر كل الحذر

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

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

3- إحذر التقليد !
إذا أردت أن تحكم على موقعك بالفشل من بدايته ، فصمم موقعك على غرار أحد المواقع مع مراعاة تقليد بعض التفاصيل . نلاحظ مؤخرا بأن ظاهرة التقليد المطابق و الغير مطابق ظاهرة آخذة بالإزدياد بشكل تدريجي و أعتقد انها الأن قد وصلت أوجها ، إسمحوا لي أن أضرب بعض الأمثلة ، الكثير من المواقع الشخصية تبع نفس الأسلوب في التقسيم و تصميم الواجهات ، إنظر مثلا للمواقع التالية
http://www.al-wed.com/
http://www.al-zen.com/
http://www.qloob.com/
http://www.7laa.com/

أعتذر لأصحاب المواقع على وضع مواقعهم كأمثلة سيئة في التصميم ، ولكن الضرورة إقتضت التمثيل بمواقع مشهورة

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


4- البساطة .. ثم البساطة .. ثم البساطة

لن أتحدث كثيرا عن هذه النقطة ، يكفي فقط أن أذكر القارئ بأكبر المواقع العالمية مثل Google و Yahoo و BBC و MSN ، إنظر الى تصاميم هذه المواقع لترى أنها قمة في البساطة ، فموقع قووقل على سبيل المثال ما هو الا صفحة بيضاء مع شعار بسيط و نموذج بحث ، ولكن هذه الصفحة هي أكثر الصفحات زيارة في العالم !! مع أن قووقل لا يعيقها أبدا تصميم صفحة لم ترى أي عين بشرية مثل جمالها و إحترافية الجرافكس و تقنيات الرسوميات فيها ، ولكن السر الأول في نجاح هذه المواقع هو البساطة

5- لا ترمى بكل اوراقك دفعه واحده

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

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

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



6- إستشر زوارك

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

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


7- إرسم خطة واضحة للتطوير

للأسف نرى أن بعض سياسات إدارات المواقع العربية تتخبط بشكل كبير في توجه الموقع ، فلا تعرف هل الموقع ثقافي أم ترفيهي أم تعليمي أم ديني ، نرى أن البعض يريد أن يصبح كل شيء في نفس الوقت ، ويريد أن يضيف كل شيء في نفس الوقت ، و أذكر هنا على سبيل المثال بعض العملاء الذين يطلبون منا في المؤسسة تصميم مواقع لهم ، و بطبيعة الحال فإن أول سؤال نطرحه على أي عميل هو : ما هي فكرة و محتوى هذا الموقع ؟ ، تتفاوت الردود ، ولكن هناك فئة كبيرة تجيب بـ " نريد موقع به كل شيء " ، إن مفهوم كلمة كل شيء هنا مفهوم واسع ،و للأسف تنحصر نظرة هؤلا بكلمة كل شيء الى " منتدى + دردشة + مجلة + بطاقات ، هذا هو بنظرهم كل شيء يمكن أن يضاف للموقع و بهذه المعادلة يظنون أنهم إمتلكوا الموقع الكامل الذي يقدم خدمات لكل الفئات ، و هذه الإشكالية تنبع من إنعدام تام لوجود أي خطة واضحة لتطوير الموقع قبل إنشاءه ، عليك برسم خطة التطوير قبل الإنشاء ، حدد توجهك ، ثم حدد الفئة الرئيسية المستهدفة من الموقع و إياك أن تقول أن فئتك المستهدفة هم كل الفئات ، فهذه هي بداية الفشل ، بعد ذلك إبدأ بالتفاصيل الفنية لتصميم و إنشاء الموقع

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



8- تابع المستجدات التقنية

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

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

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

لذا قبل أن تفكر في أن تكون صاحب موقع و تحصل على لقب ويب ماستر Webmaster حاول أن تتعلم أساسيات التعامل مع هذه البرامج ، وليست مشكلة في أن تطلق موقعك و أنت غير ملم بهذه البرامج و التقنيات ، ولكن المشكلة أن ترمي مسؤولياتك على جهات أخرى غير مسؤولة عن موقعك للأبد ، بمجرد إنشاءك للموقع حاول منذ اليوم الأول أن تحل أي مشكلة بنفسك مع أخذ نسخة إحتياطية لكافة الملفات قبل البدء بأي تعديل ، إبحث في المنتديات المتخصصة ، في محركات البحث عن حل للمشكلة التي وقعت فيها ، بعدها بادر على الفور بتطبيق الحلول التي وجدتها خطوة بخطوة ، ستجد أن الأمور بدأت تسهل عليك شيئا فشيئا ، الى أن تستحق و بجادرة لقب ويب ماستر !

9- محركات البحث ، شلال من الزوار يصب في موقعك

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

هذه هي إعلانات المعلنين الذين إختاروا أن تظهر إعلاناتهم للباحثين الذين يبحثون بنفس العبارة التي بحثت بها أنت

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

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

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

خدمة Google AdWords تحتوي على العديد من الخصائص ، لمعرفة المزيد عن هذه الخدمة و الإشتراك بها راجع الرابط التالي :

https://adwords.google.com/select/Login?hl=ar


اذا كنت ترغب في البديل المجاني لتوصيل موقع للباحثين في محركات البحث فإليك النصائح السريعة التالية

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


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


- إهتم بوسوم الميتا في صفحتك META TAG ، اذا كنت لا تعرف ما ذا يعني هذا المصطلح فسأل أحد مطوري المواقع أو إبحث بنفسك عن كيفية تحسين الميتا تاق في صفحات موقعك ، لن يسعني هنا شرح تفاصيل الميتا تاق ، ولكن أريد الإشارة الى أهميتها في ترتيب المواقع و ظهورها في محركات البحث



10- إحذر من الإعلان بطريقة الإكراه

بإختصار ، تجنب إعلانات البريد الإلكتروني ، أو ما يعرف بالـ Spam Mail ، فلن تزيد هذه الطريقة موقعك الا سمعة سيئة و إحتمالية كبيرة في إغلاقة في حالة ورود شكوة جديه الى مستضيفي موقعك تشتكي من هذه النوعية من الرسائل

تجنب أيضا الإعلان بطريقة النوافذ المنبثقة ، وذلك لعدة أسباب أهمها أن هذه الطريقة طريقة إستفزازية في إجبار الزائر على دخول موقعك ، ثانيا أن النسخ الحديثة من ويندوز إكس بي ( المزودة بـ SP2) و نسخ ويندوز لونقهورن القادمة مزودة بنظام يعمل إفتراضيا لإغلاق أي نافذة منبثقة في أي موقع ، هذا يعني ان مالك سيذهب بدون فائدة في إعلان لن يطلع عليه الكثير و إن إطلعوا فسيأخذون فكرة سيئة عن موقع الذي أجبرتهم على الدخول فيه
11- جمهورك
: ما هو نوع هذا الجمهور و أي متصفح يستخدم و طبيعة الجمهور , ثقافته , و حتى عاداته و ديانة جمهور الذي سيقوم بزيارة صفحتك .
12-- غايتك إن بناء صفحة ويب للتسلية يختلف تماماً عن بناء موقع لبيع المنتجات التجارية .
13-لا تحاول جعل صفحتك بطيئة
فالمستخدم لن ينتظر كثيراً حتى تفتح جميع الصور أو الأصوات
في صفحتك .
14 أبقه منظماً دائماً
15 إجعله ممتعاً للمشاهدة
16 اعط المستخدمين عناصر تنقل كافية تاكد دائماً من إن بإمكان المستخدم العوده إلى القائمة الرئيسية .
17 إختبار الموقع
إختبر موقعك دائماً

ان شاء الله الدرس الثانى هايكون فى عالم الhtml