ایجاد یک لینک ساده در دفترچه یادداشت لینک چیست و چگونه یک هایپرلینک در HTML ایجاد کنیم

<а href="http://www.mysite.com/doc2.htm/anch3">

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

برنج. 1.16. پنجره مرورگر که نتیجه فایل نشان داده شده در لیست 1.16 را نشان می دهد

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

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

با این حال، ما از قبل می دانیم که می توانید هر عنصری از یک سند HTML را با استفاده از پارامتر id شناسایی کنید، که می تواند به عنوان بخشی از هر تگ استفاده شود. در عین حال، هایپرلینک هایی که به قطعات سند اشاره می کنند نیز می توانند از این پارامترها استفاده کنند، به عنوان مثال، برای تنظیم نشانگر نشانک برای هر برچسب، استفاده از تگ ضروری نیست.<а>با پارامتر name، فقط باید از پارامتر id استفاده کنید.

مقادیر پارامتر نام و پارامتر id شناسه های منحصر به فرد عناصر در سند HTML هستند. بنابراین، هیچ مقدار پارامتر نام نباید با مقدار پارامتر id مطابقت داشته باشد.

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

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

<а href="www.site.com" title="سایت خیلی خوبیه">

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

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

مقدار پارامتر rel یکی از کلیدواژه های از پیش تعریف شده است که اکنون به بررسی آن خواهیم پرداخت.

• متناوب.مقدار نشان می دهد که سند یک نمایش جایگزین از سند اصلی است. اگر یک هایپرلینک از پارامتر lang با مقداری متفاوت از زبان سند منبع استفاده کند، آنگاه چنین پیوندی معمولاً پیوندی به یک کپی از سند منبع به زبانی دیگر در نظر گرفته می شود.
• برگه سبک.نشان می دهد که سند پیوند داده شده یک شیوه نامه است. مکانیسم استفاده از شیوه نامه در فصل دوم به تفصیل شرح داده شده است.
• شروع کنید.برای تعیین سند اولیه و شروع مجموعه خاصی از اسناد استفاده می شود. برای یک وب سایت، این به وضوح صفحه اصلی خواهد بود.
• بعد.این مقدار در صورتی استفاده می‌شود که سند شروع و سند پیوند داده شده بخشی از توالی مرتب شده خطی اسناد باشند، و دومی در ترتیب بعدی با توجه به صفحه وب منبع باشد.
• قبلیمقدار در حالت مشابه مورد قبلی استفاده می شود، اما اکنون نشان می دهد که سند موجود در زنجیره، سند بعدی نیست، بلکه سند قبلی در رابطه با سند شروع است.
• فهرست مطالب.در پیوندهایی استفاده می شود که به سندی اشاره می کنند که محتوای نمایه شده صفحه وب اصلی است.
• واژه نامه.مقدار نشان می دهد که سند حاوی واژه نامه ای از اصطلاحات استفاده شده در سند منبع است.
• کپی رایت.در صورتی استفاده می شود که سند فوق پیوند حاوی یک اعلان حق چاپ برای محتوای سند اصلی باشد.
• فصلدر لینک‌هایی استفاده می‌شود که به اسنادی اشاره می‌کنند که فصل‌های جداگانه در مجموعه خاصی از اسناد هستند.
• بخش.هایپرلینک با این مقدار پارامتر رابطهسندی را نشان می دهد که بخشی از یک مجموعه کلی از اسناد است که یک محتوای کامل را تشکیل می دهد.
• زیر بخشمعنا ادامه مفهومی است که با معنای قبلی که در نظر گرفتیم نشان داده شده است. یعنی سند از قبل موجود است زیر بخش
• ضمیمه.این مقدار نشان می دهد که سند پیوند داده شده پیوستی به سند اصلی است.
• کمک.برای پیوند دادن به اسنادی استفاده می شود که اطلاعات پس زمینه اضافی را به محتوای سند اصلی ارائه می دهند.
• نشانک.برای پیوند به اسناد HTML حاوی پیوندهایی به برخی از قطعات کلیدی انتخاب شده از سند منبع استفاده می شود.

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

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

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

