معرفی مهم ترین تگ های HTML برای طراحی های مختلف در وردپرس
- آموزش • آموزش وردپرس
- ۶ آبان ۱۴۰۲
- 2,466 بازدید
تگ های HTML یکی از مهم ترین پایه های طراحی وبسایته ! فرض کنید که میخواهید ساختمانی را بسازید . حال با وجود این سناریو ، شما باید دنبال پایه ، بیس و زیرساختی برای اون ساختمان باشید . در واقع در زمینه طراحی وبسایت ، کدهای اچ تی ام ال حکم زیرساخت و پایه سازه رو دارند . بنابراین باید بگم که این زبان نشانه گذاری ، یکی از مهم ترین زیرساخت های طراحی سایته !
ممکنه برخی از وبمسترهایی که با وردپرس ، طراحی سایت انجام می دهند به اچ تی ام ال به دلایل زیادی آشنایی نداشته باشند . توی این مقاله ما میخواهیم راجب html صحبت کنیم و بگیم که چطوری باید مهم ترین تگ های این زبانه نشانه گذاری رو تشخیص بدید یا اینکه کدوم تگ ها در وردپرس ، اهمیت بالایی دارند . در نتیجه برای کسب اطلاعات بیشتر ، پیشنهاد میکنم که وبیت رو تا انتهای این مقاله همراهی کنید و اگر سوال یا ابهامی داشتید از قسمت نظرات کاربران با ما به اشتراک بگذارید .
آنچه در این پست میخوانید
مهم ترین تگ های html در طراحی سایت با وردپرس
تگ <div> :
یکی از مهم ترین و کاربردی ترین تگ های HTML همین تگ دایو ، دیو ، یا دی آی وی است. به وسلیه این تگ می توانیم صفحه ی سایتمان را قسمت بندی کنیم و در هر کدام از این قسمت ها ، محتوایی را که دوست داریم قرار بدهیم. این تگ به دو صورت خوانده میشود.
تگ div
باید بدونید که تگ <div> از نوع block است . در نتیچه اگر بخواهید دوتا تگ دایو را در کنار یکدیگر قرار دهید ، باید آنها را به حالت اینلاین در بیاورید و سپس مجددا تلاش کنید . به طور کلی هر وقت از آن استفاده کنیم کل عرض مرورگر را میگیرد . به عبارتی اگر شما سه تگ <div> را پشت سر هم بنویسید ، محتوایشان زیر هم نمایش داده میشود نه کنار هم. راجب مفهوم inline و block بعدا با هم صحبت خواهیم کرد. تگ دی آی وی یک تگ بسته است.
تگ های عنوان :
<h1/> این یک عنوان با اندازه بزرگ در وبیت است<h1>
<h2/> این یک عنوان با اندازه نسبتا بزرگ در وبیت است<h2>
<h3/> این یک عنوان با اندازه متوسط در وبیت است<h3>
<h4/> این یک عنوان با اندازه نسبتا متوسط در وبیت است <h4>
<h5/> این یک عنوان با اندازه کوچک در وبیت است<h5>
<h6/> این یک عنوان با اندازه نسبتا کوچک در وبیت است<h6>
تگ های هدینگ در تگ های HTML
همانطور که میتونید حدس بزنید ، از این تگها برای عنوان ها استفاده میشود. اهمیت عنوان ها از h1 تا h6 به ترتیب کاهش می یابد. این موضوع درباره سئو هم صدق می کند و تگ h1 نسبت به h2 اهمیت بیشتری دارد. تگ h2 نسب به h3 و… به همین ترتیب. تگ های عنوان یا همان heading ها مانند تگ div از نوع بلاک هستند. یعنی به صورت زیر همدیگر قرار میگیرند. تگ های heading از نوع تگ های بسته هستند.
تگ <p> :
بلاخره اگر معرفی تگها نوبتی هم باشه ، الان نوبت تگ p هست . تگ پی رو ممکنه خیلی ببینیم و خیلی جاها به آن بر بخوریم . با استفاده از این تگ می توانیم پاراگراف هایی را از متن ها به سایتمان اضافه کنیم. بخش عمده ای از هر پست سایت از پاراگراف ها تشکیل شده است. اگر با مرورگرتان از همین متن inspect بگیرید ، به این موضوع پی خواهید برد. از طرفی دقت کنید که تگ p از نوع block است.
تگ <img> در تگ های HTML :
با استفاده از تگ img می توانیم در سایتمان از تصاویر استفاده کنیم. این تگ چند اتربیوت(ویژگی) مهم دارد که آن ها را به شما معرفی میکنم.
- src : در این اتربیوت آدرس عکسمان قرار می گیرد.
- alt : این اتربیوت یک متن جایگزین برای عکسمان در نظر میگیرد تا اگر عکسمان به هر دلیلی لود نشد ، آن متن نمایش داده شود.
- title : این اتربیوت عنوان عکس را نمایش میدهد. به عبارتی وقتی موس را روی عکس ببرید title نمایش داده میشود.
- width : عرض تصویر را مشخص میکند.
- height : ارتفاع تصویر را مشخص میکند.