یکی از برچسب هایی که شما در اوایل آموزش طراحی وب خود خواهید آموختید، یک تگ دو تگ است که به عنوان برچسب های تگ شناخته می شود. بیایید نگاهی به این برچسب ها و چگونگی استفاده از آنها در طراحی وب امروز داشته باشیم.
بازگشت به XHTML
اگر HTML سال قبل، خیلی قبل از ظهور HTML5 یاد گرفتید، احتمالا از برچسب های bold و italic استفاده می کنید. همانطور که انتظار می رفت، این برچسب ها عناصر را به متن های پررنگ یا متن کلاسیک تبدیل کردند. مشکل این برچسب ها و به همین دلیل آنها را به نفع عناصر جدید (که ما به زودی نگاه می کنیم) کنار گذاشته ایم، این است که آنها عناصر معنایی نیستند. این به این دلیل است که آنها چگونه متن را به جای اطلاعات در مورد متن نگاه می کنند. به یاد داشته باشید، HTML (که در آن این برچسب ها نوشته می شود) همه چیز در مورد ساختار است نه سبک بصری! تصاویری با CSS و طراحی وب طراحی شده اند. بهترین شیوه ها در نظر گرفته شده است که شما باید جداگانه ای از سبک و ساختار در صفحات وب خود داشته باشید. این به این معنی نیست که از عناصر غیرمنطقی استفاده کند و جزئیات آن به جای ساختار نگاه کند. به همین دلیل برچسب های جسورانه و جادویی به طور کلی با قوی (برای bold) و تاکید (برای کج) جایگزین شده است.
& lt؛ strong & gt؛ و & lt؛ em & gt؛
عناصر قوی و تأکید اطلاعات را به متن شما اضافه می کنند، جزئیات محتوا را که باید متفاوت با آن رفتار شود و هنگامی که محتوای آن صحبت می شود، تأکید کند. شما از این عناصر تقریبا به همان شیوه ای که قبلا استفاده کرده اید، استفاده می کنید. به راحتی متن خود را با برچسبهای باز و بسته ( و برای تأکید و و برای تأکید قوی) محصور کنید و متن متنی را تأیید کنید.
شما می توانید این تگ ها را لمس کنید و مهم نیست کدام تگ خارجی است. در اینجا چند نمونه است.
این متن تاکید شده است و اکثر مرورگرها آن را به صورت کشویی نمایش می دهند. این متن به شدت تاکید شده است و اغلب مرورگرها آن را به عنوان نوع پررنگ نمایش می دهند.در هر دو نمونه از اینها، ما تصویری با HTML نداریم. بله، ظاهر پیش فرض تگ کج است و bold خواهد بود، اما این ظاهر می تواند به آسانی در CSS تغییر کند. این بهترین از هر دو جهان است. شما می توانید سبک های پیش فرض مرورگر را برای گرفتن متن کدر و یا bold در سند خود بدون استفاده از خط و ساختار و سبک مخلوط کنید. بگو می خواهی که متن نه فقط bold باشد، بلکه قرمز باشد، شما می توانید این را به CSS اضافه کنید
قوی {
رنگ: قرمز؛
}
در این مثال، شما لازم نیست یک ملک را برای فونت bold font بسوزانید چون از آن پیش فرض است. اگر نمیخواهید این را به شانس بسپارید، با این حال، شما همیشه میتوانید آن را اضافه کنید:
قوی {
font-weight: bold؛
رنگ: قرمز؛
}
در حال حاضر شما می توانید همه تضمین کنید که یک صفحه با متن bold (و قرمز) در هر کجا که برچسب استفاده می شود باشد.
دو تا در تاکید
یکی از چیزهایی که من در طول سال متوجه شده ام این است که اگر سعی می کنید تا روی تأکید دو برابر شود، اتفاق می افتد. مثلا:
این متن باید هر دو متن bolded و Italicized درون آن داشته باشد.شما فکر می کنید که این خط ناحیه ای را ایجاد می کند که دارای متن و جسور است. گاهی اوقات این اتفاق می افتد، اما من بعضی از مرورگرها را دیده ام که فقط از دو سبک استثنایی برخوردارند، که نزدیکترین متن واقعی را دارند، و فقط آن را به صورت کج عنوان می کنند. این یکی از دلایلی است که من در برچسب های تاکسی دو برابر نمی شوم.
دلیل دیگری برای جلوگیری از این "دو برابر شدن" برای اهداف سبکلی است. یک شکل از تأکید اگر معمولا به اندازه کافی برای انتقال تن که می خواهید تنظیم کنید. برای اینکه آن را برجسته کنید، لازم نیست که به صورت جسور، کریزی، رنگ، بزرگنمایی و زیرنویس آن را بنویسید. این متن، همه این انواع تأکیدات را خواهد داشت. پس مراقب باشید هنگام استفاده از تگ های تاکسی یا سبک CSS برای تأکید بر استفاده از آن نباشید.
یک یادداشت در بسکتبال و Italics
یک نکته نهایی - در حالی که برچسبهای bold () و کج () دیگر توصیه نمیشوند به عنوان عناصر تکتیکی استفاده شوند، برخی از طراحان وب نیز از این تگها استفاده میکنند تا سبکهای درون خطی متن را سبک کنند. اساسا، آنها از یک عنصر استفاده می کنند. این خوب است زیرا برچسب ها بسیار کوتاه هستند، اما استفاده از این عناصر به این شیوه به طور کلی توصیه نمی شود. من در مورد در مورد شما آن را ببینید وجود دارد در برخی از سایت های مورد استفاده قرار گیرد به ایجاد متن های زرد و یا کلاسیک نیست، اما برای ایجاد یک قلاب CSS برای نوع دیگری از ظاهر بصری است.
مقاله اصلی جنیفر کریینین. ویرایش شده توسط Jeremy Girard در 12/2/16.