اما اجازه دهید به بررسی ویژگی های برچسب برگردیم<а>. ویژگی rev برعکس ویژگی rel است. در حالی که ویژگی rel نوع سندی را مشخص می کند که هایپرلینک به آن اشاره می کند، ویژگی rev نوع سند منبع حاوی هایپرلینک را مشخص می کند. همان مجموعه کلمات کلیدی که برای ویژگی rel استفاده شد به عنوان مقادیر این ویژگی استفاده می شود.

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

<а href="http://www.mysite.com/docl.html" target="_top">

چنین پیوندی باعث می شود که مرورگر صفحه وب را که URL آن به عنوان مقدار پارامتر href مشخص شده است، در فریم بالایی که نام آن در پارامتر هدف مشخص شده است، بارگذاری کند. مقدار آخرین پارامتر، کلمات کلیدی تعریف شده در مشخصات HTML است. ما به این موارد در بخش قاب ها نگاه خواهیم کرد.

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

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

<а href="http://www.mysite.com/docl.html" tabindex="2" accesskey="U">

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

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

فهرست 1.17

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/htm!4/strict.dtd">




<р>این متن معمولی است.

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

نقشه شامل توصیفی از بخش ها است. هر بخش با استفاده از یک تگ توصیف می شود<агеа>. ما می توانیم بخش های فعال را به سه شکل مختلف اعمال کنیم: مستطیل، دایره و چند ضلعی. شکل با استفاده از پارامتر شکل مورد نیاز مشخص می شود. ما می توانیم یکی از سه مقدار از پیش تعیین شده را به عنوان مقدار این پارامتر استفاده کنیم.

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

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

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

برای برچسب زنی<аrеа>پارامتر href نیز گنجانده شده است که مقدار آن URL منبعی است که هایپرلینک این بخش به آن اشاره می کند.
اما این پارامتر، با کمال تعجب، مورد نیاز نیست. در موردی که یک سگمنت در حال ایجاد است اما نباید به یک هایپرلینک متصل شود، باید از پارامتر nohref استفاده شود که معنایی ندارد.
اما یک پارامتر مورد نیاز برای تگ<аrеа>همه چیز همینطور است این یک پارامتر alt است که مقدار آن یک رشته متنی است که یک نمایش جایگزین از نقاشی است. همانطور که می دانیم، زمانی که کاربر نشانگر ماوس را بر روی یک شی قرار می دهد، این خط به عنوان یک اشاره نمایش داده می شود. در مورد ما، چنین شیئی یک بخش فعال است که در یک تصویر گرافیکی جاسازی شده است.

همچنین در برچسب<агеа>مانند تگ هایپرلینک معمولی، از tabindex و پارامترهای کلید دسترسی استفاده می شود که به شما امکان می دهد بدون استفاده از ماوس، فقط با استفاده از صفحه کلید، یک هایپرلینک را فعال کنید. ما کمی قبل به ساختار مقادیر این پارامترها نگاه کردیم. با کاوش کمی از موضوع، لازم به ذکر است که هر وب مستر مناسب حتما باید از این پارامترها استفاده کند، زیرا تنها استفاده از آنها می تواند فعال سازی هایپرلینک ها را بدون استفاده از ماوس تضمین کند.

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

لیست 1.18

"http://www.w3.org/TR/html4/strict.dtd">

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

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

• مجموعه شخصیت ها- رمزگذاری سندی را که پیوند به آن اشاره می کند را نشان می دهد.
• href- URL سندی که پیوند به آن به عنوان مقدار استفاده می شود.
• hreflang- مقدار تعیین کد زبانی است که سند پیوند داده شده در آن نوشته شده است.
• نوع- نوع سندی را که پیوند به آن اشاره می کند را تعیین می کند.
• رابطه- وضعیت سندی را که پیوند به آن اشاره می کند را در رابطه با سند منبع تنظیم می کند.
• دور- وضعیت سند منبع را در رابطه با سندی که این پیوند به آن اشاره می کند تنظیم می کند.
• رسانه ها- نوع دستگاهی را نشان می دهد که سندی که پیوند به آن نشان داده می شود.

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

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

