السلام عليكم ورحمة الله وبركاته
اعلم ان هناك الكثير سبقنى لموضوع ال xhtml لاكن اردت التكرار لربما تفيد ما لم يطلع على المواضيع السابقة
اليكم بعض خصائص ال xhtml
والفروق ما بين ال html وال xhtml
فالنبدأ باسم الله
فى صفحات ال xhtml
تكون بنفس الفكرة التى يتبعها معظم المبرمجين والمصميم سواء فى الاخراج من صفحات php او حتى html
لاكن تكون الاضافة الوحيدة اضافة
كود:
<?xml version="1.0" encoding="UTF-8"?>
تكون اعلى كل صفحة قبل بداية الاخراج ويجب الا يكون قبلها Whitespaces
اى المسافات التى قد تصدر عن بعض المحررات او برامج الاف تى بى
ثانيا تحديد نوع الصفحة والمصحح لها
من خلال ال
الذى يعمل على اخبار المتصفح ان نوع هذه الصفحة xhtml
والذى يساعده على محاولة تصحيح بعض الاخطاء اثناء العرض
ويوضح لمواقع التحقق من كود html
انه كود xhml اذا لم تأخذه اتواماتيكيا من الصفحة
لذا يجب الا تخلو اى صفحة منها وحتى ان اضفتها وقد تغيير بعض من خصائص الجداول او شكل الموقع اعمل على تصحيح اخطائك فى كود ال html لموقع اكثر احترافية
هناك 3 انواع للدوكتيب DOCTYPE
الاولى للصفحات الصحيحة الخالية تماما من الاخطاء والتى تعتمد كليا على ال CSS
ولا نستخدم فيها اى كود مثل STYLE الذى قد تضيفه لتغيير خواص معينة على كائن معين
والتى تعتمد على المتصفحات الجديدة فقط بدا من IE5 مثلا
كود:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
الثانية وهى الاكثر شيوعا فى الاستخدام وذلك لدعهما للكثير من الخيارات والتى قد تسهل عليك قليلا مثل STYLE MOTHED والذى يساعدك على تحديد خصائص كائن معين فى وقت العرض
مثل
كود:
<div style="color:#ff9900"></div>
كود:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
النوع الثالث فهو مختص بالفرامز
الاطارات فهوا خارج موضوعنا الان
لاكن نضيفه حتى نلم بكافة ال doctype
كود:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
حتى الان يكون لدينا القالب التالى للصفحة
كود:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
او
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
موضوع الهيدر والفوتر يشبه تماما ال html القديم
وهو يتكون من
كود:
<html>
<head>
</head>
<body>
</body>
</html>
لاكن بتغيير طفيف
كود:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>
</body>
</html>
والان الى الكود
بأختصار عام كل ال الكائنات يجب غلقها كما نفعل مع ال xml
بمعنى
يجب ان يكون مثلا
<ahmed></ahmed>
مثل
ال
<p></p>
<b></b>
للكائنات التى تحتوى على نهايات
او
<ahmed />
للكائنات التى لا تحتوى على نهاية
مثل
<img>
<br>
<hr>
ليصبح
<img />
<br />
<hr />
وذلك على سبيل المثال
<link href="skin/style.css" type="text/css" rel="stylesheet" />
او حتى
<img id="myid" height="27" alt="NileSolutions" src="images/home.gif" width="100" border="100" />
لاحظ ووجود الاسلاش فى الاخر
لم تكن توضع فى ال html
يجب ان يكون ايضا كل كائن محفوظ له id خاص به غير مكرر فى حالة دعمه
ايضا يجب ان مساره صحيح مثل
كود:
<div id="ahmed">
<p>
</p>
</div>
وليس
كود:
<div id="ahmed">
<p>
</div>
</p>
بالنسبة للجافا اسكريبت وال css
يجب وضعهم ما بين
//<![CDATA[
//]]>
وذلك فى حالة ان الاسكريبت او الاستيل يحتوى علامات مميزة مثل > < ? الخ
ليصبح
كود:
<script type="text/javascript">
//<![CDATA[
<!--
var mybase = 'http://www.nilesolutions.biz/';
//-->
//]]>
</script>
يجب التقليل من استخدام ال
table الجداول
الانتقال الى div
وتحديد خصائصها من خلال ال css
القالب النهائى لصفحة صحيحة والخالية من الاخطاء ومدعومة من كل المتصفحات حتى القديم منها
كود:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> Nilesolutions XHTML Example </title>
</head>
<body bgcolor="#FFFFFF" link="#000000" text="red">
<p>your body is here</p>
</body>
</html>
تقريبا هذه معظم التغييرات والتى يجب عليك كمصمم او مبرمج مراعاتها وذلك للتحسين من منتجاتنا وبرمجياتنا ومواقعنا كعرب
وليس بالضرورة التقيد بصلاحية الكود من المتحققات
حيث ولاقرب مثال ليس الياهو خالى من الاخطاء ويمكنك رؤية ذلك
http://validator.w3.org/check?uri=ht...2F%2Fyahoo.com
لاكن المهم اتباع القواعد السابقة وتعديل الاخطاء وستجد النتيجة مذهلة
من حيث سرعة التصفح وثبات الشكل والتصميم فى معظم المتصفحات والاخص الفاير فوكس
اتمنى ان اكون وضحت المهم فى التغييرات وامتنى اذا نسيت شىء تذكيرى به
شكرا للجميع
رد مع اقتباس
المشاركة الأصلية كتبت بواسطة Ala7lam 
