الإعلانات

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

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

مقدمة للعناصر الدلالية

مثل الكثير من الإنترنت ، تحول HTML5 إلى التركيز على دلالات. الآن ، بدلاً من استخدام العلامات ببساطة للتنسيق ، يتم استخدامها أيضًا لإخبار المتصفحات ومحركات البحث أعلى 7 محركات بحث دلالية كبديل لجوجل قراءة المزيد معنى ما يحيطون به.

فمثلا،

يخبر متصفح ببساطة أنه يحتوي على فقرة.

، الذي سنناقشه للحظات ، يخبر المتصفح أنه يحتوي على المحتوى الرئيسي للصفحة.

لا تزال الشبكة الدلالية تتطور ، وقد بدأنا فقط في خدش سطح ما يمكنها القيام به. HTML5 يساعد على جلب الترميز الدلالي ما هو الترميز الدلالي وكيف سيغير الإنترنت إلى الأبد [شرح التكنولوجيا] قراءة المزيد إلى جزء أكبر بكثير من الإنترنت ، ويمكن أن يكون ذلك جيدًا لمستقبل المعالجة الدلالية.

1.

ال

تحدد العلامة "المحتوى المستقل بذاته". أسهل مثال ، بالطبع ، مقال. بالنسبة لهذه المقالة بالذات ، سنفتح العلامة قبل المقدمة ونغلقها بعد الانتهاء.

 كل النص في قسمك المستقل. 

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

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

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

2.

ترتبط ارتباطا وثيقا

يكون

. يحدد هذا "التجميع المواضيعي للمحتوى ، عادةً بعنوان". وبالتالي

سيكون بالداخل

… حق؟

ليس بالضرورة. يشير W3 إلى أنه يعتمد على بنية موقعك. قد يكون لديك محتوى قائم بذاته في أقسام مختلفة من صفحتك (فكر في الصفحة الأولى من موقع إخباري على سبيل المثال). قد يكون لديك بعد ذلك أقسام داخل تلك المقالة.

لماذا تحتاج إلى DAC
كل شيء يبدو أفضل.
كيفية إعداد DAC
إليك ما عليك القيام به.. .

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

3.

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

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

كل ما تحتاج إلى معرفته عن DACs
فيما يلي مقدمة مفيدة عن DACs ...
 بقية مقالك يذهب هنا.

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

4.

يقول W3 أن علامات التذييل تحتوي عادةً على "مؤلف المستند ومعلومات حقوق النشر وروابط شروط الاستخدام ومعلومات الاتصال وما إلى ذلك" يمكنك التفكير في الأمر على أنه "تدبير منزلي".

تنص الوثائق أيضًا على أنه يمكن أن يكون لديك أكثر من قسم تذييل واحد على صفحتك. ربما تكون فكرة جيدة أن تحتفظ بكل هذه المعلومات في مكان واحد.

5.

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

هذه علامة بسيطة حقًا - وهذا كل ما في الأمر. استخدمه لتعريف قسم التنقل ، ولا تستخدمه مرة أخرى على صفحتك.

6.

أحد العناصر الجديدة الأكثر إثارة للاهتمام في HTML5 هو الجانب. يعطيه W3 تعريفًا غير مفيد إلى حد ما لـ "بعض المحتوى بصرف النظر عن المحتوى الذي يتم وضعه فيه."

باختصار ، جانبا هو أي شيء يتعلق (ولكن منفصل عن) المعلومات المحيطة. يمكن أن يكون شريطًا جانبيًا يضيف تفاصيل إلى المحتوى الخاص بك. عندما يتم استخدامه ضمن مجموعة من

العلامات ، فهو يوفر معلومات إضافية ليست ضرورية لفهم المحتوى الرئيسي.

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

لكن ال

 المقالة الرئيسية هنا.  تستمر المقالة هنا.

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

7.

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

عند استخدام علامة التفاصيل ، تقوم بإنشاء نص مخفي يمكن عرضه بسهولة. إليك مثال:

انقر هنا لرؤية المعلومات.

إليك معلومات أكثر تفصيلاً لا تحتاجها على الفور.

فقط انقر على السهم للحصول على التفاصيل. بسيط. إنشاءه بنفس السهولة. إليك الرمز المستخدم في المثال أعلاه:

 انقر هنا لرؤية المعلومات. 
 إليك معلومات أكثر تفصيلاً لا تحتاجها على الفور. 

ال

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

هناك المزيد أشياء رائعة يمكنك القيام بها باستخدام HTML 8 تأثيرات HTML رائعة يمكن لأي شخص إضافتها إلى موقعه على الويبلست بحاجة إلى معرفة CSS أو PHP لإنشاء موقع فاخر. استخدم حيل HTML الرائعة لإنشاء تأثيرات رائعة. قراءة المزيد أيضًا ، حتى إذا كنت لا تعرف الكثير عن CSS أو JSON.

8-9.

و

لا تقلق العلامة التي كنت تستخدمها منذ سنوات لن تختفي.

يتجول حول علامة الصورة ويتيح للمتصفح معرفة أنها صورة أو رسم تخطيطي أو قائمة تعليمات برمجية أو أي شكل آخر.

إذا تمت إزالة شكل من الصفحة ، فلن يؤثر على تدفق المحتوى.

يمنحك هذا طريقة مضمنة لإضافة تعليق على صورك. لا حاجة للذهاب من خلال CMS الخاص بك بعد الآن.

استفد من قوة HTML5

تضيف العناصر الجديدة في HTML5 الكثير من القوة ، خاصة للأغراض الدلالية. هناك عناصر إضافية للتنسيق ، والقياسات العددية ، وتقدم المهمة ، والمزيد. يمكنك ان ترى جميع العناصر الجديدة في W3Schools.

ولكن إذا تمكنت من إتقان هذه التسعة ، فستكون في طريقك لاستخدام HTML5 جيدًا. وإذا كنت مستخدمًا جديدًا لـ HTML ، فتأكد من ذلك أمثلة التعليمات البرمجية هذه 17 أمثلة بسيطة على كود HTML يمكنك تعلمها في 10 دقائقهل تريد إنشاء صفحة ويب أساسية؟ تعرف على أمثلة HTML هذه وجربها في محرر نصوص لترى كيف تبدو في متصفحك. قراءة المزيد !

هل بدأت في استخدام HTML5؟ ما العناصر الجديدة التي تجدها أكثر فائدة؟ شارك أفكارك في التعليقات أدناه!