استفاده از تگ ما اساس پیوندهای با مقادیر پارامتر href کوتاه شده را تعیین می کنیم. بیایید سعی کنیم عملکرد این مکانیسم را با استفاده از یک مثال ساده و واضح نشان دهیم:

"http://www.w3.org/TR/html4/strict.dtd">



<Р>متن<А href="/pages/birds.gif">ارتباط دادن

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

از آدرس www.mysite.com/pages/birds.gif.

باید مشخص شود که تگ در هدر سند بین تگ ها قرار می گیرد و .

و این تمام چیزی است که می توانیم در مورد استفاده از هایپرلینک ها در HTML به شما بگوییم.

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

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

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

§ 1. پیوند به فایل، پیوند به وب سایت، پیوند به صفحه

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

برای اینکه اجازه ندهم افکارم سرگردان شوند، همه چیز را با یک مثال به شما نشان خواهم داد.

در مرورگر ما این را خواهیم دید:

در مرورگر ما این را خواهیم دید:

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

§ 2. ایجاد پیوندهای خارجی

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

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

به عنوان مثال، برای ایجاد یک لینک متنی به صفحه اصلی این سایت، باید کد HTML زیر را بنویسید:

http://www.seoded.ru/"> صفحه اصلی وب سایت

در مرورگر به شکل زیر خواهد بود:

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

§ 2.1 پیوندهای گرافیکی (پیوندهای تصویری)

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

و مرورگر نشان خواهد داد:

به طور پیش فرض، مرورگر تصویر را در یک پیوند گرافیکی با یک قاب احاطه می کند. اگر این نامطلوب است، پس ویژگی مرزبرچسب زدن IMGشما باید مقدار 0 را اختصاص دهید:

border="0">

صفحه نخست

§ 3. پیوندهای داخلی

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

name="anchor name">متن

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

I measles در آن مکان هایی از صفحه قرار دارد که کاربر باید پس از کلیک بر روی لینک به آنجا برود.

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

من یک لنگر با نام ایجاد کردم زاگولوووکو آن را در کنار عنوان این درس («Hyperlinks in HTML») قرار داد. کد انکر به شرح زیر است:

name="zagolovok">

href="#zagolovok">به عنوان

و در مرورگر به این صورت:

اگر متوجه شدید، پس از کلیک بر روی پیوند داخلی عنوان، URL در نوار آدرس مرورگر تغییر کرد:

به آدرس اصلی:

http://www..html

http://www..html#zagolovok

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

§ 4. مراجع مطلق و نسبی

صفحه نخست

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

بیایید آن را کنار بگذاریم، باید به صفحه پیوند دهیم clienty.htmlکه دروغ می گوید در یک پوشهبا صفحه اصلی سایت سپس کد پیوند نسبی به شکل زیر خواهد بود:

/klienty.html">مشتریان

حال فرض می کنیم که در همان پوشه ای که صفحه اصلی وجود دارد پوشه زکازیو در حال حاضر در آنصفحه klienty.html قرار دارد سپس کد پیوند نسبی به شکل زیر خواهد بود:

/zakazy/klienty.html">مشتریان

حالا بیایید به ایجاد هایپرلینک نگاه کنیم نسبت به صفحه اصلی. فرض کنید یک صفحه داریم price.html(صفحه منبع) و از آن باید به صفحه پیوند دهید clienty.htmlگزینه های معمولی زیر وجود دارد:

1. صفحات price.html و clienty.html قرار دارند در یک پوشه.

klienty.html">مشتریان




2. در پوشه ریشه سایت، قیمت صفحه.html در پوشه زکازی قرار دارد یک سطح بالاتر).

کد به شکل زیر خواهد بود:

../klienty.html">مشتریان

دو نقطه نشان می دهد که باید از پوشه فعلی به سطح بالاتری بروید.




3. صفحه klienty.html و پوشه zakazy قرار دارد در پوشه ریشه سایت، پوشه مبل در پوشه زکازی قرار دارد، قیمت صفحه.html در پوشه mebel قرار دارد(یعنی صفحه klienty.html نسبت به صفحه اصلی price.html دروغ است دو سطح بالاتر).

