آموزش تگ article در HTML

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ article در HTML با من همراه باشید.

آموزش تگ article در HTML

Free-Learn

تگ article در HTML

تگ article تگی است که ما با استفاده از آن میتوانیم یک محتوای مستقل را در یک صفحه ی وب ایجاد نماییم.

کلمه Article در لغت به معنای [ مقاله ] می باشد، این یعنی ما با استفاده از این تگ میتوانیم مقاله یا مثلا مطالب و یا بطور کلی پست های سایت مون رو درون این تگ قرار دهیم.

وقتی مرورگر این تگ رو ببینه متوجه میشه که محتوای درون این تگ یک محتوای مستقل است محتوایی که میتونه معنی و مفهموم داشته باشه، محتوایی که با بقیه قسمت های یک سایت میتونه فرق داشته باشه.

معمولا از این تگ برای ایجاد موارد زیر در یک وبسایت مورد استفاده قرار میگیرد :

  • مطالب انجمن
  • مطالب سایت
  • پست های خبری
  • نظرات یا کامنت های وبسایت

سوال ارسالی از کاربر محترم سایت : آقای یزدان منجزی

فرق بین تگ های Section و Article چیست؟ آیا میتوان از تگ Section درون تگ Article استفاده کرد و یا برعکس؟

پاسخ : بله درکل میشه، هم میشه از تگ Article درون تگ Section استفاده کرد و هم برعکس، فقط بستگی به نحوه استفاده شما داره. مثلا میتوان یک Section ایجاد کرد با نام ( آخرین مطالب سایت ) و درون این سکشِن از تگ Article استفاده کرد و آخرین مطالب سایت رو به نمایش گذاشت.

و یا میتوان یک مطلب با تگ Article ایجاد کرد و سپس محتوای درون مطلب را بخش بندی کرد، مثلا بخش اول تعریف و توضیحات ، بخش دوم تصاویر و.. بخش سوم هم مثلا نتیجه گیری – پس اینجوری هم میشه از تگ Section درون تگ Article استفاده کرد و هم برعکس. ( لطفا به مثال های شماره ۲ و ۳ زیر که در این رابطه هستند توجه نمایید )

Free-Learn

مثال از تگ article در HTML

در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.

امتحان کنید

یک سوال خیلی مهم در رابطه با مثال بالا : همیشه میگن که نباید بیشتر از ۱ عدد تگ تیتر H1 در صفحه قرار بدهیم پس چرا در مثال بالا ۲ عدد تگ تیتر H1 آورده شده؟؟

پاسخ : بله درسته گفتن و باید همیشه از ۱عدد تگ تیتر H1 در درون صفحه مطالب استفاده نمود، ولی توجه داشته باشید ما در یک سایت ۲ صفحه میتونیم داشته باشیم » یک صفحه اصلی داریم و یک صفحه مطالب سایت.

ادامه پاسخ : در صفحه اصلی سایت معمولا نام اون سایت یا لوگوش رو میزارن داخل تگ H1 و عنوان مطالب رو میزارن داخل تگ H2 و در داخل صفحه مطالب سایت عنوان اون مطلب داخل تگ H1 قرار میگیره.

ادامه پاسخ : پس باید بدونیم که هروبسایت بطور کلی ۲ صفحه دارد: صفحه اصلی سایت و صفحه مطالب ، در صفحه مطالب عنوان یک مطلب باید حتما داخل تگ H1 باشه.

ادامه پاسخ : ولی در صفحه اصلی اگه از تگی همچون Article استفاده بکنیم میتونیم تو هر یک از تگ های article از یک عدد تگ H1 استفاده نماییم ( بخاطره اینه که تگ article یک محتوای مستقل رو به مرورگر نمایش میده ) در نتیجه مرورگر میتونه درک کنه که اون تگ های H1 مرتبط با محتوای ایست که درون تگ article می باشد.

ادامه پاسخ : ولی خب بازم با این حال من پیشنهاد میکنم توی صفحه اصلی سایتتون ، نام سایتتون یا در واقع همون لوگوی سایتتون رو بزارید داخل تگ H1 و در داخل صفحه مطالب نیز فقط عنوان اون مطلب رو بزارید داخل تگ H1 .

مثال شماره ۲ : استفاده از تگ Article درون تگ Section

 

مثال شماره ۳ : استفاده از تگ Section درون تگ Article

 

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ article در HTML پشتیبانی میکنند یا خیر.

نام مرورگر Chrome Firefox Opera Safari IE
پشتیبانی ۶٫۰ ۴٫۰ ۱۱٫۱ ۵٫۰ ۹٫۰

Free-Learn

پشتیبانی از صفات و رویدادهای عمومی

تگ article از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.

Free-Learn

نکات و توضیحات

تگ article یک تگ جدید/اضافه شده در HTML5 می باشد.

از این تگ میتوانید برای ایجاد مطالب یا در واقع پست های اصلی سایتتون، و مطالب انجمن ها، مطالب خبری ( در سایت های خبری ) و در نهایت نظرات یا دیدگاهای کاربران استفاده نمایید.

Free-Learn

دستورات CSS پیش فرض

معمولا مرورگرها تگ article را بصورت پیش فرض با دستورات CSS زیر نمایش میدهند.


Free-Learn

دریافت PDF یا پرینت این مطلب