Target=”_blank”  دست کم گرفته شده ترین آسیب پذیری زمان ماست. مبانی HTML: کار با لینک ها. برچسب A و ویژگی های rel، target، name آن چگونه یک تصویر را به یک پیوند تبدیل کنیم - دو روش

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

اما برای ایجاد صحیح هایپرلینک ها و درج آنها در کد صفحات وب (به عنوان مثال، سایت شما)، باید ناحیه مربوط به زبان نشانه گذاری فرامتن () را مطالعه کنید، زیرا این عناصر با استفاده از تگ HTML a تشکیل می شوند که به شما امکان می دهد پیوند را به ظاهر دلخواه ارتقا دهید.

بنابراین، امروز ما تجزیه و تحلیل خواهیم کرد که یک هایپرلینک از چه بخش هایی تشکیل شده است، چگونه استفاده از ویژگی خالی هدف امکان باز کردن صفحه را در یک پنجره جدید (برگه)، نحوه تبدیل هر تصویر به یک پیوند و بسیاری جزئیات مهم دیگر را ممکن می سازد. از جمله اینکه این اطلاعات شما را در یادگیری زبان HTML پیش می برد.

هایپرلینک چیست و آیا می توان آن را لینک نامید؟

در پاسخ به سوال مطرح شده در عنوان، می گویم که اصطلاح "پیوند" دارای طیف معنایی گسترده تری است (پیوند به سیبری، بانکداری برای شناسایی پرداخت کننده، متن در کتاب و غیره)، از جمله معنای ذاتی مفهوم "هایپرلینک"، که فقط با فرامتن مرتبط است، که امکان درک اطلاعات را به صورت غیر خطی ممکن می کند.

بدین ترتیب، هایپرلینک یک مورد خاص از یک پیوند است، بنابراین استفاده از آنها در مبحث امروز به صورت یکسان کاملاً ممکن است. این همان چیزی است که من در جریان انتشار امروز برای منافع خودخواهانه خود استفاده خواهم کرد و از هر دوی این اصطلاحات برای جلوگیری از هرزنامه های غیر ضروری کلمه کلیدی استفاده خواهم کرد.

اما سرویس های نامرئی نیز وجود دارند که با کمک ایجاد شده اند و کسانی که در داخل هستند، وظیفه آنها ارسال سیگنال ها و دستورات متعدد به مرورگرها برای انجام یک عملکرد خاص است.

به عنوان مثال، با کمک هایپرلینک های سرویس می توان یک نماد را نمایش داد. آنها فقط می توانند به عنوان بخشی از کد HTML دیده شوند (برای انجام این کار، روی هر صفحه باز شده در مرورگر کلیک کنید):

فعلاً بیایید پیوندهای سرویس را به حال خود رها کنیم و الگوی کلی ایجاد هایپرلینک را در نظر بگیریم. وجه مشترک آنها این است که همه آنها دارند ویژگی href مورد نیاز، که مقدار آن آدرس سند (). یک پیوند HTML می تواند هم به یک صفحه داخلی سایت و هم به یک سند خارجی منجر شود.

یک نکته مهم دیگر استفاده از ویژگی href باعث می شود که لینک ها قابل کلیک باشند، یعنی به کاربران اجازه می دهد تا در نتیجه کلیک بر روی آنها به طور خودکار به صفحه مربوطه وب سایت بروند.

نحوه ساخت هایپرلینک در HTML با استفاده از href

بنابراین، ما از قبل می دانیم که برای ایجاد یک پیوند، به تگ a و ویژگی href نیاز است که پارامترهای آن می تواند URL های مختلفی باشد. از آنجا که آاین، سپس بین باز و بسته شدنحاوی محتوایی است که در صفحه وب نمایش داده می شود.

این به محتوا لنگر می گویندو می تواند به صورت متن یا تصویر ارائه شود (در زیر در مورد نحوه ایجاد یک تصویر بیشتر صحبت خواهیم کرد). همانطور که قبلاً اشاره کردم، لنگر قابل کلیک خواهد بود. نمونه ای از یک هایپرلینک با محتوای متنی را در نظر بگیرید. در اینجا به شکل کدهای HTML است:

کمی در مورد لنگرها

علاوه بر HTTP می توان از پروتکل امن HTTPS نیز استفاده کرد. لازم نیست پیوند به یک صفحه وب منتهی شود. همه چیز به مقدار href بستگی دارد که می تواند مسیر برخی از فایل ها باشد:

//website/wp-content/uploads/2012/05/giperssylqi-v-html.jpg

دانلود

در یک صفحه وب، این پیوند به شکل زیر خواهد بود:

مرورگر "می فهمد" که یک شی با پسوند .zip را فقط می توان برای دانلود استفاده کرد که به کاربر پیشنهاد می کند.

به هر حال، مسیر هر فایلی گاهی اوقات از طریق FTP () مشخص می شود. سپس، در URL که به عنوان پارامتر ویژگی href استفاده می شود، باید به سادگی پروتکل HTTP (HTTPS) را با FTP جایگزین کنید. لینک فایل به شکل زیر خواهد بود:

دانلود از سرور

اما این همه ماجرا نیست. به روشی مشابه یک پیوند ایمیل با استفاده از شبه پروتکل mailto ایجاد می شودبرای دسترسی سریع به ابزار نوشتن:

نامه بنویس

پس از کلیک بر روی چنین پیوندی، پنجره ای از سرویس گیرنده ایمیل پیش فرض ظاهر می شود که در آن می توانید متن پیام را بنویسید و آن را به آدرسی که قبلاً مشخص شده است، که حدس زدید، از href ارسال کنید.

در عمل، پیوندهای پستی اغلب توسط وب مسترها و صاحبان منابع بزرگ در گذشته برای اطمینان از راحتی کاربران و مشتریانی که می‌توانند با یک کلیک به فرم ایمیل دسترسی پیدا کنند، استفاده می‌کردند.

اما این نوع ارتباط در منابع وب دیگر چندان محبوب نیست (مخصوصاً از آنجایی که می توانید مثلاً نصب کنید)، زیرا آدرس های ایمیلی که به این روش باز می شوند به طور فعال با استفاده از نرم افزار رهگیری می شوند و توسط انواع مختلف اسپمرها استفاده می شوند.

