تغییر مسیر در HTML
دسته بندی : آموزش HTML سطح مقاله : متوسط زمان مطالعه : 3 دقیقه آخرین بروز رسانی: 28 آبان 1399تغییر مسیر در HTML بازدید کننده وب سایت را به طور خودکار به سایت دیگری می‌برد. در این مقاله با جزئیات این دستور آشنا می‌شویم.
تغییر مسیر HTML چیست؟
تغییر مسیر هنگامی که کاربر URL را وارد می‌کند اتفاق می‌افتد ، اما تغییر می‌کند و مرورگر آن‌ها را به آدرس دیگری می‌برد. سازندگان وب سایت در صورت نیاز به تغییر ساختار سایت خود یا مکان یک صفحه خاص، به آن‌ها اعتماد می‌کنند. البته، شما ممکن است به یک وب سایت کاملا متفاوت نیز هدایت شوید.
هنگام کار با پروتکل انتقال متن (HTTP)، باید درک کاملی از کدهای پاسخ آن داشته باشید. آن‌ها حاوی سه رقم هستند که مولفه اول آن‌ها نوع آن‌ها را مشخص می‌کند:
| نوع پاسخ | کد پاسخ |
| پاسخ اطلاعاتی (به عنوان مثال پردازش) | 1xx |
| (A successful response (e.g. OK | 2xx |
| پاسخ تغییر مسیر (به عنوان مثال به طور دائمی منتقل شده است) | 3xx |
| پاسخ خطای سمت مشتری (به عنوان مثال یافت نشد) | 4xx |
| پاسخ خطای سمت سرور (به عنوان مثال Bad Gateway) | 5xx |
بگذارید بگوییم شما وب سایت قدیمی خود را بستید و یک وب سایت جدید باز کردید. اگر کاربری یک URL از آدرس قدیمی را در مرورگر خود تایپ کند، کد ریسپانسیو 404 (یافت نشد) را برمی‌گرداند. با این حال، اگر از تغییر مسیر HTML استفاده کنید، کاربر خطای 301 (به طور دائم منتقل شده) یا 302 (یافت) را دریافت می‌کند. این کد برای کاربر نامرئی است، اما مرورگر آن را درک می‌کند و کاربر را به آدرس جدید هدایت می‌کند.
دو روش اصلی برای تغییر مسیر صفحات وب در HTML
1. تگ <meta>:
از تگ <meta> با رکن http-equiv و مقدار "refresh" برای ریدایرکت صفحات استفاده می‌شود. به این صورت، مرورگر کاربر را به طور خودکار پس از زمان مشخص شده به صفحه دیگری هدایت می‌کند. به عنوان مثال:
HTML
<!DOCTYPE html>
<html>
<head>
<title>تغییر مسیر</title>
<meta http-equiv="refresh" content="5; url=https://www.example.com/new-page.html">
</head>
<body>
<h1>در حال تغییر مسیر...</h1>
</body>
</html>
در این مثال، کاربر پس از 5 ثانیه به طور خودکار به صفحه “https://www.example.com/new-page.html” هدایت می‌شود.
2. تگ <a>:
از تگ <a> با رکن href برای ایجاد پیوند به صفحات دیگر استفاده می‌شود. به این صورت، کاربر با کلیک بر روی پیوند به صفحه دیگری هدایت می‌شود. به عنوان مثال:
HTML
<!DOCTYPE html>
<html>
<head>
<title>تغییر مسیر</title>
</head>
<body>
<h1>به صفحه جدید بروید</h1>
<a href="https://www.example.com/new-page.html">اینجا کلیک کنید</a>
</body>
</html>
در این مثال، کاربر با کلیک بر روی لینک “اینجا کلیک کنید” به صفحه “https://www.example.com/new-page.html”هدایت می‌شود.
نکات:
- می‌توانید از رکن
targetدر تگ<a>برای تعیین اینکه صفحه جدید در کدام تب یا پنجره باز شود استفاده کنید. - می‌توانید از جاوا اسکریپت برای تغییر مسیر صفحات به صورت پویا استفاده کنید.
- هنگام استفاده از ریدایرکت، مهم است که از کدهای وضعیت HTTP مناسب استفاده کنید تا موتورهای جستجو به درستی صفحات شما را ایندکس کنند.
بررسی کد تغییر مسیر در HTML
تغییر مسیر HTML به عنوان تغییر مسیر meta refresh یا meta redirect نیز شناخته می‌شود. به شما این امکان را می‌دهد که انتخاب کنید آیا به هدایت فوری یا تأخیر نیاز دارید. اگر زمان تأخیر را در چند ثانیه تعیین کنید ، کاربر صفحه قدیمی را دقیقاً به مدت طولانی می‌بیند.
برای اینکه یک صفحه در HTML به صفحه دیگری هدایت شود ، باید این نحو را دنبال کنید:
<meta http-equiv="refresh" content="time; URL=new_url" />همانطور که مشاهده می‌کنید ، به دو پارامتر نیاز دارد:
- time نشان دهنده تأخیر قبل از اینکه مرورگر کاربر را به صفحه دیگری هدایت کند. در چند ثانیه آن را تعریف کنید یا اگر به یک تغییر مسیر فوری HTML نیاز دارید ، 0 را وارد کنید.
- new_url نشانی اینترنتی است که پس از تأخیر باید کاربر خود را به آن هدایت کنید.
در مثال زیر ، می‌توانید کد هدایت HTML را مشاهده کنید که کاربر را با پنج ثانیه تأخیر به وب سایت BitDegree می برد:
<meta http-equiv="refresh" content="5; URL=https://www.bitdegree.org/" />درست مانند همه تگ‌های متا ، کد هدایت HTML نیز باید در بخش <head> سند قرار گیرد. به این ترتیب ، مرورگر دستورالعمل‌های خاصی را دریافت می‌کند که برای کاربر نامرئی می‌ماند.
چرا باید تغییر مسیر در HTML را به تأخیر انداخت؟
اگر مطمئن نیستید که چرا باید هدایت متای HTML خود را به تأخیر بیندازید، به فرصتی برای تنظیم پیام برای کاربر فکر کنید. می‌توانید به آن ها اطلاع دهید صفحه منتقل شده است و سپس بلافاصله آن ها را به صفحه جدید ارسال کنید.
دلیل مهم دیگر ، احتمال اندک اجرایی نشدن تگ است. اگر کاربر از مرورگر قدیمی استفاده کند ، این اتفاق می‌افتد. در این حالت ، شما می‌توانید یک لینک مستقیم به صفحه قدیمی اضافه کنید که در صورت خراب شدن کد تغییر مسیر HTML ، کاربر ممکن است دستی آن را کلیک کند.
<head>
<meta http-equiv="refresh" content="5; URL=https://www.bitdegree.org/" />
</head>
<body>
<p>If you are not redirected in five seconds, <a href="https://www.bitdegree.org/">click here</a>.</p>
</body>همانطور که مشاهده می کنید ، تنها چیزی که برای افزودن یک لینک قابل کلیک مستقیم نیاز دارید ، یک جفت تگ anchor است. مطمئن شوید که آن را در بخش <body> قرار دهید و نه <head> با تگ HTML meta redirect.
برای خواندن مقالات در زمینه CSS و کسب اطلاعات در این زمینه به شما پیشنهاد می‌کنیم مقالات این دسته از سایت دویکس را مطالعه کنید.
نکات مهم تغییر مسیر در HTML
- اگر آدرس URL جدیدی برای هدایت مجدد تعریف نکنید ، صفحه HTML پس از زمان مشخص شده به سادگی دوباره بارگیری می شود. وقتی نیاز به تازه کردن محتوای پویا دارید می‌تواند مفید باشد.
- ما به شما توصیه می‌کنیم از تأخیرهای کوتاهتر از 3 ثانیه خودداری کنید ، زیرا این کار باعث می‌شود کاربر نتواند روی دکمه برگشت در مرورگر خود کلیک کند.
- مراقب باشید بیش از حد از تغییر مسیرهای متا HTML استفاده نکنید، اگر وب سایت شما تعداد زیادی از آن‌ها را دارد، موتورهای جستجو ممکن است فکر کنند که این نامه حاوی هرزنامه است و آن را از فهرست خود حذف می کند.
- همچنین می‌توانید با PHP ، JavaScript ، Ruby on Rails و Python Flask و همچنین در وب سرورهای Apache ، Nginx و Lighttpd تغییر مسیر دهید.
این مقاله چقدر براتون مفید بود؟