Versiune imprimabilă a paginii html. Tipăriți stiluri CSS despre care am uitat

Abr:după ( conținut: " (" attr(titlu) ")"; )

10. Forțați imprimarea în fundal

Antet ( -webkit-print-color-adjust: exact; print-color-adjust: exact; )

11. Interogări media

Ecran @media și (lățime minimă: 48 em) ( /* numai ecran */ )
De ce este așa? Chestia este că regulile CSS se aplică numai dacă valoarea lățimii minime este 48em și dacă tipul media este screen . Dacă scăpăm de cuvântul cheie ecran din această interogare media, atunci acesta va fi limitat doar de valoarea lățimii min.

@media (lățime minimă: 48 em) ( /* toate tipurile de media */ )

12. Imprimarea cardurilor

Hartă ( lățime: 400 px; înălțime: 300 px; imagine de fundal: url("http://maps.googleapis.com/maps/api/staticmap?center=Wien+Floridsdorf&zoom=13&scale=false&size=400x300&maptype=roadmap&format=png&format=png&visuale_re) "); -webkit-print-color-adjust: exact; print-color-adjust: exact; )

13. coduri QR

14. Despre tipărirea paginilor neoptimizate

Etichete:

• css
• sigiliu
• dezvoltare web

Aceasta este eliminarea erorilor numite „conținut duplicat”. Conținut duplicat înseamnă că conținut similar apare în mai multe locuri (URL-uri) de pe Internet. Drept urmare, motoarele de căutare nu știu ce adresă URL să afișeze în rezultatele căutării. Acest lucru poate afecta clasamentul paginii web a site-ului. Problema devine mai serioasă atunci când oamenii încep să se refere la versiuni diferite conţinut. În acest articol, vom explica cauzele conținutului duplicat și vom găsi soluții pentru fiecare dintre ele.

Imaginează-ți că te afli la o răscruce de drumuri și semnele rutiere indică două directii diferite spre aceeași destinație finală: pe ce drum ar trebui să mergi? Și dacă mergi în direcția „cel mai proastă”, capătul căii se poate schimba ușor. Ca cititor, nu-ți pasă: ai primit conținutul pe care îl urmăreai. Dar sistem de căutare ar trebui să aleagă pe care să afișeze în rezultatele căutării, deoarece nu ar trebui să afișeze același conținut de două ori.

Să presupunem că articolul tău despre „cuvânt cheie x” apare la http://www.example.com/keyword-x/ și exact același conținut apare la http://www.example.com/article-category/keyword-x / . Acest lucru se întâmplă în mulți sisteme moderne managementul conținutului (CMS). Articolul dvs. a fost preluat de mai mulți bloggeri, unii trimit la prima adresă URL, alții la a doua adresă URL. Acest conținut duplicat este o problemă pentru site-ul dvs., deoarece linkurile fac publicitate la diferite adrese URL în același timp. Dacă toate ar trimite către aceeași adresă URL, clasarea dvs. în top 10 pentru „cuvânt cheie x” ar fi mult mai mare.

1. Motive pentru conținut duplicat

Există o mulțime de motive care provoacă conținut duplicat. Cele mai multe dintre acestea sunt tehnice: nu se întâmplă adesea ca o persoană să decidă să posteze același conținut în două locuri diferite fără a identifica sursa originală. Cu toate acestea, motivele tehnice sunt numeroase. Acest lucru se datorează în principal pentru că dezvoltatorii nu gândesc ca un browser sau un utilizator, darămite motorul de căutare web, ei gândesc ca un dezvoltator. Ce zici de articolul de mai sus care apare la http://www.example.com/keyword-x/ și http://www.example.com/article-category/keyword-x/? Dacă întrebați dezvoltatorul, acesta vă va spune că este singură.

Să aruncăm o privire la cum să descoperim conținut duplicat pe site-ul tău web, să explicăm cauza și să facem tot posibilul pentru a-l remedia.

1.1 Înțelegerea greșită a sensului URL-urilor

