لقد قمنا ببعض التغييرات هنا !

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

تنمية المحتوى العربي

الآن , أصبح تركيزنا الأكبر في نقرة على صناعة المحتوى وتعميمه , نعمل بشكل يومي لتوفير مقالات ذات جودة عالية من مصادر موثوقة لتحسين واقع الانترنت العربي, نحن في مهمة - كما الجميع - لتنمية التواجد العربي على الانترنت

لماذا ؟

قمنا ببحث بسيط , و وجدنا نتائج مخيفة ! يتحدث اللغة العربية ما يقارب 310 مليون شخص في حين أن المحتوى العربي لا يزيد عن 0.7% من محتوى الانترنت العام , و نصف هذا المحتوى محتوى غير هادف و أدنى من الجودة الحقيقية للمجتمع العربي , لذا كان لابد لأحدنا أن يتقدم في مسيرة لتحسين واقع الانترنت العربي .

خدمة مقال و جواب

ملتزمون بدعمنا لجميع خدماتنا السابقة , لا تزال خدمة مقال و جواب فعالة كما كانت من قبل , الفرق الوحيد هو انتقالها الى رابط فرعي على الموقع

لا تزال هذه الخدمة محل اهتمامنا كما هي محل اهتمام الكثير من مستخدمي الموقع , يمكنكم زيارة موقع خدمة مقال و جواب من هنا , كل شيئ سيعمل كما كان في الماضي

qa.naqrah.net

ماذا عن حسابي ؟

كل شيئ تماماً كما تركته ! لا يوجد أي تغييرات في حسابات المستخدمين نهائياً

يمكنك تسجيل الدخول , تسجيل الخروج , تعديل بيانات الحساب , الاشتراك بالقائمة البريدية تماماً كما كنت تفعل سابقاً

حسابك الشخصي

تحديث السياسات

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

سياسة الخصوصية و شروط الاستخدام

الخطوات التالية

الآن , بعد أن تعرفت على التحديثات الحاصلة في الموقع , سننتقل للخطوة التالية

نستطيع توفير مقالات مخصصة لك و تتمحور حول اهتماماتك , نحتاج منك أن تعرفنا باهتماماتك! سنفعل ذلك في الصفحة التالية ...

اختيار الاهتمامات
  • تنمية المحتوى العربي
  • خدمة مقال و جواب
  • ماذا عن حسابي ؟
  • تحديث السياسات
  • الخطوة التالية

ما هي أقل وسوم HTML5 شهرة ؟ وفي ماذا يتم استخدامها ؟

ما هي أقل وسوم HTML5 شهرة ؟ وفي ماذا يتم استخدامها ؟

تشتمل لغة HTML 5 على عدد كبير من الوسوم , غالباً ما نستخدم الوسوم الأساسية كوسوم <h1> و <p> و <section> ربما , لكن هناك بعض الوسوم المضمنة في لغة HTML باصدارها الخامس لا يعلم الكثيرون بوجودها , لنتعرف عليها في هذا المقال !

نبذة سريعة عن لغة HTML باصدارها الأخير HTML 5

لغة HTML هي لغة توصيفية (ليست لغة برمجة) تستخدم لتصميم مواقع الويب في المقام الأول , ولها استخدمات أخرى في تصميم تطبيقات الجوال و سطح المكتب الهجينة , ولتتعرف أكثر على التطبيقات الهجينة ننصحك بقراءة هذا المقال : التطبيقات الأصلية Native والتطبيقات الهجينة Hybrid , أيهما أفضل ؟

ترمز الحروف الى جملة Hyper Text Markup Language وتعني لغة ترميز النص الفائق , وتفتقر لغة HTML الى العديد من المزايا كالحلقات التكرارية و الدوال و المتغيرات , لذلك لا تعتبر لغة برمجة.

و يعد اتحاد شبكة الويب العاملة W3C هو المسؤول المباشر عن اللغة وتطويرها , وقام هذا الاتحاد في عام 2014 بتعميم الاصدار الخامس من HTML والذي يستخدمه النسبة الأكبر من مصممي الويب في وقتنا الحالي.

بعد أن تعرفنا على لغة HTML , سندخل الآن في موضوعنا الأساسي , سنعرفك على أقل وسوم HTML شهرة و فائدتها و كيفية استخدمها .

وسم <details> لعرض معلومات واظهارها

من الوسوم التي لا تستخدمها عادة مع أنها تسهل عليك العمل كثيراً , فبدلاً من انشاء فكرة ال Accordion باستخدام جافاسكريبت , يمكنك عملها بوسم HTML واحد !

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

<details open><p>You can visit naqrah to show our awesome blog</p></details>

وسم <dialog> لانشاء مربع حوار أو نافذة

لا يستغرب أن هذا الوسم قليل الاستخدام , فهو ليس ذا فائدة كبيرة في الحقيقة , فكل ما يفعله هو انشاء مربع حوار , مثال :

<dialogopen><p>Welcome do our website.</p></dialog>

وسم <mark> لتعزيز بروز النصوص

قد يبدو من الوسوم المميزة , فيقوم هذا الوسم باضافة خلفية للنص لتعزيز ظهوره أمام المستخدمين , مثال :

<p>Credit card required at time of <mark>booking.</mark></p>

اذاً , تخيل مع بعض ال css الامكانيات الواردة لهذا الوسم ! الا يمكننا انشاء زر باستخدام css واستخدامه على وسم <mark> و من ثم تضمين جميع الروابط ضمن وسم <mark> لانشاء تصاميم مذهلة بوقت قصير ؟

وسم <summary> لتحديد عنصر بارز في وسم <details>

<details><summary>Payment conditions</summary><p>Credit card required at time of booking.</p></details>

وسم <date> و <time> لاظهار التواريخ بشكل مميز

تستخدم للتعامل مع الوقت و التاريخ بشكل عام , وتقوم بعمل بعض التنسيقات للوقت و التاريخ في المتصفح , مثال :

<p>Breakfast buffet starts at<time>7.00 AM</time>at the restaurant.</p> 
<p>Concert at the lobby in<time datetime="2018-06-20T19:00">June 20th 7.00 PM</time></p> 

وسم <small> لتقليل أهمية العناصر عبر تصغير الحجم

يجب استخدام هذا الوسم لتقليل أهمية النص أو المعلومات. تفسر المتصفحات هذا من خلال جعلها ذات حجم خط أصغر حجماً، وبالتالي يكون لها تأثير أقل وضوحاً. يقلل هذا الوسم حجم النصوص بنسبة 40% من حجم العنصر الأب له. (معلومة غير مؤكدة)

مثال :

<p>Cancelations must be canceled up to 48h, <small>to avoid penalty of one night per room.</small></p> 

وسم <progress> لاظهار شريط تحميل على الشاشة

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

<progress value="70" max="100">70 %</progress>

في النهاية ...

ربما هذه هي أقل الوسوم استخداماً , ولكن كما شاهدنا بعض هذه الوسوم له أهمية ويضفي لمسة مميزة الى موقعك , بعضها الآخر مجرد بايتات لا داع لها بأي شكل من الأشكال , شاركنا برأيك , هل استخدمت أحد هذه الوسوم من قبل ؟