در جلسه 10م آموزش دوره html و css به معرفی و آموزش فراخوانی آیکن و موضوع صفحه در عنوان خواهیم پرداخت. HTML Favicon و html title دو تگ مهم هستند که آن ها از نگاه کاربر و موتورهای جستجوگر گوگل بسیار پر اهمیت است. در ادامه با آموزش HTML Favicon و html title همراه ما باشید.

فیلم آموزشی HTML Favicon و html title


برای مشاهده فیلم، از فیلترشکن استفاده کنید.

HTML Favicon و html title

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

HTML Favicon و html title

1) HTML Favicon

برای فراخوانی آیکن در عنوان صفحه از تگ <link> استفاده کنید و سپس در مرحله بعد ایکن خود را توسط href فراخوانی کنید. به مثال زیر توجه کنید.

  <“#” link rel=”icon” type=”image/x-icon” href=””>

با استفاده از <link> رابطه بین سند html خود و یک منبع خارج از سند را می توانید مشخص کنید. در قسمت دوم با مشخص نمودن type به سند خود کمک می کنید تا متوجه استفاده از تصویر یا ایکن شود.

فرمت ایکن در Favicon

برخلاف گذشته، با پیشرفت در حوزه وب، اکثر فونت ها قابل اجرا و فراخوانی در قسمت Favicon است. شما می توانید از انواع فرمت PNG، GIF، JPEG، SVG استفاده کنید.

فرمت ایکن در Favicon

2) HTML Page Title

برای ایجاد عنوان (title) در قسمت header سایت از تگ زوج <title> استفاده کنید. سپس عنوان خود را مابین این تگ قرار دهید. به مثال زیر توجه کنید.
  <title>پاراکس نت</title>
عنوانی که در صفحه خود قرار می دهید بسیار حائز اهمیت است و باید با مطالب صفحه کاملا مرتبط باشد. در انتخاب نام عنوان خود بسیار دقت کنید زیرا موتور های جستجوگر گول ( search engine optimization (SEO) ) به آن بسیار دقت می کند و طبق عنوان شما، سایتتان را در دسته بندی سرچ قرار می دهد. گوگل با دسته بندی عنوان صفحات، تصمیم می گیرد که کدام عنوان را به سرچ کاربران در گوگل نمایش دهد.

شما با استفاده از title :

1- عنوان خود را در قسمت نواربالای مرورگر نمایش می دهید
2- با انتخاب نام مناسب می توانید در لیست پرسرچ ها در گوگل قرار بگیرید

مشاهده دوره آموزش مقدماتی رایگان html و css

مرجع آموزش w3chools

دیدگاهتان را بنویسید