نقل قول و کامنت در صفحات html

نقل‌قول که روایتی از سایر منابع است، با تگ خاصی در html نشان داده می‌شود. کامنت‌ها هم برای توضیحات در فایل html می‌شوند که در اینجا توضیح داده می‌شود.

تاکنون در خصوص تگ‌های مختلف در صفحات html، توضیحات لازم را داده‌ایم. در این مقاله می‌خواهیم در خصوص تگ‌های نقل‌قول و ایجاد کامنت در فایل‌های html توضیحاتی ارائه کنیم و نحوه استفاده از آنها را نیز به همراهان نیوسان‌وب آموزش دهیم.

تگ نقل قول در html

برای نقل قول در html از تگ‌های<blockquote>و<q>استفاده می‌شود. در واقع <blockquote> قسمت، بخش یا پاراگرافی از یک منبع دیگر را در سایت شما روایت می‌کند. از تگ <q> هم برای نقل قول کوتاه (مثلا یک جمله) در صفحات html استفاده می‌شود.

توجه: اگر از <blockquote> برای نقل قول استفاده شود، مرورگرها در حالت عادی، آن را با اندکی تو رفتگی نسبت به محل معمول متن‌های رایج نشان می‌دهند و چنانچه از q استفاده گردد، جمله داخل آن در داخل دابل کوتیشن قرار می‌گیرد.

نکته: تگ‌های blockquote به صورت block-level و تگ q به شکل inline-level است.

اگر بخواهید اهمیت استفاده از تگ نقل قول را بدانید، باید گفت که گاهی هیچ چاره‌ای جز آوردن مطالب از منابع دیگر نیست. مثلا فرض کنید بخواهید حدیثی را که در سایت دیگری بوده، در سایت خودتان نیز بیاورید؛ خب در این حالت از نقل قول استفاده می‌شود. در واقع این تگ از این جهت مهم است که به دلیل اینکه گوگل محتوای کپی یا تکراری را نامناسب می‌داند و برای آن امتیاز منفی در نظر می‌گیرد و فکر می‌کند که شما به این روش قصد دارید تقلب کنید و با استفاده از مطالب دیگران خودتان را بالا بکشید. در این حالت اگر تگ نقل قول را به کار ببرید با آن برخورد مسالمت آمیزی انجام می‌دهد و متوجه می‌شود که آن متن متعلق به سایت دیگری است. در این صورت گرچه برای آن ارزش بالایی برای جذب مخاطب قائل نمی‌شود؛ اما خطر امتیاز منفی گرفتن را نیز از بین می‌برد.

مثال‌های زیر را ببینید که چگونه از تگ نقل قول استفاده شده است. به خروجی آن در روی مرورگر و تورفتگی یا دابل کوتیشن متن نقل قول شده هم دقت کنید.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Newsunweb.com</title>
</head>
<body>
    <div>
        <p>
           Lorem ipsum dolor sit amet consectetur adipisicing elit. Quasi quam obcaecati, veniam totam, doloremque esse excepturi fugit labore delectus distinctio illo maxime deleniti quibusdam reprehenderit nisi repellat itaque, eligendi ex!
        </p>
        <blockquote>
           Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus soluta amet non repellat repellendus. Consectetur blanditiis beatae deserunt dicta vel incidunt accusantium! Reprehenderit minus laudantium quibusdam unde, obcaecati repellendus debitis?
        </blockquote>
        <p>
            Lorem ipsum dolor sit amet consectetur adipisicing elit. <q>Officia ipsum modi enim consequatur</q> molestiae, maiores unde aperiam, architecto dolores deleniti repudiandae laudantium suscipit! Deleniti culpa explicabo corrupti tenetur illum molestias.
        </p>
    </div>
</body>
</html>

اگر به کدهای بالا نگاهی بیندازید متوجه می‌شوید که متوجه منظور ما خواهید شد. البته یک نمونه از کاربرد این تگ‌ها و نتیجه آن را به صورت آنلاین هم می‌توانید از این لینک ببینید.

نقل قول ممکن است یک attribute به نام cite هم داشته باشد که در آن مثلا آدرسی که متن شما از آن آدرس برگرفته شده است را ذکر کنید:

<body>
    <blockquote cite="http://referenced-website.com">
        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium corporis, possimus itaque natus repellat in doloribus. Itaque maiores, veritatis, molestiae totam impedit, quidem sint laudantium fugit voluptatibus ab corporis porro.</p> 
    </blockquote>
</body>

کامنت گذاری در html

وقتی نوشته را به شکل کامنت در html تایپ کنیم، آن قسمت توسط مرورگر نادیده گرفته می‌شود و روی مرورگر به نمایش در نمی‌آید. در واقع از کامنت برای توضیحات (که ممکن است بعدا به درد بخورد) یا حتی جهت ایجاد حالتی برای نادیده گرفتن بخشی از کدهای نوشته شده مثلا برای مدت زمان موقت، در html استفاده می‌شود. اما کامنت گذاری در html چگونه انجام می‌شود؟

برای ایجاد کامنت د ر html، از دستور زیر می‌توانید استفاده کنید.

<!-- Type comments here -->

در دستور نوشته شده بالا، کافی است به جای جمله نوشته شده، هر چیزی که لازم می‌دانید را تایپ کنید. در واقع متن، تگ یا هر چیزی که در بین تگ ابتدایی و انتهایی قرار گیرد به شکل کامنت خواهد بود که ممکن است شامل چندین خط هم باشد.

به ابتدای این تگ دقت کنید که شامل یک علامت (!) در ابتدای خود است اما در انتها از آن خبری نیست.

مثال زیر هم حالتی است که برای مثال بخواهید یک تگ را برای مدتی موقت مخفی کنید (منظور اینکه مرورگر را وادار به عدم نمایش آن کنید).

<body>
<!--
<p>This is my paragraph</p>
<img src="pic.jpg" alt="my image">
-->
<div>
 Lorem....
</div>
</body>

برای خطایابی کدهای html خود هم می‌توانید از کامنت‌ها بهره بگیرید. برای مثال اگر خطایی وجود دارد، ممکن است بخش‌هایی از آن را کامنت کنید تا به بررسی دقیق و رفع خطاهای موجود بپردازید.

سخن پایانی

در این مقاله در خصوص نقل قول و کامنت که از اهمیت زیادی در طراحی سایت و صفحات html برخوردارند نکات لازم را ذکر کردیم و هر یک را با مثال‌هایی جهت تفهیم بیشتر ارائه کردیم. در بخش پایانی اگر کوتاه بخواهیم سخن بگوییم باید گفت که از تگ‌های <blockquote> و <q> برای نقل قول استفاده می‌شود که هر یک در مرورگر به شکل خاصی که در بالا گفتیم، ظاهر می‌شوند و کامنت ها هم با استفاده از <!-- ...> ایجاد می‌شوند که ممکن است برای توضیحات در صفحه، مخفی سازی تگ یا متن و یا حتی خطایابی استفاده شوند. در اینجا به پایان این مقاله رسیدیم اما تگ‌های دیگری نیز وجود دارند که در ادامه آموزش‌های نیوسان وب آنها را هم ذکر خواهیم کرد.

لینک این مقاله را در شبکه‌های اجتماعی به اشتراک بگذارید.