Se deschide într-o fereastră nouă. CSS: modificarea stilului pentru link-urile care se deschid într-o fereastră nouă

Unul dintre vizitatorii site-ului a întrebat cum să deschideți un link într-o nouă fereastră HTML. În acest articol voi răspunde la această întrebare.

Ce vei avea nevoie

Vizitatorul nu a specificat ce editor folosește, așa că vom presupune că funcționează direct în HTML. Dar asta nu înseamnă că nu poți urma aceste instrucțiuni dacă le folosești editor vizual. Va trebui doar să accesați aspectul paginii. Majoritatea editorilor și platformelor de blog vă permit să editați manual codul HTML.

De exemplu, dacă lucrați în Expression Web, puteți edita codul paginii trecând la modul Cod.

Cum să setați linkurile să se deschidă într-o filă nouă sau fereastră nouă de browser

thesitewizard.com

Schimbați-l astfel încât să arate așa:

thesitewizard.com

Acum, când utilizatorii dau clic pe acest link, acesta se va deschide într-o nouă fereastră sau filă (în funcție de browserul pe care îl folosesc și de modul în care este configurat).

Vă rugăm să rețineți că, dacă utilizați un DOCTYPE cu sintaxă strictă XHTML 1.0 sau 1.1, nu veți putea folosi codul de mai sus și pagina este validată în același timp. Dar bănuiesc că nimeni nu folosește aceste standarde. Versiunile „de tranziție” ale acestor standarde pentru deschiderea într-o nouă fereastră HTML sunt destul de potrivite pentru noi și, de asemenea, acceptă atribut target.

Dacă lucrați în Expression Web, Dreamweaver, BlueGriffon sau KompoZer, faceți clic pe linkul pe care doriți să îl editați, intrați în modul de editare HTML și adăugați atributul target="_blank".

Această metodă nu are multe avantaje.

Mulți webmasteri noi cred că, deschizând link-uri într-o fereastră nouă, utilizatorii sunt mai puțin probabil să părăsească site-ul. Acest lucru este fundamental greșit. Dacă cineva face clic pe un link și apoi dorește să revină pe site-ul dvs., va face pur și simplu clic pe butonul „Înapoi”. Chiar și cei mai puțin cunoscuți din punct de vedere tehnic vor afla despre această funcție imediat după ce se vor familiariza cu Internetul. Utilizatorii avansați știu, de asemenea, că puteți utiliza opțiunea „Deschideți linkul într-o filă nouă” (sau „Deschideți linkul într-o fereastră nouă”).

Prin crearea de linkuri care se deschid într-o fereastră nouă, împiedicați utilizatorii să se întoarcă pe site-ul dvs. Poate părea că vor reveni cu ușurință la prima fereastră cu site-ul dvs. Experiența mea este că nu este cazul - îi încurcă pe oameni buton rupt"Înapoi ". Nici măcar nu bănuiesc ce au în fața lor inserție nouă sau o fereastră nouă. Când nu se pot întoarce rapid la pagina anterioară, pur și simplu renunță și trec la alte resurse.

Utilizatorii experimentați nu se descurcă mai bine. Sunt foarte enervați de „obișnuința” site-ului dvs. de a deschide ferestre noi fără permisiune. De aceea ei utilizatori experimentați- dacă ar dori să deschidă o filă nouă, ar face-o singuri și nu le place deloc că o fac fără acordul lor. Este și mai rău dacă toate linkurile tale se deschid într-o fereastră nouă.

Site-ul devine vulnerabil la atacuri de tip phishing

Dacă aplicați butonul HTML deschideți într-o fereastră nouă folosind target="_blank" , site-ul către care duce linkul are acces la fereastra/fila cu pagina dvs. și poate înlocui conținutul acesteia.

Nu numai că acest lucru nu va menține utilizatorii pe site (dacă ați deschis noi file chiar în acest scop), dar va pune și vizitatorii în pericol. De exemplu, dacă aveți o pagină de autentificare a utilizatorului, site-ul aflat pe link o poate înlocui cu o copie a dvs., dar în același timp colectând login-uri și parole de utilizator. Acest tip de atac se numește „phishing”.