Dezvoltatorul vorbește doar o altă limbă. Puteți vedea că întregul site este probabil susținut de un sistem de baze de date. Există un singur articol în această bază de date, software site-ul web vă permite pur și simplu să găsiți același articol în baza de date prin mai multe adrese URL. Acest lucru se datorează faptului că, în ochii dezvoltatorului, identificatorul unic pentru acest articol este ID-ul articolului care se află în baza de date, nu URL-ul. Cu toate acestea, pentru un motor de căutare, o adresă URL este un identificator unic pentru o bucată de conținut. Dacă explicați acest lucru unui dezvoltator, el va vedea problema. Și după ce ai citit acest articol, îi poți oferi imediat soluția ei.

1.2. ID-urile sesiunii vizitatorilor

Când urmăriți vizitatorii și le oferiți opțiunea de a salva articolele pe care doresc să le cumpere în coșul de cumpărături, le oferiți o sesiune. Sesiunea este practic Poveste scurta ceea ce a făcut un vizitator pe site-ul dvs. și poate conține lucruri precum articole într-un coș de cumpărături. Pentru a salva sesiunea unui vizitator care se deplasează de la o pagină la alta, trebuie să stocați undeva un identificator unic pentru această sesiune, așa-numitul identificator de sesiune. Cea mai comună soluție este să o faci cu folosind cookie-uri. Cu toate acestea, motoarele de căutare nu stochează de obicei cookie-uri.

Unele sisteme revin la utilizarea ID-urilor de sesiune în adresa URL. Aceasta înseamnă că fiecare link intern de pe site primește acest ID de sesiune atașat la adresa URL și, deoarece acest ID de sesiune este unic pentru acea sesiune, creează o nouă adresă URL și, astfel, conținut duplicat.

1.3. Parametrii URL utilizați pentru urmărire și sortare

Un alt motiv pentru conținut duplicat este utilizarea parametrilor URL care nu modifică conținutul paginii, cum ar fi în urmărirea link-urilor. Vedeți, http://www.example.com/keyword-x/ și http://www.example.com/keyword-x/?source=rss nu sunt de fapt aceeași adresă URL pentru un motor de căutare . Acesta din urmă vă poate permite să urmăriți din ce surse au venit vizitatorii dvs., dar vă poate îngreuna și clasarea. Un efect secundar foarte nedorit!

Nu este doar urmărirea parametrilor, desigur, este vorba despre fiecare parametru pe care îl puteți adăuga la o adresă URL care nu modifică o parte vitală de conținut. Această setare este pentru „resortarea în funcție de setul de produse” sau „afișarea unei bare laterale diferite”, toate acestea provocând conținut duplicat.

1.4. Analiza și sindicarea conținutului

Cele mai multe dintre motivele pentru conținut duplicat sunt propriile dvs. sau, macar, din vina site-ului dvs., atunci când alte site-uri web vă folosesc conținutul cu sau fără acordul dvs. Nu întotdeauna se leagă înapoi la articolul dvs. original și astfel motorul de căutare nu îl „prinde” și trebuie să se ocupe de încă o versiune a aceluiași articol. Cu cât site-ul tău devine mai popular, cu atât îl vei răzui din ce în ce mai des, extinzând din ce în ce mai mult această problemă.

1.5. Ordinea parametrilor

Un alt motiv comun este că CMS-ul nu folosește URL-uri frumoase și curate, ci mai degrabă URL-uri precum /id=1&cat=2, unde ID se referă la un articol și cat se referă la o categorie. URL /? Cat=2 & id=1 vor produce aceleași rezultate pe majoritatea motoarelor de site, dar sunt de fapt destul de diferite pentru un motor de căutare.

1.6. Paginarea comentariilor

În WordPress-ul meu preferat, precum și în alte sisteme, este posibil să paginați comentarii. Acest lucru duce la conținut duplicat la adresa URL a articolului și la adresa URL a articolului + /comment-page-1/, /comment-page-2/ etc.

1.7. versiune tipărită

Dacă sistemul dvs. de management al conținutului creează pagini imprimabile și le legați la paginile dvs. de articole, în cele mai multe cazuri Google le va găsi dacă nu le blocați în mod special. Ce versiune va afișa Google? Cel care este încărcat cu reclame și conținut periferic sau cel care conține doar articolul tău?

1.8. cu WWW și fără WWW