من به عنوان مثال فقط رایج ترین پروتکل هایی را که بخشی از URL هستند ذکر کرده ام که به نوبه خود پارامتری از ویژگی href در هنگام تشکیل یک هایپرلینک است. علاوه بر HTTP (HTTPS)، FTP و mailto، موارد دیگری نیز برای کارهای خاص تر وجود دارد. شاید در نشریات دیگر آنها را با جزئیات بیشتری بررسی کنیم.

انواع هایپرلینک

و اکنون بیایید سعی کنیم پیوندها را بر اساس معیارهای خاصی طبقه بندی کنیم.

با توجه به دامنه آنها:

1. خارجی- منجر به صفحات خارج از سایتی شوند که در آن قرار دارند.

2. درونی؛ داخلی- پیوند صفحات وب در همان منبع وب.

بر اساس قالب:

2. به صورت گرافیکی f - در این مورد، لنگر هایپرلینک یک تصویر (شامل یک تصویر کوچک)، یک بنر، یک دکمه و غیره است.

با توجه به نوع URL که به عنوان مقدار مشخصه href عمل می کند:

1. مطلق، که حاوی یک نشانه صریح از پروتکل انتقال داده (به عنوان مثال، HTTP) و نام دامنه سایت (در همه چیز در مورد دامنه ها) است.

چنین پیوندهایی بیشتر هنگام پیوند به صفحات منابع خارجی استفاده می شوند. در این حالت مقدار href شامل مسیر کامل فایل یا صفحه وب مورد نظر خواهد بود. در اینجا یک مثال از یک هایپرلینک مطلق آورده شده است:

زمینه - چیست

2. نسبت فامیلییکی از گزینه های ایجاد که مسیر مشخص شده نسبت به پوشه ریشه وب سایت خواهد بود (از این رو نام این نوع هایپرلینک است). در این صورت، پروتکل (HTTP) و دامنه سایت از URL حذف خواهند شد:

زمینه - چیست

پیوندهای نسبی در یک صفحه وب می توانند پیوندهایی به صفحات داخلی ارائه دهند. در این فرم آنها کوتاهتر هستند که کد HTML را آسانتر می کند. البته، همه چیز به این سادگی نیست و نیاز به پوشش گسترده تری دارد، همانطور که می توانید ببینید اگر لینک ارائه شده را دنبال کنید.

ویژگی های یک برچسب

حال بیایید ببینیم به غیر از href اجباری چه ویژگی های دیگری وجود دارد و چگونه می توانند بر ایجاد یک هایپرلینک تأثیر بگذارند. می‌توانید کامل‌ترین داده‌ها را در این زمینه، به اصطلاح، «دست اول» در وب‌سایت رسمی کنسرسیوم بین‌المللی W3C بیابید، جایی که اطلاعات به‌روز با بیشترین سرعت ظاهر می‌شوند.

آنها کاملاً یکسان هستند و باز کردن یک صفحه وب را در برگه فعلی آغاز می کنند. اگر می‌خواهید هنگام کلیک کردن روی پیوندها، صفحات در یک برگه جدید باز شوند، باید هنگام ایجاد پیوند آن را اضافه کنید. ویژگی هدف با پارامتر خالی:

زمینه - چیست

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

علاوه بر این، همانطور که می بینید، در این حالت، کاربر این مزیت را دارد که می تواند صفحه وب را نه تنها در یک تب جدید باز کند، بلکه همچنین در یک پنجره جدید(این گزینه را نمی توان با استفاده از HTML و فقط با استفاده از اسکریپت اجرا کرد).

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

بنابراین، صاحب یک منبع وب ممکن است نه تنها یک بازدیدکننده بالقوه را از دست بدهد، بلکه در عوامل رفتاری نیز بدتر شود () که منجر به از دست دادن موقعیت صفحه در رتبه بندی می شود.

علاوه بر این، باز کردن یک صفحه در یک تب مجاور از نظر قابلیت استفاده بسیار راحت است (). کاربر یک لینک به یک صفحه وب را دنبال می کند، اطلاعات اضافی را دریافت می کند و انگار هیچ اتفاقی نیفتاده است، به مطالعه مطالب اصلی ادامه می دهد.

برای ارائه یک تصویر عینی، باید اضافه کرد که اعمال "target="_blank"" برای هر پیوند خارجی مملو از خطر امنیتی است. اگر کسی علاقه مند است، می توانید بخوانید، جایی که توصیه هایی برای عیب یابی مشکلات هنگام استفاده از خالی هدف، و همچنین گزینه های جایگزین برای اجرای وظیفه باز کردن یک صفحه وب در یک برگه جدید ارائه شده است.

به نظر می رسد که تمام مزایا و معایب استفاده از مقدار خالی برای باز کردن هایپرلینک در یک تب جدید را یادداشت کرده است. اگر مقالاتی را در وبلاگ من می خوانید، احتمالاً قبلاً نگرش من را نسبت به این پارامتر ویژگی هدف حدس زده اید.

در حال حاضر، برای من، مزایای آن بیشتر از معایب است و من حامی بی قید و شرط آن هستم. با توجه به حقایق فوق می توانید نظر خود را در مورد این موضوع شکل دهید. اگرچه ... با در نظر گرفتن ظهور شرایط جدید، ممکن است تغییر کند.

چگونه لینک های هش، انکر ایجاد کنیم و چرا به آنها نیاز داریم؟

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

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

ایجاد چنین پیوندهایی بسیار ساده است. ابتدا باید ایجاد کنید لنگر، قرار دادن برچسب مناسب در محل مورد نیاز در صفحه به شکل شناسه شناسه، که یکی از ویژگی های جهانی است که برای هر تگ HTML اعمال می شود.

به دلیل جهانی بودن شناسه ها، چنین تگ های لنگر را می توان تقریباً در هر نقطه از صفحه وب قرار داد. از آنجایی که متن معمولاً به پاراگراف تقسیم می شود، می توان آنها را به . من عمدتاً لنگرها را می گذارم که مقالات را به بخش های منطقی تقسیم می کنند:

پس از علامت گذاری تمام مکان های لازم در کد HTML، ما به آنها پیوندهایی ایجاد می کنیم. برای انجام این کار، در پایان پس از آخرین اسلش "/" در URL (که همانطور که می دانید مقدار ویژگی href است)، علامت پوند "#" و نام برچسب (ID) را به ترتیب می نویسیم:

چگونه لینک های هش و انکر تولید کنیم؟

علاوه بر این، اگر چنین پیوند لنگر در همان صفحه با لنگرها قرار داده شود، می توان بخشی از URL را تا آخرین اسلش قبل از علامت هش، شامل حذف کرد و فقط "#" به اضافه نام ID را می توان به عنوان پارامتر href استفاده کرد (در واقع، این یکی از گزینه های پیوند نسبی است):

چگونه لینک های هش و انکر تولید کنیم؟

یعنی هنگام جمع آوری فهرست مطالب کتابچه راهنمای بهینه سازی کدهای HTML به راحتی می توانید از این گزینه سبک استفاده کنید. اگر فقط یک علامت پوند را به عنوان URL، بدون نام شناسه قرار دهید، سپس از جایی که چنین پیوندی در آن قرار دارد، صفحه تا انتها به سمت بالا حرکت می کند:

بالا

در واقع، این ساده ترین گزینه است، که دوباره به عنوان یک مزیت اضافی برای قابلیت استفاده از منبع عمل می کند، زیرا زندگی را برای بازدیدکنندگان آن آسان تر می کند. از یک تصویر جذاب می توان به عنوان لنگر برای ایجاد یک دکمه استفاده کرد.

نحوه حذف زیر خط و تغییر رنگ لینک

توسعه دهندگان HTML تقریباً به تمام نکات ظریفی فکر کرده اند که می تواند به بهینه سازی این یا آن جنبه کمک کند، همین امر در مورد هایپرلینک ها نیز صدق می کند. به عنوان مثال، هنگام دنبال کردن یک هایپرلینک به یک صفحه وب دیگر، و سپس بازگشت، کاربر می بیند که هایپرلینک تغییر رنگ داده است.

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

پیش فرض و بدون لینک های CSS زیر خط دار و سه گزینه رنگکه هر کدام دارای ویژگی خاص خود هستند برای:

