السلام عليكم
أظن انه الموضوع الأخير لي في هذا الجانب الخاص بالمعايير القياسية، قد وصلنا الى مرحلة الإقتناع بهذه المنظمة بعدما كنا في مرحلة محاولة الإقناع
تمهيد
كلنا يتذكر عندما بدأ محرر الثعلب في الظهور، كيف بدأت مواقعنا العربية تتكسر واجهاتها إمام هذا المتصفح
مما كون فكرة لذى العديد، أن الثعلب فاشل ولا يراعي مشاعرهم، فعادوا وتواصوا فيما بينهم أن متصفح مايكروسوفت سياسته الدبلوماسية مع المواقع العربية راقية لأنه يقدم لهم واجهة الموقع كما يشتهون
و هناك من اتهم الثعلب المسكين انه عميل ما جاء الا ليفضح المواقع العربية
فجأتهم إنباء إن صفحاتهم لا تخضع للمعايير القياسية، فقالو ومن تكون هذه المعايير؟
منظمة عالمية اتفقت معها شركات عالمية بما فيهم مايكروسوفت ان تكون الصفحات وفق قياس واحد
فقالو فاشلون كان عليهم ان يضعو تلك القياسات وفق فرونت بيج
إن عاتبنا هنا فرونت بيج فلأنه كان من بين الأسباب التي جعلت اغلب المواقع المنجز بهذا المحرر غير قياسية، وكان المتصفح انترنت اكسبلورر يزين هذه الصفحات، لكن في الحقيقة كان يخدعهم
الفرونت بيج طوال اصداراته لم يراعي المعايير، كانت دائما أصوات تنادي بان يحترم هذا المحرر تلك المعايير نظرا لشعبيته، والتي تؤهله بأن يكون رائد المحررات القياسية، لكن لا جواب على من تنادي، لذالك كان على المصمم ان يغرق مع الشفرة المصدرية ويتعامل مع الوسوم ليكون الناتج قياسي، مما جعل مؤشر محرر عملاق آخر يصعد ليصبح الرائد في المتصفحات القياسية dreamweaver
غير ان مايكروسوفت تلعب على الأعصاب ومرت مدة طويلة لتخرج لنا بمحررين قياسيين SharePoint Designer و Expression Web
انذاك بدأ المصممين المعتمدين على الفرونت بيج بالاقتلاع من هذا الأخير واستعمال المحرر الجديد مما أهل بعض المواقع العربية بأن تصمد واجهاتها بباقي المتصفحات غير المتصفح التجميلي انترنت اكسبلورر
ان التحول من التصميم التلقائي الى التصميم القياسي ليس فقط بتغيير المحررات، بل يجب كذالك ان يوازيه، تغييرات في معارفنا التقليدية بالوسوم، الان ليس كما السابق، حينما كنا نضع المحتوى و التصميم في قفة واحدة عن طريق html بل اصبح الان الفرز بين المحتوى و التصميم، المحتوى بالوسوم المقيدة xhtml والتصميم يكون بالإبحار في التوصيف بال css اما المستندات الخارجية كقواعد بيانات صغير فتكون بال xml وقاعدة هذه الأخيرة هي نفس قواعد xhtml غير ان xml نحن من يحدد الوسوم والتسميات.
الوسوم القياسية
ستجد ان هناك فرق كبير بين الوسوم القياسية و الوسوم التقليدية، على سبيل المثال
كود HTML:
<FONT SIZE="4" COLOR="#FF3300" FACE="VERDANA" " >السلام عليكم</FONT>
و
كود HTML:
<span style="font-size:14; color:#f30; font-family:verdana">السلام عليكم</span>
وهنا الامتياز سيكون من نصيب css خصوصا اذا كثر المحتوى، وكانت هناك بعض التصميمات متشابهة في وصفها وسترون الفرق شاسعا خصوصا اذا استعملنا class عوض style
HTML
html هناك كثرة الوسوم لكن متقيد في الوصف لايمكن ان يتعدى حجم الخط 7 لايمكن ان تع عنصرا في تموضع ما على الصفحة اي ان تحدد انت نقطة معينة في الصفحة حسب الإحداثيات، لايمكن ان تستورد تصميم خارجي لتطبقه في الصفحة
XML
xml هي التي دفعت html الى xhtml
في ال xml نحن من يحدد الوسوم
كود:
<هي>
</انا تسمية="أعود بالله من قولة أنا" >
</هو>
</هي>
والتعامل مع ملفات xml يتم عن طريق اللغات البرمجية، فلغات البرمجة النصية التي تتعامل مع المتصفح ك javascript و jscript و vbscript تنصحهم المنظمة بأن يتعاملوا مع هذه الملفات بالتقنية القياسية DOM وهذه التقنية مدعومة في اغلب لغات البرمجة سواء النصية (سكريبت جافا و سكر يبت اكشن وغيرها ) اولغات البرمجة التطبيقية c++ جافا، سي شارب وغيرها واباقي اللغات php asp jsp cfm الخ
XHTML
xhtml متقيدة مثل xml ولا مجال للخطأ فيها، وعندما نسمع كلمة متقيدة فلا يجب ان يكون تفكيرنا جانبي ونتخيلها انها تضييق، بل يجب ان نفكر فيها انها عكس تشتيت، فالمسائل المقيدة، سهل ان نعرف حدودها، عكس الأشياء الحرة التي كل واحد منا يرسم لها حدود خاصة به.
في html يكون وسم الصورة هذا صحيح
كود HTML:
<img src="test.png" alt="test image">
وفي xhtml يعتبر خاطئ، لانه وسم مستقل ولايحتوي على اي شيء بداخل، اي لايحمل وسوم اخرى. اذا يجب ان يغلق الوسم على نفسه ويصبح
كود HTML:
<img src="test.png" alt="test image" />
لماذا هو صحيح في الاول؟
لانها ان كانت html فالمتصفح وحده من سيقرأها وبعرف انها صورة لأنه يتجاوزها ويعتبرها html، اذا في الممتصفح لاتشمل خطأ اما ان قرأنها عن طريق برنامج اخر او لغة اخرى دون استعراض الصفحة سيعتبر الوسم مازال مفتوح وانه يحتوي كل الوسوم التي تأتي بعده مالم يغلق الوسم على نفسه
لنفهم الامر جيدا مع هذا المثال البسيط
<أ> الوسم الف مفتوح ربما به شيء او اشياء
<ب/> نعم به الوسم باء وهذا الاخير مقفل على نفسه
<أ/> تم اغلاق الوسم المفتوح ألف
هنا سنفهم ان الف يحتوي على العنصر باء
وهنا مثال قد يعتبر صحيح في html لكن خطأ فادح في xhtml
كود HTML:
<b><a href="test.html">salam</b></a>
هذه الاسطر ستفهم هكذا الوسم a يحصر الوسم b والوسم b غير مقفل و يحصر كلمة سلام بعدها يأتي الوسم a مغلق يعني يحصره بدوره بعدها سيغلق الوسم b فهذه الاسطر غير منطقية، فكيف للوسم b ان يحصر الوسم a الذي هو اصلا يحصره!! هذه الطريقة غير مقبولة الا من باب ستره !
حينما تضع صفحتك على وزن xhtml فإنك تصنفها ضمن ملفات xml اي انك تجعل الصفحة وثيقة يمكن الوصل الى مستنداته دون استعراضه وهذا سيجعل صفحتنا ممكنة القرائة بأي برنامج وأية برمجة تدعم xml وأغلب لغات البرمجة الان الحية تتعامل مع هذه المستندات
فلهذا يجب ان نفهم ان xhtml ليست بكائن غريب عنا بل أوجبته الضروف ليضبط لنا قواعد الوسوم القياسية،
فالتقييد هنا لتسهيل قراءة محتوى صفحتك، سواء للمتصفح او غيره، كالجوال او POCKETPC او أي جهاز كفي آخر.
حقيقة ان اغلب المتصفحات تتجاهل بعض الأخطاء أومخلفات ال WYSIWYG الغير القياسية (فمثلا في الفرونت بيج اذا كتبت نصا وأعطيته نمط معين، وبعدها مسحت النص، فإن مايمسح هو النص الذي بين الوسوم المستخرجة على حسب النمط الذي اعطيته له، هذا ذكاء اصطناعي حتى اذا كتبت نص اخر يبقى بنفس النمط، لكنه ذكاء غير مكتمل لأنك ان مسحت النص ولاتريد ان تضع مكانه شيء اخر فإن تلك الوسوم تبقى في الصفحة دون محتوى، لذالك لا تستغرب اذا وجدت العديد من الصفحات بها وسوم بدون محتوى، فإنه هو سببها)، لكن ليكن في العلم ايضا انه حتى يتجاهل المتصفح تلك الوسوم فإنه يستهلك موردا، وببداهة حتى تتجاهل شيئا فيجب ان تعرفه مسبقا)
الروابط القياسية
من بين الأشياء التي تنادي بها المنظمة هي الروابط القياسية
رابط عادي
كود:
http://sudoku.ma/sudoku?save=salam
رابط غير قياسي
كود:
http://sudoku.ma/sudoku?save=<"swalif&soft">
الرابط الصحيح
كود:
http://sudoku.ma/sudoku?save=<"swalif&soft">
يجب علينا هنا تعويض هذه العلامات بمقابل لها في اسكي، وذالك لمصلحة صفحتنا حتى لا يتعارض النص والكود، لان ذالك سيشكل خلل بين القيمة و المتغير
مثلا نريد المتغير save ان يرسل القيمة التالية
الاسم=ابراهيم&الكنية=بيدي
اذا وضعنا رابط كالتالي
فهذا خطأ لأنه ستعتبر كلمة الاسم واللقب كمتغيرين وهما ليسا كذالك بل هما قيمة
الرابط الصحيح
وهذه الاشكالية تقع خصوصا مع تقنية اجاكس
CSS
في ال css يكون style و class وجهان لعملة واحدة
style نمط نضعه في الوسم ونصف فيه التصميم، وهذا التوصيف يطبق فقط على ذاك الوسم وما يحتويه
class لكي يفهم جيدا وببساطة فيمكن ان لم يكن تشبيهه بمتغير يحمل قيمة التصميم يطبق ذاك التصميم على اي وسم تم ذكره فيها
شبيه جدا بدالة تقوم بتطبيق الدوال التي بها اينما استدعيت
المنظمة لاتناديك وحدك
عندما تنادي المنظمة بإتباع المعايير القياسية فإنها لاتعنيك انت وحدك(مصمم او مبرمج) إنما يتوجهون بكلامهم أيضا وبالدرجة الأولى الى شركات برامج التصميم ليكون ناتج برامجهم متوافق مع العايير العالمية، فهم يقولون ل adobe يجب ان يكون ناتج يرنامج ullistrator الذي يكون على هيئة svg قياسيا مع انه كذالك، ونفس الكلام مع office word حينما تحفظ الصفحة على هيئة html وتكون لغة التصميم بها vml ونفس الأمر لباقي المحررات سواء الصغيرة و الكبيرة، وكذالك مع لغات البرمجة فهي تنادي بالإعتماد وإتباع تقنية دوم في التعامل مع مستندات xml
حتى ان العملية تسهل على مبرمج احدى لغات البرمجة التطبيقية، ويريد برمجة متصفح خاص به، فإن هو اعتمد على البدأ من الصفر وبطلايقته الخاصة دون مسايرة التجديدات الحاصلة ومعرفة اخر ما وصل اليه ترمومتر الشبكة العنكبوتية، فكأنه يحاول اعادة اكتشاف معادلة قطر الدائرة، التي اكتشفت هذه قرون، لكن ان توجه الى المنظمة العالمية، فسيجد قاعدة واسعة ومعلومات شاملة عن تطور المتصفحات، وعن القواعد والبنية التحتية للمتصفح القياسي، وجميع المراجع المتفق عليها، وبإمكانه الإنظمام الى المجموعة، واذا كان دوبال قد يصبح بدوره مرجعا.
موقع validator
ليس ان يقول لنا موقع validator ان الموقع الفلان الفلاني لا يتوافق مع المعايير القياسية فهو كذالك، والعكس صحيح
فيجب ان نعرف اولا ما نوع الخطأ هل هو خطأ قصده المبرمج او المصمم كأن يقحم تعريفات ووسوم لا علاقة لها بالتصميم، فمبرمجي سكريبت جافا تحلو لهم لعبة اقحام وسوم او تعريفات خاصة بهم يستجلبونها ويتعاملون معها من خلال سكريبت جافا، لأنهم يعتبرونها كقاعدة بيانات صغيرة خارجية، لكنها لاتشكل اي مشكلة مع المتصفح او اي قارئ لمستندات xml
تذكير
تيم بريزلي هو صاحب html وهو نفسه صاحب هذه المنظمة ففيما العيب لو اتى عندك استاذك وقال لك امس تعلمت الحروف الأبجدية كلها، اليوم سنتعلم قواعد ضبط الحروف
ابتسامة اخيرة
لمن يعارض المعايير القياسية فأقول له لأنظم الى حزبك فأنت تلزم علي ان اجر صفحتي واصممها بالفرونت بيج اذا انا اعارضك واريد ان احرر صفحتي ببرنامج الوورد واحفظها بصيغة html فالتصميم بالword اسهل واجمل مايكون حيث انك حينما تحفظ الصفحة يكون الناتج خليط رائع من الوسوم افضل من ال html التقليدية، انها تحفة محررات ال wysiwyg في السورس-الشفرة المصدرية-
ستجد راس الصفحة يبدا بدوكيتيب وان بها وسوم vml القياسية يليها وسم css وبعض وسوم اكواد jscript وهي بدورها قياسية وفق المنظمة الاوروبية ecma ويتجد كذالك بعض الوسوم المايكروسوفتية الناذرة التي لن يفهمها سوى المحرر الورد وربما يفقه فيها شيء اخوه القارئ انترنت اسبلورر
وبما ان الامر كذالك، فإننا ننصح جميع السيكريتيرات اللواتي لايعرفن شيء في سطح المكتب سوى ايقونتي الوورد والاكسل، ليلتحقو بنا ويلجو عالم التصميم من بابه الوسع ولما لا منافستهم ايضا، حتى ان لهم خيال واسع في عالم التصميم واختيار الالوان، فبإطلالة صغيرة في ادوات الفوتوشوب النسائية الخاصة بهم)المساحيق( تغنينا عن اي استطلاع رأي اخر
سنجد حينها ان اكثر من نصف المواقع لون خلفيتها بلون وردي، ويؤسسو منظمة على غرار w3c بإسم w3r و r هنا تعني rose لان النساء سهل ان يتفقو على شيء عكس الرجال الذين مازالو مختلفين حول اضافة x او ازالته من html لتصبح xhtml
_________________________________
تبادل الخبرات[6]ملحق Greasemonkey في Firefox
تبادل الخبرات[5]الكوكيز وثغرة الـ MSN
تبادل الخبرات[4]إيجابيات وسلبيات أجاكس
تبادل الخبرات[3]تقنية أجاكس
تبادل الخبرات[2]البكسل و النسبة المؤية
تبادل الخبرات[1] مالبديل للدالة for