Una dintre situațiile vechi: un domeniu cu și fără WWW, conținut duplicat atunci când ambele versiuni ale site-ului tău sunt disponibile. O altă situație mai puțin frecventă care există: http și https conținut duplicat atunci când același conținut este trimis la ambele adrese.

2. Soluție conceptuală: URL „Canonic”.

După cum sa definit mai sus, atunci când mai multe adrese URL duc la același conținut, aceasta este o problemă, dar poate fi rezolvată. O persoană care lucrează pentru o publicație va putea, de obicei, să vă spună cu ușurință care ar trebui să fie adresa URL „corectă” pentru un anumit articol. Dar amuzant este că, uneori, când întrebi trei persoane din aceeași companie, ei dau trei răspunsuri diferite...

Aceasta este o problemă care necesită o soluție obligatorie în astfel de cazuri, deoarece poate exista o singură adresă finală (URL). Această adresă URL „corectă” trebuie să fie determinată de motorul de căutare ca adresă URL canonică.

Notă ironică

Canonic este un termen derivat din tradiția romano-catolică, în care o listă de cărți sacre a fost creată și acceptată ca fiind autentică. Ele au fost numite evangheliile canonice ale Noului Testament. Iar ironia este aceasta: Bisericii Romano-Catolice i-au luat aproximativ 300 de ani și numeroase bătălii pentru a veni cu această listă canonică și au ajuns să aleagă 4 versiuni ale aceleiași povești...

3. Cum să găsiți conținut duplicat?

Este posibil să nu știți dacă aveți conținut duplicat pe site-ul dvs. Iată câteva modalități de a afla:

3.1. Instrumente Google pentru webmasteri

Instrumentul Google pentru webmasteri este un instrument excelent pentru identificarea conținutului duplicat. Dacă accesați Instrumente pentru webmasteri Google pentru site-ul dvs., consultați secțiunea Aspect de căutare din Optimizare HTML și veți vedea următoarele:

Problema este că dacă ai un articol care arată ca un articol despre „cuvântul cheie X” și apare în două categorii, titlurile pot fi diferite. Ele pot fi, de exemplu, „ Cuvânt cheie X – Categoria X – Exemplu de site” și „Cuvânt cheie X – Categoria Y – Exemplu de site”. Google nu va alege aceste titluri ca duplicate, dar le puteți găsi printr-o căutare.

3.2. Căutați titluri sau fragmente

Sunt câteva operatori de căutare, care sunt foarte utile pentru cazuri ca acesta. Dacă doriți să găsiți toate adresele URL de pe site-ul dvs. care conțin articolul dvs. cu cuvântul cheie X, introduceți următoarea expresie de căutare pe Google:

Site:example.com intitle:„Cuvânt cheie X”

Google vă va afișa apoi toate paginile example.com care conțin acel cuvânt cheie. Cu cât reflectați mai specific această parte a titlului, cu atât va fi mai ușor să eliminați conținutul duplicat. Puteți utiliza aceeași metodă pentru a identifica conținutul duplicat de pe internet. Să presupunem că titlul complet al articolului dvs. a fost „Cuvânt cheie X – De ce este cool”, ați căutat după: Titlu: „Cuvânt cheie X – De ce este cool”

Google vă va oferi toate site-urile care se potrivesc cu acel titlu. Uneori, merită să căutați una sau două propoziții complete din articolul dvs., deoarece unii analizatori pot schimba titlul.

4. Soluții practice pentru conținut duplicat

Odată ce ați decis care URL este adresa URL canonică pentru conținutul dvs., trebuie să începeți procesul de canonizare. Acest lucru înseamnă practic că ar trebui să spunem motorului de căutare despre versiunea canonică a paginii și să-i lăsăm să o găsească cât mai curând posibil.

Există patru metode de rezolvare, în ordinea preferințelor:

1. Nu creați conținut duplicat;
2. Redirecționează conținutul duplicat către adresa URL canonică;
3. Adăugați un element de link canonic la pagina duplicată;
4. Adăuga link-uri HTML de la pagina duplicată la pagina canonică.

4.1. Cum să eviți conținutul duplicat?

Unele dintre erorile de conținut duplicat de mai sus au remedieri foarte simple:

• Folosiți ID-uri de sesiune în adresele URL? Ele pot fi deseori pur și simplu dezactivate în setările sistemului.
• Aveți pagini duplicat de imprimat? Acest lucru este complet inutil: trebuie doar să utilizați o foaie de stil de imprimare.
• Folosești paginarea comentariilor în WordPress? Această funcție ar trebui pur și simplu dezactivată (în setările „discuție”) pe 99% dintre site-uri.
• Parametrii URL în ordine diferită? Spune-i programatorului să creeze un script care să permită folosirea parametrilor în aceeași ordine.
• Probleme la urmărirea linkurilor? În cele mai multe cazuri, puteți utiliza urmărirea campaniilor bazată pe hash în loc de urmărirea campaniilor bazată pe parametri.
• Două versiuni ale site-ului cu WWW și fără WWW? Alegeți o opțiune și rămâneți cu ea, redirecționând una către cealaltă. S-ar putea, de asemenea, să preferați instrumente Google pentru webmasteri, dar va trebui să revendicați ambele versiuni ale numelui de domeniu.

Dacă problema dvs. nu este atât de ușor de rezolvat, ar putea merita să faceți tot posibilul pentru a evita conținutul duplicat. Acest lucru este cu siguranță cea mai bună soluție Probleme.

4.2. 301 redirecționare conținut duplicat

În unele cazuri, nu este posibil să împiedicați complet sistemul pe care îl utilizați să genereze adrese URL proaste pentru conținut, dar uneori acestea pot fi redirecționate. Țineți cont de acest lucru când vorbiți cu dezvoltatorii. De asemenea, dacă scăpați de unele probleme recurente de conținut, asigurați-vă că redirecționați orice adrese URL vechi de conținut duplicat către adresele URL canonice respective.

4.3. Folosind link-uri rel="canonical".

Uneori, nu există nicio modalitate de a scăpa de versiunea duplicată a unui articol, dar știți că este adresa URL greșită. Pentru această problemă specială, motoarele de căutare au introdus elementul link canonic. Este situat in sectiune site-ul dvs. și arată astfel:

href="http://example.com/wordpress/seo-

În capitolul link canonic, postați adresa URL canonică corectă pentru articolul dvs. Când Google (sau orice alt motor de căutare care îl acceptă) găsește acest element de link, efectuează o redirecționare automată soft: transmite cea mai mare parte din valoarea linkului colectată de această pagină către pagina dvs. canonică.

Acest proces este puțin mai lent decât redirecționarea 301 menționată de John Mueller de la Google, ceea ce puteți face, ceea ce ar fi mult de preferat.

4.4. Reveniți la conținutul original

Dacă nu reușiți să efectuați oricare dintre cele de mai sus, poate fi din cauză că nu dețineți controlul asupra secțiunii site-ul care afișează conținutul dvs., adăugarea unui link către articolul original în partea de sus sau de jos a articolului este întotdeauna o idee bună. Acesta ar putea fi ceea ce doriți să faceți în fluxul dvs. RSS: adăugați un link către un articol din acesta. Dacă Google întâlnește mai multe linkuri care indică articolul dvs., își va da seama în curând că aceasta este versiunea canonică reală a articolului.

5. Concluzie: conținutul duplicat poate fi remediat și trebuie remediat!

Conținutul duplicat este peste tot. Acesta este un proces pe care trebuie să-l monitorizați în mod constant. Dacă totul este corectat la timp, atunci recompensa va fi numeroasă. Ta continut de calitate poate crește vertiginos în clasamente doar scăpând de conținutul duplicat de pe site-ul dvs. Desigur, dacă aveți nevoie de ajutor pentru identificarea acestor probleme, pentru a ajuta dezvoltatorii dvs. să găsească soluții pentru a remedia problemele de conținut duplicat sau chiar pentru a remedia aceste probleme pentru dvs., puteți oricând să comandați

Cândva, era doar standardul pentru a crea un link sau, pentru a fi mai precis, un buton etichetat „Versiune tipărită”. Sunt necesare pentru a face o imprimare pe hârtie. Versiunea tipărită conține toate informatie necesara, dar îi lipsesc elementele interactive: butoane, formulare și altele asemenea.