• پیوند - رنگ هایپرلینک را در صفحه وب تعیین می کند (پیش فرض آبی است که با #0000ff نشان داده می شود).
• alink - رنگ هایپرلینک فعال برای مدت زمانی که توسط مرورگر وب پردازش می شود (قرمز #ff0000).
• vlink - رنگ پیوند بازدید شده توسط کاربر (بنفش، #800080).

بنابراین چگونه رنگ لینک های نمایش داده شده توسط مرورگرها را برای سایت خود تغییر می دهید؟ خوب، برای یک سایت ساده HTML که در آن صفحات به صورت دستی تشکیل می شوند (و من فکر می کنم عملاً هیچ منبع کاملی از این نوع در واقعیت های مدرن وجود ندارد، به جز خاطرات ساده و صفحات فرود)، فقط باید تگ افتتاحیه را پیدا کنید. و پارامترهای لازم را برای آن تنظیم کنید (به هر حال، می توانید از نام آن برای تعیین یک رنگ استفاده کنید)، به عنوان مثال:

اگر یک سیستم مدیریت محتوا () برای مدیریت منبع وب خود نصب کرده اید، بدون در نظر گرفتن نوع موتوری که استفاده می کنید، باید فایلی را که مسئول نمایش هدر (هدر) است باز کنید، جایی که یک تگ باز وجود دارد. .

اگر منبع شما وردپرس را اجرا می‌کند، برای اجرای عملی این ایده، می‌توانید از آن به عنوان ابزاری برای درج خودکار عکس در یک هایپرلینک استفاده کنید، جایی که ابتدا از کتابخانه انتخاب کنید یا تصویر مورد نظر را آپلود کنید و آن را در متن وارد کنید:

سپس کد تصویر حاصل را انتخاب کنید و دکمه "پیوند" ویرایشگر را فشار دهید، پس از آن در پنجره ای که ظاهر می شود، لینک مورد نظر کپی شده را قرار دهید:

خوشحالم که به سایت وبلاگ خوش آمد می گویم! در مقاله امروز، شروع به صحبت در مورد زبان نشانه گذاری فرامتن خواهیم کرد. html. این نشریه اولین در نوع خود خواهد بود (و به دور از آخرین)، زیرا قبلاً هرگز چنین چیزی ننوشته ام.

طرح پست:

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

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

شاید، برچسب لینک htmlآیکی از پرکاربردترین تگ های من به همراه تگ img است که برای نمایش تصاویر در متن مورد نیاز است. به طور متوسط، در هر مقاله ای که منتشر می کنم، حدود پنج لینک، هم به صفحات داخلی و هم به صفحات خارجی درج می شود.

آن را فراموش نکن برچسب های سایتhtmlنه تنها هنگام نوشتن پست استفاده می شود. همچنین، هنگام تغییر کد قالبی که در CMS وردپرس یا هر سیستم مدیریت محتوای دیگری نصب کرده‌اید، به آن‌ها نیاز خواهید داشت.

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

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

همچنین تفاوت های ظریف زیادی وجود دارد که کار شما را آسان تر می کند و در مورد آنها در مقاله من در زیر خواهید خواند - اینها هستند rel=”نوفالو”، و هدف = "_جای خالی"و بسیاری چیزهای جالب دیگر مرتبط با پیوندها.

برچسب پیوند A - یک هایپرلینک در یک سند html با و بدون لنگر ایجاد کنید

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

با این حال، برای تعیین مسیر یک هایپرلینک، باید از آن استفاده کنید صفتhref. به لطف آن، می توانید و باید URL صفحه ای را که می خواهید به آن پیوند دهید مشخص کنید. اینها می توانند هم صفحات داخلی سایت شما و هم صفحات هر منبع دیگری در شبکه جهانی وب باشند.

تگ لینک A Anchor html عامل مهمی است که ربات های جستجوگر آن را در نظر می گیرند، بنابراین باید توجه ویژه ای به آن داشته باشید. توصیه می‌کنم از کلمات کلیدی در لنگر استفاده کنید که می‌خواهید مقاله شما به اولین موقعیت‌های نتایج جستجو برسد.

پس از پرداختن اندکی به تئوری هایپرلینک ها در یک سند html، می توانیم به سراغ مثال های گویا برویم. این هم کد لینک:

در اینجا باید متن هایپرلینک شما، یعنی انکر باشد

همانطور که می بینید، پیوند با یک براکت باز شروع می شود.<», затем идет html тег A, после него должен быть обязательный атрибут href и знак равенства. Далее, следуют две скобки следующего типа – «”», между ними нужно указать URL адрес ссылающегося ресурса, при использовании «http://». Затем, нужно указать анкор ссылки и в конце концов закрыть тег ссылки А при помощи «».

همچنین به شما توصیه می‌کنم از لینک‌های بدون انکر استفاده کنید، زیرا اگر فقط لینک‌هایی با انکر به منبع شما منتهی شوند، این امر می‌تواند باعث ایجاد سوال در موتورهای جستجو و عواقب بدی شود. مطمئناً در مورد الگوریتم پر سر و صدا گوگل شنیده اید که نام ترسناک پنگوئن دارد :).

باز کردن لینک در یک پنجره جدید ویژگی target_blank

خوب، ما تگ html A را کشف کردیم، اما این همه ماجرا نیست. ویژگی های بسیار بیشتری وجود دارد که هنگام کار با پیوندها برای شما مفید خواهد بود. یکی از آنها - صفتtarget_blank.

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

هدف خالیدر html اغلب استفاده می شود زیرا از نظر رفتار بازدیدکنندگان سایت شما کمک می کند، یعنی بر عوامل رفتاری آن تأثیر می گذارد. بنابراین، اگر هنوز از ویژگی target با پارامتر _blank استفاده نمی کنید، توصیه می کنم این بخش را با دقت مطالعه کنید.

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

ویژگی rel nofollow و تگ noindex. پیوند را از نمایه سازی ببندید

بیایید کار را با ویژگی rel link در سند html شروع کنیم. این ویژگی با پارامتر nofollow باعث می شود وزن صفحه شما به هیچ صفحه دیگری منتقل نشود.

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

بنابراین، برای اینکه وزن داخلی صفحات شما از شما دور نشود، باید چند لینک را با ویژگی ضمیمه کنید. rel nofollow. لینک هایی که این ویژگی را دارند به سایر سایت ها منتقل نمی شوند.

طبیعتا، صفتrel nofollowهنگامی که به صفحات داخلی سایت خود پیوند می دهید، نباید از آن استفاده کنید، زیرا پیوند داخلی شایسته کلید بهینه سازی موفقیت آمیز منبع و توسعه بیشتر آن است.

من فقط در صورتی از ویژگی بالا استفاده می کنم که به سایت های خارجی لینک می دهم. به عنوان مثال، همانطور که ممکن است متوجه شده باشید، اغلب در پایان مقالات خود، من از پست گیرندگان دعوت می کنم تا خواننده توییتر من شوند () و پیوندی به حساب خود می دهم، البته این پیوند را در rel nofollow قرار می دهم. به نظر می رسد این است:

فالوور من شو

مجدداً، اینکه nofollow rel قبل یا بعد از ویژگی href قرار می گیرد، بی ربط است. همچنین در چنین پیوندهایی نباید کلمات کلیدی را در انکر تجویز کنید، زیرا این کار معنی ندارد، زیرا ما قبلا یک لینک درست کنیدnofollowیعنی وزن را منتقل نمی کند.

حالا برای بحث برچسب زدنnoindex. این اطمینان را ایجاد می کند که روبات های جستجوگر عناصر غیر ضروری صفحه را ایندکس نمی کنند. علاوه بر این، این نه تنها در مورد لینک ها، بلکه برای بخش های خاصی از متن نیز صدق می کند.

فالوور من شو

ضمناً وقتی به هر سایتی می روم بلافاصله می بینم که هایپرلینک کجا از ایندکس بسته شده است و برعکس کجا باز است. همه به لطف یک افزونه عالی برای مرورگر Opera. همچنین با کمک این افزونه می توانم پارامترهای دیگر منابع مانند , و AlexaRank را ردیابی کنم.

لینک لنگر و نحوه ساخت آن ویژگی نام

و اکنون من، شاید برای بسیاری، هنگام کار با پیوندها، چیز بسیار جالبی را کشف خواهم کرد. من شخصاً بعد از بیش از شش ماه استفاده از وردپرس متوجه این موضوع شدم. بنابراین، اکنون بیایید در مورد آن صحبت کنیم لنگر پیوند.

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

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

همانطور که می بینید، ویژگی name لنگر ندارد، زیرا انکر از یک تگ باز و بسته A تشکیل شده است. شما باید پارامتر ویژگی را خودتان تنظیم کنید، همانطور که در مثال بالا نشان داده شده است بعد از علامت مساوی و براکت ها نشان داده شده است.

اکنون، مستقیماً در پست جدید، باید با استفاده از یک انکر از قبل آماده شده، یک پیوند هش را مشخص کنید. بنابراین، پیوند بلافاصله مکان مورد نیاز را در متن باز می کند. این پیوند هش به شکل زیر خواهد بود:

لنگر

پس از آن، خوانندگان سایت شما قادر خواهند بود با کلیک بر روی چنین پیوندهایی، بلافاصله به بخش خاصی از صفحه برسند.

خوب، این تمام چیزی است که من دارم، اگر سوالی دارید در نظرات بپرسید. توجه داشته باشم که این آخرین مقاله در مورد html نیست، در آینده قابل پیش بینی انتشارات بیشتری در مورد این موضوع وجود خواهد داشت.

خلاصه ویدیو: هنرمند خیلی سریع تصاویر را روی شیشه می کشد

بسیاری از سایت ها تمرین باز کردن پیوندهای خارجی در یک پنجره جدید را دارند. اغلب، برای مثال، پیوندهایی به وب سایت توسعه دهنده یا نتایج موتورهای جستجو از این طریق باز می شوند. به عنوان یک قاعده، ویژگی برچسب برای این مورد استفاده می شود.< >:

به طور کلی، گفتن نحوه باز کردن لینک به کاربر زشت است. متخصصان قابلیت استفاده وب سایت به اتفاق آرا ادعا می کنند که کاربر خودش می تواند تصمیم بگیرد که چگونه پیوند را باز کند. او پنجره های خود را بدون خواسته ما در این مورد مرتب می کند. علاوه بر این، دکمه برگشت استاندارد مرورگر را نیز شکسته ایم. چنین تداخل فاحشی با عادات احتمالاً باعث بیزاری می شود!

علاوه بر این، تصور بدی ایجاد می شود: «کاربر سایت را ترک می کند! شاید هرگز برنگردد! آه-آه-آه! چه باید کرد؟ بیایید یک پیوند جدید در یک پنجره دیگر باز کنیم! شاید وقتی همه چیزهایی را که نیاز دارد ببیند، سپس این پنجره را ببندد، دوباره به ما برسد و بعد قطعاً یک بازدیدکننده دائمی شود!

امیدوارم معنی آن واضح باشد - سایت را با محتوای مفید و جالب با کیفیت بالا پر کنید و سپس بازدیدکنندگان آگاهانه و مستقل باز خواهند گشت.

با این حال، علاوه بر جنبه اخلاقی، یک جنبه فنی نیز وجود دارد - ویژگی هدف در مشخصات XHTML 1.0 Strict نیست و بر این اساس، اعتبارسنجی را پشت سر نمی گذارد!

راه حل معتبر: جاوا اسکریپت

اگر با وجود پاراگراف های قبلی، تصمیم گرفتید (یا مجبور شدید) صفحه را در یک پنجره جدید باز کنید، حداقل اجازه دهید آن را معتبر کنیم.

اینجاست که جاوا اسکریپت به کمک می آید. بیایید سعی کنیم رویداد onclick پیوند را دریافت کنیم و با استفاده از تابع ()window.open پنجره جدیدی باز شود. پس از آن، انتقال به پیوند در پنجره اصلی را با تعیین return false ممنوع خواهیم کرد:

پیوند در یک پنجره جدید باز می شود

بیایید راه حل را بررسی کنیم:

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

راه حل بهتر

مسدود کردن پاپ آپ عمدتا برای مبارزه با تبلیغات مزاحم طراحی شده است. این ویژگی در تمام مرورگرهای مدرن موجود است. حتی برخی از مرورگرها سطوح مختلفی از مسدود کردن را ارائه می دهند. به عنوان مثال، در Opera 9+ شما می توانید یا فقط پنجره های "ناخواسته" یا همه چیز را مسدود کنید.

من نمی دانم چند درصد از کاربران به شدت با پنجره های پاپ آپ دست و پنجه نرم می کنند، اما فقط با چنین تنظیماتی، به جای باز کردن یک پنجره، یک اعلان کوچک "پنجره پاپ آپ مسدود شده است" به سادگی ظاهر می شود. علاوه بر این، حتی این تظاهرات واکنش مرورگر به کلیک در تنظیمات را می توان غیرفعال کرد. در این مورد، پیوند به سادگی عملکرد خود را از دست می دهد: "من کلیک می کنم، اما هیچ اتفاقی نمی افتد!"

اگر بعد از خواندن این مطلب، کسی گفت: "شما نمی توانید همه را راضی کنید! خب دکترشون کیه که همه چی براشون خاموشه! برای بقیه، بیایید ادامه دهیم.

پیوند در یک پنجره جدید باز می شود

در اینجا ما از این واقعیت استفاده کردیم که اگر پنجره با موفقیت باز شود، تابع window.open () true و در غیر این صورت false را برمی گرداند. یعنی در صورتی که پیوند با موفقیت در یک پنجره جدید باز شد، باز شدن پیوند را در پنجره اصلی خود مسدود می کنیم، زیرا بازگشت خواهد بود!true=false. و بالعکس، اگر پنجره باز نشد، بازگشت true به لینک اجازه می دهد تا به طور عادی کار کند.

با سلام خدمت خوانندگان محترم سایت وبلاگ. امروز می خواهم با جزئیات بیشتری در مورد اینکه یک هایپرلینک در زبان Html چیست، چگونه می توانید آنها را در متن سایت قرار دهید، چگونه یک پیوند را به تصویر تبدیل کنید، نحوه استفاده از تگ "A" و ویژگی های آن "Href" و "Target blank" (در یک پنجره جدید باز کنید) صحبت کنم.

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

هایپرلینک و انکر (انکر) چیست؟

بنابراین، ما قبلاً با برچسب های منسوخ و توصیه نشده برای استفاده روزمره آشنا شده ایم. بیایید به آشنایی خود ادامه دهیم.

برای ایجاد هایپرلینک در کد Html باید از تگ A نیز استفاده کنیم که برای آن می توان از ویژگی های مختلفی استفاده کرد که برای مثال آدرس URL هدف را برای حرکت از طریق این لینک (href) تنظیم می کند یا دستور باز کردن آن در یک پنجره جدید (target = _blank) را می دهد. اما بیایید در مورد همه چیز به ترتیب صحبت کنیم.

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

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

در این صورت، آنها در صفحه قابل مشاهده نخواهند بود، زیرا در قسمت Head کد منبع سند نوشته شده است که محتویات آن در صفحه نمایش داده نمی شود (من در مقاله مربوط به ساختار کد زبان نشانه گذاری فرامتن را ذکر کردم).

پیوندهای خدماتی با استفاده از تگ "A" (مثلاً) ایجاد نمی شوند، بلکه با استفاده از تگ ایجاد می شوند ارتباط دادن. کارهای زیادی وجود دارد که آنها انجام می دهند، به عنوان مثال، با کمک آنها، فایل های خارجی با شیوه نامه های آبشاری CSS یا، برای مثال، .

اما امروز ما در نظر نخواهیم گرفت که چگونه می توان آنها را ایجاد کرد (زمان به آنها خواهد رسید) ، اما در مورد آن صحبت خواهیم کرد لینک های قابل مشاهده، که می توانند در داخل قسمت Body ایجاد شوند و بر این اساس در صفحه وب نمایش داده شوند.

اما، با این وجود، همه هایپرلینک ها (هم قابل مشاهده و هم خدمات) یک چیز مشترک دارند - همه آنها دارای یک ویژگی اجباری هستند. Href. در آن، به عنوان مقدار آن، یک مکان خاص در سند (اگر قبلاً با لنگر مشخص شده بود) یا آدرس خود سند در اینترنت (یا به عبارت دیگر مسیر صفحه یا فایل دیگری با Href نوشته می شود) نوشته می شود.

هایپرلینک ها عناصر ناوبری هستند که برای هدایت شما به اسناد دیگر در وب یا حرکت در محتوای صفحه وب که قبلاً مشاهده می کنید با استفاده از علامت هایی که قبلاً در بدنه سند ایجاد شده اند، که Html نیز نامیده می شوند، طراحی شده اند. لنگرها(لنگرها).

ممکن است در اینجا سردرگمی وجود داشته باشد، زیرا. در سئو، زیر کلمه، اما در زبان Html، انکر دقیقا به معنای لنگر (ترجمه کلمه انکر) یا برچسبی در متن است که می توان به آن اشاره کرد.

چرا از انکرها در Html استفاده می شود؟ این هنگام ایجاد ناوبری برای یک صفحه وب نسبتا طولانی بسیار مفید است. احتمالاً زمانی که در صفحه ای که باز کردید، بلافاصله در زیر عنوان آن، نام بخش های مقاله منتشر شده در این صفحه آورده شده است، در شبکه ملاقات کرده اید.

بنابراین، خواننده می تواند بلافاصله به مکانی در صفحه که اطلاعات مورد علاقه در آن قرار دارد برود و با پیمایش متن و جستجوی بصری مکان مناسب خود را خسته نکند. راحت و تقویت می کند.

چگونه انکرها و لینک های هش ایجاد می شوند

بنابراین، وظیفه ما در این مورد نصب لنگرها در مکان های مناسب در صفحه (سند) خواهد بود که در حالت کلی به شکل زیر خواهد بود:

آن ها برای ایجاد یک لنگر، باید یک ویژگی واحد "Name" را به تگ هایپرلینک خالی "A" اضافه کنید، به عنوان مقدار آن باید از یک برچسب منحصر به فرد استفاده کنید که نباید حاوی فاصله باشد و در آن می توانید از کاراکترهای لاتین، اعداد، خط تیره و زیرخط استفاده کنید (در قیاس کامل با قوانینی که توسط آنها می توانید URL ایجاد کنید - ,,,[_],[-).

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

در این مورد، نیازی به ایجاد یک تگ خالی "A" ندارید، اما می توانید از هر یک از عناصر موجود در مکان مناسب در متن استفاده کنید. مثلاً می تواند باشد.

آن ها برای ایجاد آنالوگ یک لنگر، کافی است یک ویژگی ID جهانی به هر تگ اضافه کنید (برای همه برچسب ها قابل استفاده است و اتفاقاً آنها بر اساس آن کار می کنند)، به عنوان مثال، مانند این:

متن عنوان

بنابراین، اکنون به جای ایجاد تعداد مورد نیاز لنگرهایی که کد را آلوده می کنند و در حال حاضر معتبر نیستند (توسط کنسرسیوم W3C که زبان Html را توسعه می دهد توصیه نمی شود)، به سادگی یک ID اضافه می کنیم.

به نظر می رسد که برای این کار، طبق معمول، لازم است که ویژگی اجباری "Href" را در داخل هایپرلینک "A" درج کنید، اما مقدار آن از نام برچسب مورد نظر (انکر) قبل از آن تشکیل می شود. علامت پوند "#"، که نام هش را نیز دارد (از این رو، به هر حال، پاهای نام پرکاربرد رشد می کنند: پیوند هش):

به محل صفحه مشخص شده با لنگر می پرد

لطفاً توجه داشته باشید که وقتی روی چنین پیوندی کلیک می کنید، سند جدیدی باز نمی شود. مرورگر صفحه ای که قبلاً باز شده است را به سمتی حرکت می دهد که مکانی در متنی که لنگر را در آن قرار داده اید در بالای صفحه قرار گیرد. منطقی است که فرض کنیم مقادیر همه برچسب ها (لنگرها) در یک صفحه باید منحصر به فرد باشند تا از سردرگمی برای مرورگر جلوگیری شود.

اگر یک لنگر با استفاده از ویژگی ID در یک تگ که به راحتی برای این کار قرار دارد ایجاد می کنید، باید در نظر داشته باشید که علاوه بر محدودیت در نوع کاراکترهای استفاده شده (,,,[_],[-])، مقدار ID نیز مورد نیاز است. باید با یک کاراکتر لاتین شروع شود.

سپس همه کاراکترهای معتبر را می توان در هر کمیت قرار داد، اما اولین کاراکتر برچسب لنگر در مقدار مشخصه ID باید یک حرف باشد (البته لاتین). در غیر این صورت، چنین لنگر درج شده در کد Html کار نخواهد کرد (در اکثر مرورگرها).

اگر بعد از علامت هش "#" هیچ نام لنگر برچسب (href="#") ننویسید، پس چنین هایپرلینکی صفحه را به بالا اسکرول می کند. به این صورت است که می توانید با ایجاد یک پیوند از تصویر (در این مورد کمی بعداً صحبت خواهیم کرد) و به عنوان مثال به شکل زیر، آن را در قالب سایت خود قرار دهید، ساده ترین دکمه "بازگشت به بالا" را ایجاد کنید:

Href یک ویژگی لازم برای هر تگ هایپرلینک است.

حالا بیایید از پیمایش درون سند (با استفاده از لنگرها) به ناوبری خارجی، یعنی. ما باید پیوندهایی ایجاد کنیم که منجر به اسناد دیگر در سایت خود یا سایت دیگری می شود. اکنون در ویژگی Href، دیگر نیازی به نوشتن علامت های لنگر نداریم، بلکه باید مسیر فایلی که باز می شود را بنویسیم (صفحه، با طراحی خود، فایلی است که برای نمایش بعدی در مرورگر بارگذاری می شود).

لنگر

در اینجا ما باید بیشتر در مورد آنها صحبت کنیم، اما من قبلاً در مورد آنها بیش از جزئیات در مطالب ذکر شده نوشته ام، بنابراین احتمالاً تکرار آن منطقی نیست. اما باید بدانید که چگونه می توانید مسیر فایل را در ویژگی Href لینکی که ایجاد کرده اید تنظیم کنید. بنابراین، برای آشنایی با مطالب ارائه شده اقدام نکنید.

با این حال، به شما یادآوری می کنم که هنگام ایجاد URL، استفاده از آن ترجیح داده می شود فقط شخصیت های زیر: (,,,[_],[-]) و از فاصله استفاده نکنید. اگر محتوای ویژگی Href را برای پیوندهای مطلق در نظر بگیریم، می توان آن را به صورت شماتیک به صورت زیر نشان داد:

اگر آنچه را که به ندرت استفاده می کنید کنار بگذاریم، می توانید همه را به شکلی ساده شده ارائه دهید:

پروتکل (معمولا http)://domain_name (به عنوان مثال وب سایت)/path_to_file (صفحات وب)

علاوه بر پروتکل ساده http در اینترنت، می توانید پیوندهایی با پروتکل https پیدا کنید، که تفاوت آن در استفاده از رمزگذاری است. مورد دوم در سایت هایی استفاده می شود که نیاز به محافظت از کانال تبادل داده بین سرور و مرورگر مشتری وجود دارد. به عنوان مثال، در خدمات پول الکترونیکی WebMoney استفاده می شود.

در اینترنت، می توانید انواع مختلفی از محتوای Href را پیدا کنید، به عنوان مثال، این یکی:

https://website/videokursy

یا مانند این (با پسوند فایل):

https://site/seo/kak-raskrutit-sajt.html

این اصل را تغییر نمی دهد، اما اگر در انتهای محتوای ویژگی Href در داخل هایپرلینک یک اسلش وجود داشته باشد، به این معنی است که دسترسی دیگر به فایل نیست، بلکه به پوشه ای که شی فهرست مربوطه در آن جستجو می شود (در مقاله مربوط به آدرس های url که در بالا ذکر شد، بیشتر بخوانید).

چیزی را از لینک دانلود کنید

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

دانلود از سرور Ftp

شما همچنین می توانید، برای مثال، با اضافه کردن آدرس مربوطه به Href، (mail) ایجاد کنید:

یک نامه بنویس

هنگامی که روی چنین پیوندی کلیک می کنید، برنامه ایمیل پیش فرض شما در رایانه شما باز می شود (می توانید مرورگر خود را طوری پیکربندی کنید که پیوندهای mailto در Href در Gmail و غیره باز شوند) و یک گفتگو برای ایجاد یک نامه جدید ظاهر می شود که در آن آدرس ایمیل داده شده در Href در قسمت "To" درج می شود.

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

به هر حال، اخیراً مدیران وب‌سایت‌ها عملاً استفاده از لینک‌های با mailto در Href را متوقف کرده‌اند، زیرا توسط اسپمرها تجزیه می‌شوند و تمام عواقب ناشی از آن وجود دارد. بهتر است در سایت ایجاد کنید، اگرچه هنوز همه چیز را به شکل کلاسیک در صفحه تماس ارائه می کنم. لازم است که در اوقات فراغت خود تغییر دهید (یا نه ... فکر می کنم).

نحوه باز کردن پیوند در یک پنجره جدید (هدف خالی)

هنگام ایجاد پیوند در کد Html، اغلب با این سوال روبرو می شویم که سندی را که به آن منتهی می شود در کدام پنجره مرورگر باز کنیم؟ به‌طور پیش‌فرض، در یک پنجره موجود باز می‌شود که روی صفحه‌ای که این لینک از آن قرار گرفته است همپوشانی دارد.

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

در موتورهای جستجو نیز دوست دارم باز کردن لینک ها را شخصی سازی کنم در یک پنجره جدیدبه طوری که موضوع همیشه در دسترس است و شما همیشه می توانید به آن بازگردید. برای این منظور، همانطور که قبلا ذکر شد، Html از یک ویژگی Target ویژه استفاده می کند که به طور پیش فرض دارای مقدار Self است:

سند را در همان پنجره باز می کند

اگرچه، البته، هیچ کس target="_self" را در تگ "A" نمی نویسد، زیرا این مقدار به طور پیش فرض استفاده می شود، اما اگر نیاز به باز کردن صفحه در یک پنجره جدید دارید، باید target="_blank" را بنویسید:

در پنجره ای جدید باز می شود

توجه داشته باشید که مقادیر مشخصه Target نوشته شده است با زیرخط در ابتدا(_blank)، زیرا در اعتبارسنجی Wc3 که حاوی حفره هایی در زبان نشانه گذاری فرامتن است، تصریح شده است. قابل توجه است که Html امکان تغییر گزینه باز کردن لینک پیش فرض را فراهم می کند.

به عنوان مثال، اگر می خواهید تمام لینک های سایت شما در یک پنجره جدید باز شوند، باید در قسمت Head قالبی که استفاده می کنید بنویسید. تگ پایهبا ویژگی target="_blank":

یه چیز دیگه اونجا

و اکنون، اگر می‌خواهید هر یک از پیوندها را در همان پنجره باز کنید، باید target="_self" را به تگ "A" آن اضافه کنید، زیرا _blank اکنون به طور پیش‌فرض استفاده می‌شود. اه چطور.

به هر حال، من از عنصر Base به روشی که در بالا توضیح داده شد استفاده کردم، اما همچنین یک ناحیه کد با چندین لینک که باید در یک پنجره جدید باز می شد را در آن قرار دادم. آن ها من همچنین از تگ بسته شدن Base در قسمت Body استفاده کردم و همه چیز درست شد. اگرچه چنین کدی البته معتبر نیست.

رنگ هایپرلینک در شناور و انتقال - نحوه تغییر آنها

در زبان Html، به قدری تصور می شد که برای کاربر آسان بود که کدام پیوند را قبلاً باز کرده بود و کدام یک هنوز دست نخورده باقی می ماند.

برای این منظور از رنگی استفاده می شود که با کلیک کاربر بر روی لینک و سند آویزان شده روی آن با موفقیت باز می شود. با بازگشت به صفحه اصلی، کاربر متوجه می شود که لینکی که بازدید کرده تغییر رنگ داده است. همه مرورگرها می توانند این ترفند را انجام دهند.

به‌طور پیش‌فرض، در Html خالص (بدون استفاده از ویژگی‌های CSS)، پیوندها زیرخط‌دار هستند و ممکن است داشته باشند سه گزینه رنگ:

1. آبی رنگ پیوندهای شکسته است که کاربر هنوز روی آن کلیک نکرده است
2. قرمز - بلافاصله پس از کلیک بر روی آن و تا زمانی که سند درخواستی از طریق شبکه در مرورگر کاربر بارگیری شود توسط هایپرلینک پذیرفته می شود (در شرایط مدرن گرفتن این لحظه اصلاً آسان نیست و همه چیز در همه جا مقصر است)
3. بنفش - رنگ پیوندهای استفاده شده که کاربر قبلاً دنبال کرده است

در Html 4.01، این رنگ های پیوند پیش فرض هستند، اما آنها را می توان تغییر دادبا استفاده از ویژگی های خاصی که در تگ Body نوشته شده است که می توانید آن ها را در یکی از فایل های قالب مورد استفاده خود بیابید. برای تغییر هر سه رنگ، به ترتیب از سه ویژگی استفاده می شود:

1. پیوند - رنگ یک پیوند بازدید نشده را تنظیم می کند
2. Alink - رنگ مورد فعال فعلی که توسط مرورگر پردازش می شود
3. Vlink - رنگ پیوندی که قبلاً توسط کاربر بازدید شده است

به یاد داشته باشید، من قبلاً در مورد چگونگی آن نوشتم. بر این اساس، ویژگی های ذکر شده ممکن است به صورت زیر باشد:

طبیعتاً منظور در اینجا گزینه Pure Html است، در صورتی که به دلایلی استفاده از استایل راحت یا غیرممکن است، در غیر این صورت می توان به راحتی همه این رنگ ها را با استفاده از ست و تغییر داد.

چگونه یک تصویر را لینک کنیم - دو روش

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

در مورد Html خالص در اطراف تصویر شما یک لینک، شما خواهد بود حاشیه پهن سه پیکسلی. علاوه بر این، رنگ این قاب کاملاً با رنگ پیوندهای پذیرفته شده برای سایت شما مطابقت دارد (در متن در مورد آنها کمی صحبت کردیم).

برای حذف اضافه کردن حاشیه به تصویری که یک پیوند ایجاد کرده اید، باید یک ویژگی Border با مقدار صفر به تگ Img اضافه کنید:

این یک راه بسیار ساده برای تبدیل یک تصویر به یک لینک است، اما گزینه پیچیده تری نیز وجود دارد به نام نقشه تصویر. در این حالت، به دلیل استفاده از تعداد نسبتاً زیادی تگ ها و ویژگی های Html، می توانید یک نقشه کامل از پیوندها با مناطق فعال (قابل کلیک و داشتن اشکال مختلف - مستطیل، دایره، چند ضلعی) از یک تصویر ایجاد کنید.

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

موفق باشی! به زودی شما را در سایت صفحات وبلاگ می بینیم

ممکن است علاقه مند باشید

انتخاب، Option، Textarea، Label، Fieldset، Legend - برچسب های Html فرم لیست کشویی و فیلد متنی
نحوه درج لینک و تصویر (عکس) در تگ های HTML - IMG و A
Iframe و Frame - چه هستند و بهترین روش استفاده از فریم ها در Html
کاراکترهای فضای خالی و قالب بندی کد آنها در Html و همچنین کاراکترهای ویژه فضای خالی و سایر یادداشت ها
MailTo - چیست و چگونه می توان یک پیوند ایمیل در Html ایجاد کرد
نحوه تنظیم رنگ ها در کد Html و CSS، انتخاب سایه های RGB در جداول، نتایج Yandex و سایر برنامه ها
فونت (چهره، اندازه و رنگ)، Blockquote و تگ های پیش - قالب بندی متن منسوخ شده در HTML خالص (بدون استفاده از CSS)
Img - تگ Html برای درج یک تصویر (Src)، تراز کردن و بسته بندی آن با متن (تراز کردن)، و همچنین تنظیم پس زمینه (پس زمینه)
لیست در کد Html - برچسب های UL، OL، LI و DL
برچسب ها و ویژگی های سرفصل های H1-H6، خط افقی Hr، شکست خط Br و پاراگراف P مطابق با استاندارد Html 4.01

تنها مقدار مرتبط در حال حاضر هدف _blank است. سایر مقادیر هدف برای تعیین فریم های خاص استفاده شد. با این حال، فریم ها در HTML5 منسوخ شده اند.

هدف پیش فرض

اگر هیچ هدفی مشخص نشده باشد، پیوند در شرایط فعلی باز می شود، مگر اینکه کاربر یا مرورگر چیز دیگری را مشخص کند.

a target=”_blank” باز کردن در برگه مرورگر جدید (یا پنجره)

مشخصه target مشخص می کند که وقتی روی پیوند کلیک می شود، سند پیوند داده شده کجا باز می شود. پیش فرض پنجره فعلی است. اگر target="_blank" , سند پیوند شده در یک برگه جدید یا (در مرورگرهای قدیمی) یک پنجره جدید باز می شود.

چرا در یک مرورگر جدید باز کنیم؟

رایج ترین دلیل برای استفاده از "target="_blank این است که پیوندهای خارج از سایت در یک برگه جداگانه باز می شوند. این به کاربر اجازه می‌دهد تا روی یک مرجع کلیک کند و بعداً بدون خروج از صفحه فعلی به آن بازگردد. بازدیدکنندگان را برای مدت طولانی تری در سایت شما نگه می دارد و بیشتر معیارهای شما را بهبود می بخشد: نرخ پرش، تبدیل، صفحات بازدید شده.

همه پیوندهای خارجی را در یک تب جدید با جاوا اسکریپت باز کنید

نیازی نیست که به صورت دستی target="_blank" را به هر لینکی در سایت خود اضافه کنید. اگر زیاد لینک می دهید (که باید انجام دهید)، به راحتی می توانید مقداری کد جاوا اسکریپت را به سایت خود اضافه کنید و همه لینک های خارجی را به صورت خودکار به لینک های _blank تبدیل کنید.

(شما می توانید یک شکل کمی تغییر یافته از این کد را در هر صفحه این وب سایت مشاهده کنید.) این ترفند به jQuery نیاز دارد، اما احتمال زیادی وجود دارد که از قبل از آن استفاده کنید. در محبوب ترین چارچوب ها و سیستم های مدیریت محتوا از جمله وردپرس، دروپال و بوت استرپ توییتر استفاده می شود. اگر نیاز به انجام این کار بدون jQuery دارید، این کار نیز قابل انجام است. در اینجا یک نسخه "جاوا اسکریپت ساده" آمده است:

تابع externalLinks() ( for(var c = document.getElementsByTagName("a")، a = 0;a< c.length;a++) { var b = c[a]; b.getAttribute("href") && b.hostname !== location.hostname && (b.target = "_blank") } } ; externalLinks();

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

دلایل عدم استفاده از «target=”_blank

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

مقادیر ویژگی هدف