../../klienty.html">مشتریان

یعنی هر سطح با دو نقطه و یک اسلش نشان داده می شود. / ».




4. در پوشه ریشه سایت, page clienty.html در پوشه زکازی قرار دارد(یعنی در حال حاضر صفحه klienty.html نسبت به صفحه اصلی price.html دروغ است یک سطح پایین تر).

zakazy/klienty.html">مشتریان

در این حالت از نقطه و اسلش استفاده نمی شود.




5. صفحه price.html (صفحه اصلی) و پوشه زکازی قرار دارد در پوشه ریشه سایت، پوشه مبل در پوشه زکازی قرار دارد, page clienty.html در پوشه mebel قرار دارد(یعنی صفحه klienty.html اکنون نسبت به صفحه اصلی price.html است در دو سطح زیر قرار دارد).

zakazy/mebel/klienty.html">مشتریان




6. در پوشه ریشه سایت دو پوشه وجود دارد: زکازی و اوپلاتا. Page clienty.html در پوشه زکازی قرار دارد، قیمت صفحه اصلی.html در پوشه oplata قرار دارد(یعنی هر دو صفحه دروغ هستند در پوشه های مختلف یک سطح پایین تراز پوشه ریشه سایت).

../zakazy/klienty.html">مشتریان

§ 5. پیوند به ایمیل

به منظور. واسه اینکه. برای اینکه یک لینک به ایمیل ایجاد کنید، به جای URL در مقدار ویژگی مورد نیاز است hrefیک آدرس ایمیل بنویسید که پروتکل را نشان دهد ( mailto:). و پس از کلیک بر روی چنین پیوندی، یک پنجره برنامه ایمیل با آدرس ایمیل وارد شده در قسمت "To" باز می شود. در کد HTML به شکل زیر است:

mailto: [ایمیل محافظت شده]"> نامه من

و در مرورگر به این صورت:

title="به صفحه اصلی بروید">!} صفحه نخست

§ 7. نتیجه گیری

این اطلاعات اولیه در مورد است ایجاد لینک در HTML. این درس را به پایان می رساند. و این واقعیت نشان می دهد که شما قبلاً بر بیشتر اصول اولیه HTML تسلط دارید.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

نحوه ایجاد انکرها و هش پیوندها

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

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

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

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

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

متن عنوان

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

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

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

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

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

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

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

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

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

لنگر

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

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

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

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

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

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

Https://site/videokursy

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

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

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

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

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

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

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

یک نامه بنویس

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

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

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

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

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

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

من همچنین دوست دارم باز شدن پیوندها را در موتورهای جستجو پیکربندی کنم. در یک پنجره جدیدبه طوری که موضوع همیشه در دسترس است و شما همیشه می توانید به آن بازگردید. برای این منظور، همانطور که قبلا ذکر شد، 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 - رنگ پیوندی که قبلاً توسط کاربر بازدید شده است

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

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

نحوه ایجاد یک تصویر به یک لینک - دو روش

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

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

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

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

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

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

با رفتن به اینجا می توانید ویدیوهای بیشتری را تماشا کنید

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

انتخاب، Option، Textarea، Label، Fieldset، Legend - برچسب های Html برای فرم لیست های کشویی و فیلدهای متنی
نحوه درج لینک و تصویر (عکس) در تگ های HTML - IMG و A
Iframe و Frame - چه هستند و بهترین روش استفاده از فریم ها در Html
کاراکترهای فضای خالی و قالب بندی کد آنها در Html، و همچنین کاراکترهای فضای خالی بدون شکستگی و سایر یادداشت ها
نحوه تنظیم رنگ ها در کد Html و CSS، انتخاب سایه های RGB در جداول، خروجی Yandex و سایر برنامه ها

(نمونه های بیشتری را در پایین همین صفحه خواهید دید)

هایپرلینک های HTML (لینک ها)

برچسب بزنید به دو صورت قابل استفاده است: