HTML مقابل HTML5. ما هو الاختلاف الكبير؟ إذا كنت تتطلع إلى الدخول في تطوير الواجهة الأمامية أو العمل باستخدام كود في وورد بريس ، فأنت بحاجة إلى معرفة الفرق. قد يكون الأمر محيرًا بشكل خاص لأن بعض الأشخاص قد يستخدمون المصطلحين بالتبادل ، لكنهما من الناحية الفنية شيئان مختلفان – على الرغم من أنهما مرتبطان أيضًا.
دعنا نتعرف على الاختلافات بين HTML و HTML5 ، أيهما أفضل ، وما تغير مع أكبر تحديث للغة الترميز الشائعة.
HTML تعني لغة ترميز النص التشعبي . إنها تشكل اللبنات الأساسية للويب ، ومن المحتمل أن تكون لغة الترميز الأكثر شيوعًا هناك.
HTML هي اللغة القياسية المستخدمة لتطوير الويب. هناك العديد من أدوات تطوير الويب التي يمكنك استخدامها عند العمل باستخدام HTML. يسمح لك بإنشاء البنية الأساسية لصفحة الويب باستخدام علامات صغيرة تسمى علامات التمييز. على سبيل المثال ، لجعل جزء من النص مائلاً ، يمكنك لفه في علامات HTML على النحو التالي:
<i>Italicized text.</i>
مثال علامة HTML
مثال علامة HTML
يعتبر الكثير من HTML بالمثل بسيطًا ويمكن للبشر قراءته ، لذلك حتى غير المطورين يجدون أنه من السهل التعامل معه. لمدى أهمية ذلك بالنسبة لشبكة الويب العالمية ، فإن التقاط HTML أمر سهل للغاية.
من المستحيل إنشاء موقع ويب بدون استخدام HTML. في حين أن هناك منشئي مواقع ويب يمكنهم من تصميم موقع دون لمس أي كود ، بما في ذلك وورد بريس ، فهم لا يزالون يتعاملون مع كود HTML من أجلك خلف الكواليس.
لذلك ، إذا كنت تريد أن تصبح مطور ويب أو تتعمق في أدوات مثل وورد بريس ، فستحتاج بطبيعة الحال إلى تعلم HTML.
غالبًا ما يتم إقران HTML مع لغات أخرى مثل CSS و JavaScript لتوسيع وظائفها. يساعدك CSS على تصميم HTML عن طريق إضافة الألوان والتخطيطات والمزيد ، بينما JavaScript هي لغة برمجة أكثر تقليدية تتيح لك إضافة ميزات متقدمة.
في حين أن هاتين اللغتين تتوافقان جيدًا مع HTML ، إلا أنهما ليسا ضروريين تمامًا لإنشاء موقع ويب. HTML مطلوب بالتأكيد ، ولهذا السبب هي أهم لغة ويب.
قد تبدو متشابهة للوهلة الأولى ، ولكن هناك بعض الاختلافات الكبيرة جدًا بين HTML و HTML5 👀 شاهد ما تم تغييره في أكبر تحديث للغة الترميز الشائعة هنا 👇
انقر للتغريد
شعار شارة HTML5
شعار HTML5 (المصدر: W3C )
HTML5 ليس نظامًا منفصلاً ، بل هو أحدث إصدار من تقنية HTML. كان الإصدار السابق ، HTML4 ، قد تم تحديثه الأول والأخير في ديسمبر 1999. HTML5 ليس جديدًا في حد ذاته ، حيث تم إصداره منذ عدة سنوات في عام 2014.
إذن ما هو الاختلاف الكبير؟ لماذا كل هذا الضجيج؟ بينما تظل العديد من علامات الترميز بدون تغيير (لا تقم بإصلاح ما لم يتم كسره ، بعد كل شيء) ، فقد تم تبسيط العديد منها ، لذلك من الأسهل والأسرع كتابة التعليمات البرمجية. يعتمد على معيار جديد تمامًا ، كما أن تحليله مختلف تمامًا أيضًا.
على عكس الإصدارات القديمة من HTML ، والتي سمحت لك بإنشاء مواقع ثابتة بشكل أساسي تحتاج إلى تعزيزها باستخدام CSS و JavaScript ، فإن HTML5 أكثر ديناميكية وتتضمن عناصر وسائط متعددة. إنه يدعم الفيديو والصوت أصلاً ، ويمكنك حتى إنشاء ألعاب أو رسوم متحركة باستخدامه.
بمعنى آخر ، HTML5 قادر تمامًا على القيام بالأشياء التي كنت بحاجة إلى القيام بها سابقًا باستخدام الأدوات القديمة مثل JavaScript أو Flash أو Silverlight. هذا يعني أن موقعك أكثر أمانًا وأقل انفتاحًا على عمليات الاستغلال من المهاجمين الذين يحاولون الدخول.
وعلى الرغم من أن CSS و JavaScript لا يزالان ضروريين بالتأكيد لإنشاء موقع ويب كامل ، لم تعد بحاجة إلى الاعتماد عليهم للقيام بأي شيء ديناميكي على الإطلاق.
لم يعد HTML5 مجرد منشئ مواقع ويب. إنه منشئ تطبيق كامل من تلقاء نفسه.
بدلاً من إصدار التحديث التالي باسم “HTML6” ، يتم تحديث HTML5 باستمرار كمستوى معيشي يتطور حسب احتياجات الويب. إنها أحدث وأكبر نسخة من هذه التقنية طويلة الأمد ، وستبقى هنا لفترة طويلة قادمة.
عندما يتحدث معظم الناس عن “HTML” ، فإنهم يشيرون إلى التكنولوجيا ككل ، بما في ذلك أحدث إصدار لها: HTML5. على الرغم من اختلافه كثيرًا من نواحٍ عديدة ، إلا أن HTML5 هو في الحقيقة مجرد تحديث مصقول للمعيار القديم.
في حين أن HTML و HTML5 جزء من نفس النظام ، فقد جلب التحديث الكبير العديد من التحسينات على لغة الترميز القديمة ، مما يجعلها أكثر كفاءة. فيما يلي بعض الأمثلة على ما تمت إضافته.
عندما ظهرت HTML5 لأول مرة ، كان التوافق مصدر قلق كبير وسببًا رئيسيًا وراء اختيار الكثيرين عدم ترقية مواقعهم بعد. إذا كان المتصفح لا يعرف كيفية تحليل علامة HTML5 ، فقد يؤدي ذلك إلى ظهور صفحات معطلة أو غريبة المظهر.
العكس هو الصحيح: غالبًا ما تتعطل مواقع الويب المكتوبة بمعايير HTML4 القديمة في المتصفحات الحديثة ، حيث أسقطت المتصفحات منذ فترة طويلة دعم الوظائف القديمة. إذا كنت تريد أن تظل متوافقًا مع معظم متصفحات الأشخاص ، فإن HTML5 هو السبيل للذهاب.
بينما تعمل الإصدارات القديمة من HTML بشكل جيد على متصفحات مثل Internet Explorer ، فإن هذه الإصدارات القديمة لم تعد مدعومة أو مستخدمة من قبل غالبية المستخدمين. لن يحتاج معظم الأشخاص إلى ترميز موقع ويب لمثل هذه المتصفحات القديمة ، لذلك لا داعي لاستخدام HTML4.
كما ترى هنا ، يتم دعم HTML5 ومعظم وظائفه في جميع المتصفحات الحديثة. يتم دعم علاماته الجديدة كليًا أو جزئيًا في جميع إصدارات Internet Explorer 6-8 و Firefox 2 ، وجميعها من أوائل العقد الأول من القرن الحادي والعشرين ونادرًا ما يتم استخدامها اليوم.
التحقق من دعم مستعرض HTML مقابل HTML5
التحقق من دعم مستعرض HTML مقابل HTML5
بينما تدعم جميع المتصفحات الحديثة HTML4 تقنيًا ، يكون دعم العلامات القديمة متقطعًا في أحسن الأحوال. يجب تجنب استخدام المعايير القديمة والتحول إلى HTML5.
أحد أكبر الأشياء التي يجلبها HTML5 إلى الجدول هو دعم عناصر الوسائط المتعددة مثل الصوت والفيديو والرسومات المتجهة والرسوم المتحركة والألعاب.
في الأيام الخوالي للويب ، كان وضع الكثير من الرسوم المتحركة البسيطة على موقعك يتطلب عادةً استخدام JavaScript أو Flash أو بعض التقنيات الأخرى. يمكنك الآن القيام بذلك بتنسيق HTML أو CSS دون الحاجة إلى الانفتاح على أي مآثر محتملة.
مع الفيديو و الصوت ، تضمين لاعب سهلا كما هو اسقاط في علامة بسيطة. هناك الكثير من التهيئة التي يمكنك القيام بها من هناك ، مثل تشغيل التشغيل التلقائي أو إضافة عناصر تحكم اللاعب.
مشغل صوت HTML5
مشغل صوت HTML5
يدعم HTML5 أيضًا تضمين رسومات متجهة SVG —صور يمكن تغيير حجمها إلى أي دقة بدون بكسل. تزداد شعبية SVGs لعرض الرسومات عبر الإنترنت نظرًا لأنها تمتد جيدًا لملء أي حجم شاشة.
أخيرًا ، يمكنك إنشاء ألعاب فيديو كاملة باستخدام HTML5 ، خاصةً إذا قمت بدمجه مع JavaScript. حتى أن العديد من أدوات إنشاء الألعاب تنتقل إلى HTML5 وتسمح لك بتضمين النتيجة على موقع الويب الخاص بك.
هذا الدعم للوسائط المتعددة يجعل HTML5 المرشح المثالي لاستبدال العديد من التقنيات القديمة ، بما في ذلك Java Web Start و Silverlight ومؤخرًا Flash . تقريبًا كل ما يمكنك القيام به مع هذه الأنظمة يمكن القيام به بشكل أكثر بساطة وكفاءة في HTML5.
كانت لغة HTML الأصلية (حتى الإصدار 4) تعتمد بشكل كبير على معيار SGML أو لغة الترميز المعيارية العامة.
تريد أن تعرف كيف زدنا من حركة المرور لدينا أكثر من 1000 ٪؟
انضم إلى أكثر من 20000 آخرين ممن يتلقون رسائلنا الإخبارية الأسبوعية مع نصائح من الداخل حول وورد بريس!
إشترك الآن
بينما تهدف SGML إلى توحيد الترميز ، والقضاء على الالتباس ، وقد ألهمت كل من HTML و XML ، فقد انحدرت من لغة تم إنشاؤها في الستينيات. إنه قديم وبالتالي لم يتم تصميمه مع وضع تطبيقات الويب الحديثة في الاعتبار.
تطورت HTML5 بحيث لم تعد متوافقة مع SGML ؛ بدلاً من ذلك يوزع مع قواعده الفريدة الخاصة به. في حين أن أصولها لا تزال في SGML ، و HTML5 هي مجرد امتداد للتقنية الحالية ، إلا أنها لم تعد متوافقة مع تلك المعايير.
إحدى نتائج ذلك هي أن معالجة الأخطاء أصبحت أكثر تسامحًا الآن. لن يؤدي خطأ صغير واحد إلى حدوث مشكلة فاضحة للمشاهدين على صفحتك أو عدم تحميل الصفحة على الإطلاق.
كما تحسنت الدلالات أو العلامات بشكل كبير. من قبل، هيكلة صفحتك على الإطلاق الاستعمال المستمر المطلوب من <div>علامات: <div id=“header”>، <div id=“menu”>و <div class=“post”>.
في HTML5، فإن تلك المدونات عالي الكعب يكون <header>، <nav>و <article>. هذه العلامات هي أنظف وأكثر استجابة.
تم تقديم العديد من العلامات الجديدة أيضًا. تم إنشاء العديد منها لاستبدال divs والإطارات المستخدمة سابقًا لهيكلة الصفحات.
لم يتم تغيير العديد من علامات الترميز القديمة تمامًا ، لذا فإن HTML5 متوافق جزئيًا مع الإصدارات الأقدم. لكن لن يتم تحليل مستند HTML4 بشكل صحيح مع المعايير الجديدة.
على الرغم من وجود بعض الاختلافات بين HTML و HTML5 ، فإن التغييرات عمومًا للأفضل وتهدف إلى جعل لغة الترميز أكثر سهولة.
تتمثل إحدى أكبر مزايا HTML5 في أنها أسرع بكثير وأكثر استجابة من التكرارات السابقة. في عصر HTML الأصلي ، لم تكن الأجهزة غير أجهزة الكمبيوتر التي تصل إلى الإنترنت حلما حتى الآن ؛ الآن ، يمكن الوصول إليها جميعًا من الهواتف والساعات وأجهزة التلفزيون ، ويرجع الفضل في ذلك جزئيًا إلى سرعة HTML5.
جلب الإصدار الجديد معايير أفضل للحفاظ على تشغيل مواقع الويب بسلاسة أكبر على الأجهزة الأصغر والأقل قوة. ستظل العديد من مشكلات الأداء تعتمد عليك وعلى جودة التعليمات البرمجية الخاصة بك. ومع ذلك ، فقد تم ربط الكثير من النهايات السائبة على جانب HTML بتحديث HTML5.
على سبيل المثال ، يدعم HTML5 خيوط المعالجة المتعددة مع JavaScript Web Workers ، مما يسمح لمعالج جهازك باستخدام المزيد من قوته لتشغيل البرامج النصية. سيتم الآن تشغيل التعليمات البرمجية المستخدمة لتعطيل الصفحة بسلاسة.
يعد تصميم مواقع الويب سريعة الاستجابة أسهل بكثير في HTML5. تحتوي HTML4 على العديد من العناصر غير المستجيبة ، مثل divs ، تم استبدالها بعلامات البنية التي تعمل بشكل أفضل على الهاتف المحمول.
تمت إزالة الإطارات أيضًا للتسبب في مشكلات تتعلق بسهولة الاستخدام وإمكانية الوصول. على الرغم من أنها لا تزال مدعومة ، فقد تم إهمالها ويجب عدم استخدامها إلا إذا كان لديك سبب للعمل باستخدام تقنية قديمة.
على الرغم من عدم وجود بديل مباشر لـ HTML5 للإطارات ، فمن المستحسن استخدام عناصر CSS مثل المربعات المرنة أو إطارات iframes (التي لا تزال مدعومة في HTML5) لاستبدال الوظائف القديمة.
هل تحتاج إلى استضافة سريعة وآمنة وصديقة للمطورين لمواقع عملائك؟ تم تصميم Kinsta مع وضع المطورين في الاعتبار ويوفر الكثير من الأدوات مع لوحة تحكم قوية. تحقق من خططنا
تعادل عناصر التحكم في النموذج الجديدة مستوى جديدًا من التحكم في موقعك. على الرغم من أن هذا قد يبدو وكأنه ميزة صغيرة ، إلا أنه يعني الحاجة إلى الاعتماد على تقنية خارجية أقل لإنشاء نموذج عمل.
مثال على شكل HTML5
مثال على شكل HTML 5
في الأصل ، يدعم HTML فقط النص وكلمة المرور والمخفي ومربع الاختيار / الراديو وأنواع إدخال تحميل الملف. على الرغم من أن هذا يكفي لإنشاء نموذج إدخال أساسي ، إلا أن هناك الكثير مما يمكنك فعله باستخدام أنواع إدخال HTML5 الآن.
تشمل الإضافات الجديدة البريد الإلكتروني ورقم الهاتف وعنوان URL ومربع البحث وشريط التمرير والأرقام ومنتقي التاريخ والوقت ومدخلات منتقي الألوان.
تسمح لك هذه المجموعة المتنوعة من أنواع الإدخال بإنشاء نماذج أفضل يمكنها قبول المزيد من أنواع المحتوى ، مع التحقق من الصحة المضمنة للتأكد من أنها صحيحة. تحقق من القائمة الكاملة لمدخلات HTML لمزيد من المعلومات.
عندما يتعلق الأمر بتخزين الويب ، فإن HTML4 وما دونه يدعمان بشكل أساسي ملفات تعريف الارتباط وغير ذلك الكثير. كان تخزين أي معلومات إلى جانب تتبع المستخدم الأساسي في ملف تعريف ارتباط صغير يبلغ 4 كيلوبايت أقرب إلى المستحيل.
من ناحية أخرى ، يتيح لك التخزين المحلي تخزين 5-10 ميغا بايت من البيانات اعتمادًا على المتصفح. يتيح لك ذلك حفظ معلومات جانب العميل حول الجلسات السابقة وبيانات الوصول دون اتصال بالإنترنت والتخصيصات الشخصية والمزيد. إلى جانب ذلك ، لا يتم مسح التخزين المحلي تلقائيًا ، على عكس ملفات تعريف الارتباط.
تم تمكين الوضع الداكن في أداة التخصيص وتمكينه في الموقع الأمامي
تم تفعيل الوضع الداكن في أداة تخصيص وورد بريس
أحد الأمثلة على ما يمكنك القيام به باستخدام التخزين المحلي هو حفظ تفضيل المستخدم للسمة الفاتحة أو الداكنة على موقعك ، مما يضمن استمرارهم في رؤية موقعك كما يفضلونه في زيارتهم التالية. بينما يمكنك أيضًا حفظ تفضيلات المستخدم مع ملفات تعريف الارتباط ، فسيقوم المتصفح بمسحها حتمًا بعد مرور بعض الوقت.
يدعم HTML5 التخزين المحلي من خلال Web Storage API . كما أنه يدعم تخزين قاعدة بيانات Web SQL وتخزين قاعدة البيانات المفهرسة وحتى الوصول إلى الملفات باستخدام File API . يتكامل العديد منها مع JavaScript من خلال واجهات برمجة التطبيقات . قبل ذلك ، كان القيام بذلك أمرًا مرهقًا للغاية أو ، في بعض الحالات ، لم يكن ممكنًا أو كان مرهقًا للغاية.
إذا كنت تريد تعلم البرمجة ، فعليك بالتأكيد تجنب استخدام المعايير القديمة. HTML5 هو أحدث إصدار من HTML ويجب استخدامه دائمًا على الإصدارات القديمة من اللغة.
كما هو مذكور أعلاه ، تعمل HTML5 على تحسين العديد من جوانب HTML4 التي كانت قديمة ويصعب التعامل معها. بالإضافة إلى ذلك ، يمكن لـ HTML5 القيام بالعديد من الأشياء محليًا ، بينما يعتمد HTML4 كليًا على الأنظمة التي تم إيقافها منذ فترة طويلة مثل Silverlight و Java Web Start و Flash.
بينما لا يتم عرض HTML5 دائمًا بشكل صحيح على المتصفحات وأنظمة التشغيل القديمة جدًا (مثل Internet Explorer أو الإصدارات القديمة من الهواتف المحمولة) ، فإن هذه الأنظمة الأساسية قديمة للغاية ونادراً ما يتم استخدامها بعد الآن. لم تعد هناك أي أسباب وجيهة لاستخدام إصدارات قديمة من HTML على المعايير الحديثة.
لسوء الحظ ، هناك الكثير من المعلومات على الإنترنت وفي الكتب حول الإصدارات القديمة من HTML. عندما تبحث عن دليل أو تتعلم من دورة أو كتاب ، تأكد من أنه يتحدث عن HTML5 وأنه تم إصداره أو تحديثه بعد عام 2014. لا فائدة من تعلم المعايير القديمة من عام 1999.
إذا كان لديك موقع ويب قديم ، فأنت بحاجة إلى تحديثه. للأسف ، لا توجد طريقة حقيقية لإجراء تحويل كامل دون القيام بأي عمل يدوي.
أفضل ما يمكنك فعله هو قراءة مواصفات HTML5 (أو أخذ دورة HTML إذا كنت جديدًا تمامًا في اللغة) والتعرف على التغييرات. بعد ذلك ، يمكنك إعادة كتابة الكود وإضافة الميزات الجديدة التي أضافوها في HTML5.
راجع هذا الدليل للترحيل من HTML4 إلى HTML5 . يغطي على نطاق واسع التغييرات اليدوية التي تحتاج إلى إجرائها على الكود.
يمكنك أيضًا تجربة محول XHTML إلى HTML5 هذا ، ولكن تأكد من مراجعة التعليمات البرمجية يدويًا أو إدخالها في المدقق قبل استيرادها إلى موقع مباشر.
لحسن الحظ ، HTML5 هو محتوى جديد في الغالب. هناك عدد قليل من العلامات المهملة التي ستحتاج إلى استبدالها ، ولكن إلى جانب ذلك ، لا تعد ترقية الشفرة عادةً مسعى كبير إلا إذا كان موقعك يعتمد بشكل كبير على تقنية مهملة مثل الإطارات.
إذا كنت تتطلع إلى الدخول في تطوير الواجهة الأمامية أو العمل باستخدام كود في وورد بريس 👩💻 ، فأنت بحاجة إلى معرفة الفرق بين HTML و HTML5 … وقد غطيت هذا المنشور 💪
انقر للتغريد
إن HTML و HTML5 هما جزءان فقط من نفس التقنية ، على الرغم من أنهما يعنيان أشياء مختلفة قليلاً. يشير HTML إلى لغة الترميز ككل ، غالبًا إلى الإصدار الأحدث ، بينما HTML5 هو آخر تحديث لها.
إذا كنت تتطلع إلى تعلم HTML ، فمن المهم استخدام أحدث إصدار: HTML5. إنه أفضل من كل النواحي ، وحتى لو كان ذلك يعني الاضطرار إلى تحويل الكثير من التعليمات البرمجية القديمة يدويًا ، فهو بالتأكيد يستحق كل هذا الجهد.
أصبح HTML5 منذ عدة سنوات ، وباعتباره المستوى المعيشي للغة ككل ، سيستمر فقط في التحديث للعمل مع الويب الحديث.