Aceasta înseamnă că cineva folosește manual sau automat un script
a luat documentul original și, după ce a eliminat tot ce era de prisos, a creat o copie a acestuia,
mai convenabil pentru imprimare. Poate lucrare similară a trebuit sa
ai de-a face si cu tine.

Soluție - Imprimați foi de stil

Una dintre marile caracteristici ale CSS este capacitatea de a
crearea de foi de stil care vizează o varietate de dispozitive
ieșire. Suntem obișnuiți să creăm foi de stil pentru a afișa pagini
ecran, dar nu suntem încă obișnuiți să ne gândim la alte mijloace de afișare. ȘI,
după cum confirmă referințele „versiune imprimabilă”, despre tipărirea documentului, noi
ne gândim doar să reprezentăm documentul într-un mod diferit.

Dar acum nu avem de ce să ne temem, acum de creat versiune tipărită
document, avem nevoie doar de un document bine structurat și
foaie de stil imprimabilă!

Astăzi puteți lua orice document (X)HTML și îl puteți pregăti pentru
imprimarea cu foi de stil fără a atinge marcajul. Și aici înăuntru
problemele legate de crearea și sincronizarea a două versiuni sunt de domeniul trecutului
document, unul pentru ecran și unul pentru imprimare. Și ce este cel mai mult
Vestea bună este că este ușor de făcut.

Ocolirea bug-ului elementului plutitor

Browserele familiei Gecko, precum Netscape 6.x sau Mozilla au
problemă cu imprimarea elementelor plutitoare lungi (elemente plutitoare lungi).
Dacă elementul plutitor a dispărut de pe pagina tipărită, atunci
partea rămasă dispare complet, neapărând niciodată pe următoarea
pagină.

Dacă site-ul dvs. este ca „A List Apart”, adică articolele din el sunt
într-un bloc plutitor mare, asta înseamnă că cititorii când
imprimarea va primi doar prima pagină a articolului.

Soluția, așa cum v-ați putea aștepta, este să suprascrieți proprietatea
„plutitor” la blocul cu text înainte de imprimare. Pe scurt, pentru toată lumea
elementele plutitoare stabilesc regula de stil „float: none”.
Făcând acest lucru, veți readuce toate elementele plutitoare la normal și
documentul se va imprima conform așteptărilor - pagina după
pagina până la sfârșit.

Deci, asta i-am sugerat lui Zeldman pentru ALA și cum
de îndată ce a făcut asta, problema tipăririi a dispărut. Pentru browserele familiei
Gecko, această eroare încă nu este remediată (la momentul scrierii
articol), dar totuși poate fi ocolit cu ușurință prin metoda propusă mai sus.

Să pornim la drum

Mai jos este o foaie de stil „printabilă” care „A List Apart” a rezolvat problema tipăririi elementelor plutitoare:

#meniu ( afișare: niciunul; ) #wrapper, #conținut ( lățime: automat; chenar: 0; marjă: 0 5%; umplutură: 0; float: niciun !important; )

Un început bun. Foaia de stil este eliminată complet meniul din dreapta Asa de,
că nu este tipărită și stabilește chenarele și indentările pentru
conținutul articolului astfel încât textul de pe orice pagină
distanțate uniform de la o margine la cealaltă a zonei imprimabile.

Problema, așa cum am văzut-o, a fost că prea multe stiluri concepute pentru ecran și-au făcut loc în procesul de imprimare.

Privind conținutul etichetei articole noi pe site-ul ALA, găsim (în mijlocul umpluturii) următoarele rânduri:

Avem un fișier de foaie de stil, print.css , care este obișnuit
dispozitive de imprimare„print” a fost specificat de valoarea atributului „media”.
Fișierul foaie de stil nucss2.css, care este importat cu
@import va folosi constructii pentru a-l ascunde de Navigator 4.x
la afișarea paginii pe orice dispozitiv de ieșire (atribut
media="toate"). Poate fi un afișaj, imprimantă, proiector, sintetizator
vorbire și așa mai departe. După ce ne-am împrăștiat, am putea scrie în foaia de stil pentru
directivă de tipărire pentru culoare de fundal pagini și specificați fonturile în
pixeli.

Articol înrudit: Set de bază pluginuri pentru WordPress

