معرفی برچسب article در HTML5 – قسمت اول
لینکهای مرتبط با مقاله :
لینک قسمت دوم مقاله
HTML5 همراه با چندین برچسب (tag) جدید معرفی شده است . یکی از این برچسب ها که نقش بسزایی در آینده وب معنایی (Semantic Web) ایفا خواهد کرد بر چسب article می باشد. معرفی و بررسی این برچسب جدید در قالب سه پست جداگانه ارائه خواهد شد. در مقاله پیش رو به معرفی این برچسب می پردازیم و در مقالات بعدی به رفع ابهامات موجود در رابطه با این برچسب خواهیم پرداخت.
بسیاری از توسعه دهندگان و برنامه نویسان وب پس از معرفی برچسب های جدید HTML5 دچار ابهاماتی در بکارگیری آنها شده اند. در نگارش متن سعی در انتخاب بهترین و مناسب ترین کلمات جهت معرفی برچسب مورد بحث شده است و سعی بر آن بوده کلماتی که تاکید بیشتری بر آنهاست با شمایل متفاوتی نمایش داده شوند. بنابراین مطالعه دقیق و تامق در مورد بکارگیری برخی از عبارات و کلمات توصیه می گردد !
یادآوری : یک المان (Element) در HTML شامل (۱) Tag باز شونده ، (۲) محتوای مابین Tag باز شونده و بسته شونده و (۳) نهایتاً Tag بسته شونده است. به عنوان مثال <b> یک Tag (برچسب) است در حالیکه به عبارت زیر یک المان گوییم .
<b> Arad Haghi Blog </b>
معرفی برچسب article
یک المان article دربرگیرنده یک ترکیب کامل در یک سند ، صفحه ، برنامه یا سایت است که می توان آن را به صورت مستقل از سایر قسمت ها در نظر گرفت و آن را به صورت مستقل توزیع و یا مورد استفاده مجدد قرار داد. به عبارت دیگری از این المان جهت تمیز دادن محتوا در صفحات وب استفاده می شود . هوووم؟
شاید ظاهر تعاریف ارائه شده کمی ترسناک به نظر برسد ! به همین دلیل و به جهت انتقال هر چه بهتر مفاهیم اقدام به کالبد شکافی تعاریف فوق می کنیم .
شاید عبارت ترکیب کامل در تعاریف ارائه شده اولین چیزی باشد که توجه ما با جلب کند. منظور از ترکیب کامل چیست ؟ یک ترکیب شامل چه مواردی است ؟ تمرکز اصلی HTML بر محتوا است ، بنابراین در پاسخ به این سوال که یک ترکیب شامل چه مواردی است می توان گفت یک ترکیب شامل قسمتی از محتواست. اما چه قسمت و حجمی از محتوا می توانند یک ترکیب کامل را بوجود آورند ؟ هدف از بوجود آوردن یک ترکیب کامل چیست ؟ فلسفه وجودی برچسب article در پاسخ به همین سوال آخر است !
ما یک ترکیب کامل ایجاد می کنیم تا به یک ماهیت یکتا برسیم. ارائه مثالهایی می تواند موضوع را بازتر کند. موارد زیر را در نظر بگیرد ، هر کدام یقیناً ماهیتی یکتا در یک وب سایت دارند . یک پست در انجمن ، یک پست در وبلاگ ، یک خبر در سایت های خبری ، یک مقاله در مجلات آنلاین ، یک نظر ارسال شده توسط کاربر در یک وب سایت و حتی یک ویدئو همراه با متن نوشتاری آن ! هر یک از موارد مطرح شده ماهیتی مستقل در یک وب سایت دارند.
خبر “موفقیت چشمگیر نهمین نسخه اینترنت اکسپلورر” ماهیت متفاوتی با خبر “مشکل آنتن دهی آیفون” در یک وب سایت دارد. چگونه تشخیص می دهید که این دو خبر با یکدیگر متفاوت هستند ؟ مسلما بدلیل اینکه تیتر آنها متفاوت است ، ممکن است نویسنده یا خبرنگار آنها متفاوت باشند ، تاریخ انتشار آنها متفاوت است و بالطبع متن خبر آنها متفاوت است . بسیار خب ! مگر غیر از این است که اگر بخواهیم همین اخبار را به زبان HTML بنویسیم با چیزی غیر از چندین Tag و مقداری متن روبرو خواهیم شد ؟
پس الان باید بتوانیم براحتی به این سوال که چه قسمت و حجمی از محتوا می توانند یک ترکیب کامل را بوجود آورند ، پاسخ دهیم . ترکیبی از Tag های HTML و متونی که یک ماهیت یکتا مانند یک خبر یا یک پست وبلاگ را ایجاد کنند یک ترکیب کامل است.
همانگونه که در تعریف اولیه شاهد بودیم بر مستقل بودن یک المان article از سایر قسمت ها تاکید شده بود ، استقلال منطقی یک قسمت از سایر قسمت ها در نتیجه بوجود آوردن یک ترکیب کامل و باطبع منحصر بفرد و یکتا کاملا امکان پذیر است.
اگر همچنان ابهاماتی در مورد کاربرد این برچسب و یا چگونگی پیاده سازی آن دارید با قسمت های آینده این مقاله همراه باشید .
لینکهای مرتبط با مقاله :
لینک قسمت اول مقاله
مقاله پیش رو دومین مقاله از مجموعه مقالات مرتبط با معرفی برچسب article است . برای مشاهده قسمت اول مقاله این لینک را دنبال کنید. اگر اولین مقاله از این مجموعه را دنبال کرده باشید ، شاید همچنان ابهاماتی در زمینه چگونگی بکار بردن این برچسب داشته باشید . در آغاز این مقاله سعی می کنیم یکی از بهترین تست ها را برای تشخیص چگونگی بکار بردن این برچسب ارائه نماییم .
تست RSS !
اگر اطلاعی در مورد RSS ندارید به این لینک مراجعه کنید. تست RSS یکی از بهترین راه ها برای پی بردن به اهمیت محتوای سایت جهت استفاده و یا عدم استفاده از برچسب article حول یک محتوا است. اما شیوه انجام تست RSS بدین گونه است که وقتی تصمیم می گیرید حول یک مطلب از برچسب article استفاده کنید ارزش آن قسمت را از لحاظ قرارگیری در یک لیست RSS می سنجید. بگذارید موضوع را با چند مثال کاملا روشن کنیم. همانگونه که در قسمت اول مقاله اشاره شد یک پست در یک انجمن ، یک پست در وبلاگ ، یک خبر در سایت های خبری ، یک مقاله در مجلات آنلاین ، یک نظر ارسال شده توسط کاربر در یک وب سایت و مطالبی از این دست ماهیتی یکتا دارند . به واسطه همین ماهیت یکتا نیز می توانند در یک لیست RSS قرارگیرند. به عنوان مثال لیست RSS ای از جدیدترین اخبار یک سایت ، لیست جدیدترین مقالات یک وبلاگ و یا لیست آخرین نظرات . همانگونه که مشاهده می کنید تمامی لیست های فوق ارزش ایجاد یک لیست RSS را دارند ، پس گزینه های مناسبی برای محصور شدن با برچسب article نیز هستند .
توزیع پذیر بودن
در قسمت اول این مقاله به توانایی توزیع مستقل محتواهایی که با برچسب article مشخص می شوند ، اشاره شد. در این قسمت قصد داریم تا منظور خود را از توزیع پذیر بودن شفاف تر نماییم . به ساختار لینک های فرضی زیر توجه کنید :
http://fa.aradhaghi.com/html5-part1/#comment-349
http://fa.aradhaghi.com/article?3456
لینک فرضی اول به یک کامنت با کد ۳۴۹ اشاره می کند . در واقع من قابلیت توزیع یک کامنت را از طریق یک لینک دارم. چرا ؟ همانگونه که قبلا توضیح داده شده یک کامنت در یک سایت ماهیت مستقلی را دنبال می کند. پس هر چیزی که ماهیت مستقلی دارد ، آدرس (URL) مستقلی نیز باید داشته باشد و در نتیجه داشتن آدرس مستقل می توان براحتی آن را توزیع کرد و یا به کلام دیگر مستقیما به آن عطف داد .
برخورداری از Header و Footer
غالبا و نه همیشه {!} ، قسمت هایی که توسط برچسب article محصور می شوند دارای Header و Footer هستند. برای روشن تر شدن مفهوم به ارائه یک مثال اکتفا می کنیم. یک پست در وبلاگ را در نظر بگیرد . طبق اصول و مواردی که ذکر شد یک پست در یک وبلاگ گزینه خوبی برای برچسب شدن با برچسب article است. یک پست در یک وبلاگ همیشه و اصولا شامل یک عنوان ، نام نویسنده ، تاریخ انتشار ، تعداد نظرات ارائه شده برای مطلب و … است که همه آنها به عنوان Header (سرآغاز) مطلب در نظر گرفته می شوند. همچنین در پایان یک پست در وبلاگ ممکن است کادری برای ارائه اطلاعات در مورد نویسنده و سابقه شخصی وی قرار داشته باشد که می توان آن را به عنوان Footer برای یک مطلب در پست در نظر گرفت . همین مثال را می توانید براحتی به یک پست در انجمن ، یک خبر در یک سایت خبری و … گسترش دهید . غالبا و نه همیشه مطالبی از این دست دارای Header و Footer هستند.
صفحات ایستا
باتوجه به موارد مطرح شده ، صفحه ای ایستا مانند صفحه درباره ما و یا صفحه تماس با ما در یک وب سایت ، ضمن اینکه یک ترکیب کامل است ، موجودیتی کاملا مستقل به شمار می آید و تزیع پذیر نیز هست . بنابراین به یاد داشته باشید که کلیه صفحات ایستا در یک سایت می توانند توسط برچسب article پوشش داده شوند.
و در پایان ، می توانید از برچسب <section> برای تقسیم کردن یک article به چندین گروه منطقی یا عنوان استفاده نمایید. در سومین قسمت از این مقاله کاربرد برچسب <section> را بیشتر توضیح خواهیم داد و بحث را تا پایان مقاله دنبال و نسبت به جمع بندی مطالب ارائه شده اقدام خواهیم کرد.
سلام آراد جان عیدت مبارک
ممنونم بابت مقاله ی خوب و طبق معمول به روزت
بدون شک HTML5، CSS3 و JQUERY در آینده وب کولاک خواهد کرد و شاهد هستیم که Browser های جدید مانور زیادی روی HTML5، CSS3 دادن خصوصاً سوگلی جدید ماکروسافت IE9 با اون موتور قوی GPU-accelerated HTML5 کار جالبی روی نمایش HTML5 کرده، ممنون میشم در خلال مقالات یه نیم نگاهی روی HTML5 Video و اینکه چقدر دستمون باز هست که رو Extensions های مختلف Video کار کنیم بنویسی و اینکه در Web Design مبحث Culture Web site طراحی چند زبانه وب سایت کدم یک از المان های جدید HTML5 رو معرفی می کنی تا کیفیت طراحیمون رو بالاتر ببریم و یه کمکی حجم CSS نویسی و در خلال اون Performance سایت بالاتر بره؟
یه لینک نسبتاً خوب
http://www.w3schools.com/html5/html5_reference.asp
پیروز و سلامت باشی
احمدرضا جان من هم سال نو رو بهت تبریک میگم و امیدوارم که مثل همیشه موفق باشی و سال خیلی خوبی رو برات آرزو دارم.
مقالات زیادی در مورد HTML5 حاضر کردم که ایشالله به مرور در وبلاگ قرار خواهم داد . در مورد مطالبی که بهشون اشاره کردی هم حتما . ضمنا خیلی خوشحال میشم و جای افتخار داره که تو از خوانندگان این وبلاگ هستی .
موفق باشی