Și aceasta nu este o vulnerabilitate teoretică. Specialiștii în securitate Google au remarcat un „număr semnificativ de rapoarte” despre astfel de deturnări de file în scopul introducerii de software rău intenționat.

Pentru cei interesați - detalii tehnice. Site-ul deschis într-o fereastră nouă accesează pagina ta prin obiectul window.opener din JavaScript. Acesta este un obiect de citire/scriere care poate fi manipulat. Printre altele, puteți modifica proprietatea window.opener.location și puteți forța browserul să meargă la noua adresă pentru a deschide imaginea într-o nouă fereastră HTML.

Unele browsere vă permit să preveniți acest comportament prin adăugarea unui atribut rel="noopener noreferrer" la link. Exemplul dat la începutul articolului ar arăta astfel:

thesitewizard.com

În teorie, atât rel="noopener" cât și rel="noreferrer" ar trebui să fie suficiente pentru a proteja împotriva unui astfel de atac atunci când deschideți pagina într-o fereastră HTML nouă. În acest caz, este mai corect să folosiți atributul rel=”noopener”, deoarece rel=”noreferrer” are prin efect- browserul nu va transmite URL-ul sursei solicitării către site. Dar mai departe acest moment Nu toate browserele acceptă atributul rel="noopener". De asemenea, rel="noreferrer" nu este acceptat de unele browsere. Prin urmare, dacă doriți să protejați utilizatorii cât mai mult posibil Mai mult browserele vor trebui probabil să utilizeze ambele atribute.

Cu toate acestea, această tehnică funcționează numai pe curent versiuni Chrome, Firefox și Safari. Internet Explorer această funcție nu suportă, deși am verificat rapid versiunea 11 a IE și pare să fie protejată de un astfel de atac cu setările de securitate implicite. Despre browser Microsoft Edge nu pot spune sigur.

Cu alte cuvinte, metoda descrisă mai sus nu poate fi numită protecție sută la sută. Cel mai bun mod Pentru a evita această problemă - utilizați legături normale fără atributul target="_blank".

Concluzie

O recomandare generală este să evitați deschiderea filelor într-o fereastră HTML nouă, dacă este posibil. Desigur, în unele cazuri acest lucru nu poate fi evitat. În această situație, puteți avertiza vizitatorii site-ului că „linkul se deschide într-o fereastră nouă”. Acest lucru nu va ajuta prea mult utilizatorul obișnuit și nu îl va proteja de atacurile de phishing prin site-ul dvs., dar cel puțin nu va enerva utilizatorii mai experimentați.

Cu toții înțelegem că uneori este mai convenabil să deschideți link-uri în fereastra curentă, iar uneori într-una nouă. Eu personal ader la o regulă simplă în majoritatea proiectelor - dacă linkul este intern (în cadrul site-ului), atunci implicit se deschide în fereastra curentă și linkuri externe, care duce undeva către alte site-uri, deschide noi ferestre (file) în mod implicit.

...

atributul target nu este specificat sau este specificat ca target="_self" , atunci documentul se deschide în fereastra curentă a browserului, iar dacă linkului i se atribuie un atribut de forma target="_blank" , documentul se deschide într-o fereastră nouă .

Dar atunci apare întrebarea - cum poate un utilizator să facă diferența între aceste 2 tipuri de link-uri fără să facă clic pe ele sau să se uite la codul HTML al paginii?

Cel mai logic este dacă designul CSS al celor două tipuri de link-uri este diferit, iată o opțiune în care link-urile cu target="_blank" sunt evidențiate cu caractere aldine:

A ( font-weight:expression((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "bold": "normal"); ) a ( font-weight:bold ;

Aici, așa cum se întâmplă adesea, trebuie să luați în considerare Internet Explorer și alte browsere separat, prima indicație de stil este doar pentru IE, iar a doua este pentru alte browsere.

Puteți experimenta în mod similar cu alte proprietăți CSS, cum ar fi sublinierea pentru decorarea textului:

A ( text-decoration:expression((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "underline" : "none"); ) a ( text-decoration:subliniere ;

În funcţie de ierarhie Proprietăți CSS, într-un anumit browser este posibil ca ceva să nu funcționeze. În plus, nu aș folosi sublinierea când implicit toate linkurile sunt deja subliniate (sau nu sunt subliniate).

O modalitate alternativă și între browsere este să încercați să separați legăturile externe de restul prin intermediul lor adrese. Să presupunem că legăturile externe sunt întotdeauna specificate ca absolut(începând cu prefixul http://), iar cele interne sunt scrise ca relativ. Cel mai adesea, asta fac pe site-urile normale. Acest lucru funcționează și în IE, de macar, din versiunea 8.

A ( font-weight: bold /* Bold pentru link-uri absolute */ )

Dar aici ne-am abătut de la sarcina originală și pur și simplu solicităm ca URL-ul să înceapă cu http://, adică evidențiem cu caractere aldine URL-uri absolute care nu sunt neapărat externe și nu toate linkurile care se deschid într-o fereastră nouă.

În afară de IE 6 și 7, puteți simplifica lucrurile folosind pseudo-elementele înainte și după, care vă permit să specificați ce ar trebui să apară înainte sau după elementele la care sunt atașate.

De exemplu, prin stil putem adăuga o poză mică după fiecare link care se deschide într-o fereastră nouă.

Totuși, mi se pare că este mai logic să simplu schimba designul de fundal un link care se deschide într-o fereastră nouă - până la urmă, adăugarea oricărui text sau imagine înainte sau după link poate perturba aspectul site-ului. Pentru a nu suferi, vom pune gălbui culoare de fundal toate linkurile se deschid într-o fereastră nouă.

A ( culoare de fundal: #FFFF99; ) a ( culoare de fundal: expresie((this.getAttribute("target") && this.getAttribute("target")=="_blank") ? "#FFFF99" : "transparent ");)

.

Internet Explorer Mozilla Firefox Lucrul cu filele
V browser Google Crom

cu file.

Găsiți toate informatii complete despre lucrul cu file pe care le puteți în dvs Google Chrome.

Problemă de browser: toate linkurile se deschid într-o filă nouă

Pentru a face acest lucru, deschideți browserul și faceți clic pur și simplu cheie functionala F1 pe tastatură. Sau faceți clic pe pictograma cheie, sau poate pe o pictogramă ca a mea, în loc de cheie, la sfârșit bara de adresa browser. Și selectați Ajutor în partea de jos a filei care se deschide. Se va deschide o filă nouă cu un link Tabs și Windows în centru. Faceți clic și toate titlurile asociate filelor se vor deschide în partea dreaptă.

Opera Safari

Când navighezi pe internet, browsere moderne Puteți deschide oricând o pagină printr-un link într-o fereastră sau filă nouă. Acest lucru este adesea foarte convenabil - vedeți link interesant, dar nu ridicați privirea din textul pe care îl citiți, ci deschideți linkul într-o fereastră sau filă nouă pentru a reveni când ați terminat cu cel deschis în prezent. Mi-am dorit întotdeauna o astfel de oportunitate să existe în Windows Explorer- a dat clic Click dreapta după folder - și există o opțiune: „deschide într-o fereastră nouă”.

Este destul de ușor să adăugați o astfel de opțiune accesând proprietățile Explorer, dar nu faceți acest lucru pe fiecare computer pe care îl vizitați! Este mult mai bine să automatizezi procesul folosind fisier reg. Acesta este al doilea obiectiv al acestui articol - de a continua subiectul registrului și de a arăta cum poate fi editat nu numai manual.

În acest articol voi furniza codul pentru un fișier care adaugă o opțiune la meniul contextual; În plus, acest fișier poate fi descărcat. Daca ai exemple interesante fișiere de registry, trimite-mi-le în comentarii!

Notă: Îmi cer scuze celor care așteptau un articol despre anonimat. nu am timp. Îl scot din stoc.

Deci, registrul.

Cum să deschideți linkurile într-o fereastră sau o filă nouă

Dacă ați rulat deja regedit, puteți experimenta cu exportarea întregului registry sau a unei părți din acesta. Pentru a face acest lucru, trebuie să stați pe ramura registrului, să mergeți la meniul de export de fișiere și să selectați unde doriți să încărcați. Rezultatul va fi un fișier cu extensia reg, apasare dubla care va fi folosit pentru restaurarea registrului - încărcare inversă. Dar puteți crea singur un astfel de fișier, ceea ce vom face acum. Crea fisier textși notează în interior următorul conținut:

@="Deschide într-o fereastră nouă"

@="C:\\WINDOWS\\explorer.exe \"%1\""

Acum fișierul trebuie redenumit - schimbați-i extensia în reg. Cum să o facă? Exact în același mod în care redenumiți alte fișiere, doar că mai întâi trebuie să afișați extensiile de fișiere.

Faceți dublu clic pe un astfel de fișier, sunteți de acord să faceți modificări în registry - și voila, meniul contextual schimbat - când faceți clic dreapta pe un dosar, apare opțiunea „deschidere în fereastră nouă”. Dacă nu doriți să creați, editați și redenumiți fișierul, îl puteți descărca de pe site-ul meu.

Dar site-ul meu va face un astfel de fișier pagina principalaîn Internet Explorer

Windows Editorul Registrului Versiunea 5.00

„Pagina de pornire” = „https://it.sander.su/”

Aveți exemple bune fișiere pentru editarea registrului? Trimite-l! Apropo, permiteți-mi să vă reamintesc vechea mea postare despre gazda de script Windows - există exemple de programe de benzi desenate în limbajul încorporat în Windows.

comentarii alimentate de

Cum se deschide un link într-o fereastră nouă? Cum să schimbi
setările filei
în browsere

Browserele sunt inițial configurate diferit pentru a deschide pagini noi. De exemplu, Safari este configurat să deschidă pagini noi într-o fereastră nouă. Și Mozilla Firefox deschide pagini noi în file noi din Bara de file, dar în plus avem posibilitatea de a deschide ferestre noi.
Puteți modifica singur setările.

Internet Explorer

Modificați setările filei în motor de cautare Explorer este disponibil în secțiunea Opțiuni Internet. Faceți clic pe pictograma roată din partea dreaptă sus a panoului browserului. Selectați Opțiuni Internet, apoi selectați fila General și în partea de jos, în linia File, faceți clic pe Opțiuni. În centrul de sub linie Când deschideți o filă nouă, deschideți: selectați modalitatea dorită de a deschide filele în triunghiul negru.

Mozilla Firefox

Pentru a modifica setările filei în Browser Mozilla Firefox, faceți clic pe butonul Instrumente din bara de instrumente. În partea de jos, dă clic pe Setări. În partea de sus a noii ferestre, faceți clic pe File. Și aici puteți fie să bifați casetele, fie să le debifați în modul în care doriți să deschideți noi file.

Lucrul cu filele
în browserul Google Chrome

În final versiuni Google Nu am gasit Chrome
posibilitatea de a schimba setările pentru file.
Probabil că acest lucru este foarte convenabil și browser inteligentși nu este nevoie să schimbați setările. Pentru că Google Chrome oferă utilizatorilor multe opțiuni cu file.
Foarte ușor să deschideți o filă nouă și nouă
fereastră, chiar și prin taste rapide.
Trebuie să deschideți aceeași pagină web în mai multe file
Există o opțiune pentru a duplica o filă. Există o oportunitate de a lucra
în modul incognito ( vizualizare ascunsă). Îl poți muta pe cel de care ai nevoie
filă într-o fereastră separată. Și multe alte oportunități de muncă
cu file.

Puteți găsi toate informațiile complete despre lucrul cu file în Google Chrome. Pentru a face acest lucru, deschideți browserul și apăsați pur și simplu tasta funcțională F1 de pe tastatură. Sau faceți clic pe pictograma cheie, sau poate pe o pictogramă ca a mea, în loc de o cheie, la sfârșitul barei de adrese a browserului. Și selectați Ajutor în partea de jos a filei care se deschide. Se va deschide o filă nouă cu un link Tabs și Windows în centru. Faceți clic și toate titlurile asociate filelor se vor deschide în partea dreaptă.

Safari

Pentru a modifica setările pentru file în browser Safari Faceți clic pe pictograma roată din partea dreaptă a panoului browserului. În fila nouă, selectați Setări, iar în fereastra următoare, selectați File. Și aici în linia Deschide paginile în file, nu în ferestre: selectează opțiunea de care ai nevoie.

Operă

ÎN browser Opera Pentru a modifica setările filei, faceți clic pe butonul Instrumente din panou. Selectați în partea de jos a noii file Setari generale. Și în această filă, faceți clic pe panoul Avansat și apoi pe butonul Setări filă. Se va deschide o fereastră Setari aditionale file. Bifați caseta de lângă modul în care doriți să deschideți filele și faceți clic pe OK în partea de jos.

Mergi la pagina principala site-ul

Solutie la problema

În mod implicit, linkurile se deschid în aceeași fereastră în care se află. Pentru ca orice link să se deschidă într-o fereastră nouă, către etichetă ar trebui să adăugați un atribut țintă cu valoarea _blank , așa cum se arată în exemplul 1.

HTML5 IE Cr Op Sa Fx

Legături

Vă rugăm să rețineți că utilizarea atributului țintă strict în HTML4 și XHTML este depreciată, iar codul cu acesta nu va trece validarea. În acest caz, pentru a face un link care să se deschidă într-o fereastră nouă și să mențină corectitudinea codului, numai HTML și CSS nu sunt suficiente, așa că va trebui să apelezi la scripturi. În primul rând, trebuie să evidențiați cumva legăturile care se vor deschide într-o fereastră nouă, de exemplu, cu atributul rel cu valoarea external . Acest atribut descrie pe scurt linkul sau unde se duce. Browserele nu acceptă acest atribut, dar nu este obligatoriu, deoarece vom verifica toate linkurile prin JavaScript (exemplul 2). Aceeași țintă este adăugată la link-urile necesare. Dar, deoarece acest lucru se face programatic, validatorul nu va observa trucul.

XHTML 1.0 CSS 2.1 IE Cr Op Sa Fx

Link în fereastră nouă /* */

Pur și simplu îți va pierde pagina, ceea ce va înrăutăți factorii comportamentali ai blogului tău (profunzimea vizualizării și timpul petrecut pe site).

Cum să inserați linkuri WordPress atunci când publicați o postare

Pentru a preveni ca cititorul să piardă blogul, atunci când creați un link, faceți clic pe caseta de selectare Deschidere într-o fereastră/filă nouă.

Publicarea unui anunț în lista de corespondență Abonare

În comparație cu panoul de administrare WordPress, atunci când publicați un anunț, puteți folosi și opțiunea de a deschide linkul într-o fereastră nouă.

Conform cerințelor administratorilor multor grupuri, o astfel de legătură este necesară. Sunt foarte îngrijorați de faptul că cititorul nu părăsește pagina grupului, rămâne în legătură și, brusc, vrea să citească altceva.

• evidențiați cuvântul sau expresia dorită, faceți clic pe pictograma linkului,
• în fereastra care se deschide, introduceți adresa URL a paginii la care doriți să accesați,
• selectați „În fereastră nouă”
• scrieți un titlu. Acesta va fi evidențiat când treceți cu mouse-ul peste link.
• Faceți clic pe Lipire.

Link HTML într-o fereastră nouă. Cum se deschide

Deschideți fila HTML => inserați textul anunțului => inserați următorul cod

Legătură text - UPDATE fila HTML.

Adresa site-ului dvs. este adresa paginii cu articolul.

Nu uitați să reîmprospătați fila HTML și apoi să publicați anunțul.

P.S. Este simplu? Vă rog să-mi spuneți în comentarii dacă aceste informații v-au ajutat.

ARTICOLE SIMILARE:

PRIETENI, VĂ MULȚUMESC PENTRU DISTRIBUIREA ARTICOLULUI:

6 recenzii pentru „ link HTMLîntr-o fereastră nouă. Cum se deschide? ”

Deci totul este clar!!! Dar am nevoie de meniul principal (antetul de sus), linkul pentru a deschide într-o filă nouă, în WordPress în meniu, când lipiți linkul, nu există nicio casetă de selectare pentru a deschide într-o filă nouă, dar ce pot face? asta nu mi se potriveste, va rog ajutati-va!

• Yana: În panoul de administrare " Aspect" - "Meniul". Clic. Colțul din dreapta sus este „Setări ecran”. Clic. În secțiunea „Afișați proprietățile meniului avansat”, bifați caseta de selectare „Tintă link”. Selectați elementul de meniu dorit pentru a deschide într-o fereastră nouă. Bifați caseta de selectare „Deschideți linkul într-o fereastră/filă nouă”. Salvează meniul și bucură-te de viață)))