Va fi un mare dezastru? Nu, dar majoritatea browserelor web
implicit, nu tipăriți fundalul paginii, ci dimensiunile specificate în pixeli
fonturile care sunt atât de potrivite pentru afișarea pe ecran nu sunt așa
util pentru imprimare.

Deci, să îmbunătățim puțin foaia de stil de imprimare și să rezolvăm alte câteva probleme de aspect.

Albirea fundalurilor

Mai multe culori sunt folosite pentru elementele din meniul din dreapta.
Dar din moment ce am ascuns meniul la imprimare, nu trebuie să schimbăm nimic.
Acest lucru ne scutește imediat de o posibilă durere de cap.

Deoarece imprimantele nu imprimă în alb, vom face fundalul paginii
alb. De asemenea, trebuie să eliminați toate imagini de fundal, care
folosit pentru a afișa pagina.

Dacă apelăm la proprietatea de fundal pentru a ajuta, decidem dintr-o lovitură
ambele probleme. Pentru a face soluția mai flexibilă, setați elementul
corp fundal alb, și lasă elementele „wrapper” și „conținut” să aibă
fundal transparent (și astfel prin ele culoare alba
corp):

corp ( fundal: alb; ) #meniu ( afișare: niciunul; ) #wrapper, #conținut ( lățime: automat; marjă: 0 5%; umplutură: 0; chenar: 0; float: niciun !important; culoare: negru; fundal : transparent; )

Setarea culorii prim plan(culoarea fontului) nu a fost absolut
necesar, dar este mai bine să nu uităm de asta. Deci acum avem două
element „non-floating” (#wrapper, #content) cu fundal transparent, și
pagină cu fundal alb.

S-ar putea să vă îngrijoreze modul în care Navigator 4.x gestionează valoarea
„transparent”, dar nas mai înalt: NN4.x acordă atenție doar tabelelor
stiluri care au atributul „media” setat la „ecran”. Exact ca
în cazul directivei @import, foile noastre de stil imprimabile sunt întotdeauna
ascuns de ochii orbi ai Navigatorului 4. Deci, nu e nimic de vorbit
îngrijorare.

Tipăriți dimensiunea fontului

Foaia de stil generală setează dimensiunea fontului la 11 pixeli. Foarte
selecție proastă de imprimare. Familia de fonturi în sine este Georgia în primul rând,
și apoi serif - excelent pentru imprimare, deoarece fonturile serif
de obicei arată mai bine pe hârtie. Doar dimensiunea trebuie schimbată.
font. Ca aceasta:

corp ( fundal: alb; dimensiunea fontului: 12 pt; )

„Așteaptă!” probabil exclami. - "Punctele sunt rele!"

Ei bine, da, a spus asta și a avut dreptate - nu poți
setați dimensiunea fontului în puncte. La imprimarea aceleiași aplicații de paragrafe
are același sens ca acum multe decenii. Din moment ce ne pregătim
foaia de stil pentru imprimare, apoi setați dimensiunea fontului pentru „corp” la 12
punctele vor fi corecte și naturale.

Desigur, puteți seta orice dimensiune doriți, totuși
Fontul de 12 puncte este cel mai comun. Și din moment ce în tabelul general
stiluri, dimensiunile tuturor celorlalte elemente ale paginii sunt date relativ la
dimensiune în elementul „corp”, treaba noastră este făcută.

Marginalia

Reguli de stil existente stabilite pentru marginile din stânga și din dreapta
(marjele) dimensiunea elementelor de wrap și conținut la 5%. Asta înseamnă că pe ambele
părțile laterale ale articolului vor fi „ loc gol”, și fiecare astfel de „spațiu gol” va fi
să fie de 10% din lățimea zonei imprimabile. Aceasta este o consecință a faptului că blocul
textul articolului „conținut” se află în interiorul blocului de încadrare „înveliș” și
fiecare dintre ele are marje de 5% în stânga şi laturile drepte.

Articol înrudit: Yandex.Școala de webmasteri

Foaia de stil generală originală specifică o indentație dreaptă de 15% (completare)
pentru blocul „conținut”. Granițele ne-au dat deja 10%, așa că trebuie
adăugați încă 5%. Acest lucru este destul de ușor de făcut:

div#content ( margine-stânga: 10%; )

Într-o altă soluție, s-ar putea lăsa marginile (marja) înăuntru
în repaus și adăugați 5% la liniuța din stânga (padding). De la blocul „conținut”.
nu are fundal vizibil, am obține același rezultat.

Din păcate, unele browsere au probleme cu adecvat
gestionarea indentărilor (padding), deci mutați elemente în jurul paginii
mai bine cu ajutorul chenarelor (marja).

Imprimați linkuri

A fost o întrebare dificilă - ce să faci cu hyperlink-urile? Evident pe
este posibil să nu fie la fel de utile în tipărire precum sunt pe un monitor, dar este adesea important
dați un indiciu la ce se refereau în original. Deci asta sunt
inventat:

a:link, a:visited (culoare: #520; fundal: transparent; greutate font: bold; text-decor: subliniat; )

Acest lucru conferă legăturilor o culoare suficient de întunecată pentru a fi aproape
negru la imprimare alb-negru rămânând în același timp roșu închis
la imprimarea color. Font aldine iar sublinierea asigură că
linkul va ieși în evidență în textul tipărit.

Într-un browser care acceptă pe deplin specificația CSS2, putem
afișează URL-urile link-urilor după ele, făcându-le astfel o favoare
care va fi o imprimare și un browser la îndemână. Mai jos este regula,
care se aplică numai blocului „conținut” și, prin urmare, adreselor URL
alte link-uri nu sunt tipărite:

#content a:link:after, #content a:visited:after ( conținut: " (" attr(href) ") "; dimensiunea fontului: 90%; )

Încercați acest lucru în browserele bazate pe Gecko - Mozilla sau Netscape
6.x. Pe tipărit, după fiecare link, veți vedea între paranteze cele aferente
URL la acesta.

Browserele care nu înțeleg această regulă de stil nu vor avea niciuna
efecte nedorite - linkurile vor fi în continuare roșu închis,
subliniat și îndrăzneț. Imediat după textul linkului nu va fi afișat
URL-ul lor asociat, asta-i tot.

Rețineți că spațiile înainte și după paranteze sunt
parte a regulii de stil - nu uitați de spații, așa cum ar trebui
să fie incluse în document.

Există o problemă estetică cu această nouă regulă. Faptul,
că indică introducerea textului în document a valorii atributului
href.

Privind codul oricărei pagini de pe site-ul web A List Apart, ne facem rapid
rețineți că există multe așa-numite „referințe relative” ale formei
„/issues/144”. Acestea vor fi introduse în document așa cum sunt.
există, dar aș dori să fie URL-uri complete.

În astfel de cazuri, CSS3 ne poate ajuta. Orice selector de atribute,
folosind operatorul ^= selectează elemente pe baza începutului acestora
valorile atributelor. Deci putem alege orice atribut href,
începând cu o bară oblică și inserați acolo text pentru înlocuire
valoarea existentă atribut.

#content a:after ( conținut: " (//www.alistapart.com" attr(href) ") "; )

Această regulă convertește toate valorile de tip „/issues/144/” în
„//www.alistapart.com/issues/144/”. Această regulă nu va ajuta
cazul adreselor URL relative care nu încep cu o bară oblică, dar
Din fericire, ALA nu folosește acest tip de legătură.

ATENŢIE! IMPORTANT! După cum sa menționat, selectorul formei ^=
se referă la selectorii de specificații CSS3. Validator CSS de
consorțiul W3 poate testa doar conformitatea cu specificațiile
CSS1 și CSS2. Fără a înțelege selectorul specific CSS3, validatorul o va face
raportați o eroare chiar dacă selectorul nu intră în conflict
recomandari de specificatii.

Decorarea partea de sus a paginii

Privind din nou la foaia de stil finală, I
am constatat că nu prea îmi place „antetul” paginii. Treaba era mai degrabă
nu în antetul în sine, ci chiar în „sublinierea” numelui site-ului. Acest
sublinierea, desigur, s-a terminat acolo unde se termina poza
antet. Mi-a trecut brusc prin minte că ar fi frumos să întind asta
o subliniere pe toată lățimea paginii.