Një nga detyrat kryesore të dizajnit të uebit është gjetja e duhur fontet standarde... Shërbimet e ngulitjes së shkronjave si Google Web Fonts ose Typekit u krijuan si një alternativë me synimin për të ofruar diçka të re.
Ato janë shumë të lehta për t'u përdorur. Le të marrim Google Web Fonts si shembull.
Zgjidhni fontin Open Sans, Droid Serif ose Lato. Shkruani kodin dhe ngjisni atë në element dokument HTML... Gjithçka është gati për t'u lidhur me të në CSS! I gjithë procesi zgjati jo më shumë se 60 sekonda. Dhe gjithçka është plotësisht falas.
Çfarë mund të jetë e gabuar?
Disa font mund të mos jenë të disponueshëm për të gjithë. Kjo do të thotë se mund të ketë probleme. Jeni të lumtur që keni zgjedhur një font të bukur për faqen tuaj të internetit dhe vizitori i faqes në internet sheh shkarravitje të shëmtuara.
Kjo nuk do të ndodhë nëse zbatoni një opsion rezervë.
Sa i rëndësishëm është përdorimi i shkronjave të sigurta të uebit?
Çdo pajisje ka grupin e vet të shkronjave të para-instaluara. Cila varet nga sistemi operativ. Problemi është se ka dallime të vogla midis të dyve.
Dhe faqet? Për shembull, ky? Fonti që shihni mund të mos jetë ai që është shkruar fillimisht për sitin.
Çfarë do të thotë? Le të themi se një stilist ka zgjedhur një familje shkronjash me pagesë për sitin. Nëse nuk i keni të instaluara dhe nuk ofrohen nga një shërbim i veçantë ueb, atëherë fonti që shihni është një nga opsionet standarde. Për shembull, Times New Roman.
Prandaj, si në ekranin tuaj teksti mund të duket thjesht i tmerrshëm.
Por fontet standarde për sitinështë i disponueshëm në të gjitha sistemet operative. Ky është një koleksion i vogël i disponueshëm në Windows, Mac, Google, si dhe Unix dhe Linux.
Me këtë koleksion, dizajnerët si dhe pronarët e faqeve mund të specifikojnë se cili font duhet të përdoret si rezervë. Kështu, bëhet e mundur të kontrollohet se si do të duket faqja në pajisje të ndryshme.
Si rikthim, zhvilluesi zgjedh një font që është shumë i ngjashëm me atë origjinal dhe ai do t'i shfaqet përdoruesit.
Le të hedhim një vështrim në një përzgjedhje të më të njohurve fontet standarde HTML.
15 shkronjat më të mira të sigurta të uebit
Arial
Konsiderohet standard në shumicën e rasteve. Fonti më i zakonshëm " sans serif"Ose fontet e copëtuara ( të cilat nuk kanë serife në majat e shkronjave). Shpesh përdoret në Windows për të zëvendësuar karaktere të tjera.
Helvetica
Helvetica është një shpëtim për projektuesit. Kjo font standard në internet funksionon pothuajse gjithmonë ( të paktën si një rrjet sigurie për fontet e tjera).
Times New Roman
Shërben siç bën Arial për sans serifs. Është një nga më të njohurit në pajisjet Windows... Ky është një version i përditësuar i fontit të vjetër Times.
Kohët
CSS font standard The Times është e njohur për shumicën. Shumë njerëz e kujtojnë atë me shkronja të vogla në kolonat e ngushta të gazetave të vjetra. Lloji më i zakonshëm i shtypjes që është bërë traditë.
Korrier i ri
Ngjashëm me Times New Roman dhe përdoret si një variant i klasikëve të vjetër. Konsiderohet gjithashtu një font monospace. Ndryshe nga fontet serif dhe sans serif, të gjithë karakteret e tij kanë të njëjtën gjerësi.
Korrier
Një font i vjetër me gjerësi fikse që përdoret si rezervë në pothuajse të gjitha pajisjet dhe sistemet operative.
Verdana
Verdana me të drejtë mund të konsiderohet një font i vërtetë ueb ( font i vërtetë ueb) falë linjave të thjeshta serif dhe madhësisë së madhe. Shkronjat e tij janë pak të zgjatura, kështu që ato lexohen lehtësisht në ekran.
Gjeorgjia
Shkronja standarde e uebit Georgia është e ngjashme në formë dhe madhësi me fontin Verdana. Karakteret e tij janë më të mëdha se shkronjat e tjera me të njëjtën madhësi. Por është më mirë të mos e përdorni atë së bashku me të tjerët. I njëjti Times New Roman, në krahasim me të, duket si një xhuxh.
Palatino
Palatino daton që nga Rilindja. Pa shaka. Ky është një tjetër font i madh që është i përsosur për ueb. Përdoret zakonisht në tituj dhe reklama.
Garamond
Një tjetër shkronja e vjetër që u shfaq në shekullin e 16-të në Paris. Versioni i tij i ri dhe i përmirësuar përfshihet në grupin standard në shumicën e pajisjeve Windows. Më vonë, ky font u miratua nga sisteme të tjera operative.
Bookman
Bookman ( ose Bookman Old Style) - nje nga fontet më të mira standarde për titujt. Karakteristika e tij është lexueshmëria edhe kur përdoret një madhësi e vogël.
Comic Sans MS
Comic Sans MS është një alternativë argëtuese për fontet serif.
Trebuchet MS
Është një font me temë mesjetare i zhvilluar fillimisht nga Microsoft në mesin e viteve nëntëdhjetë. Është përdorur në Windows XP. Sot përdoret për të hartuar tekstin kryesor.
Arial i zi
Analoge font standard për sitin Arial. Vërtetë, është më i madh, më i trashë dhe më i ashpër. Është i ngjashëm në proporcion me fontin Helvetica. Dhe a është e rëndësishme. Ata munden Zëvendësoni me sukses Helvetica pa pasur nevojë të blini një licencë.
Ndikimi
Një tjetër font i shkëlqyeshëm për t'i bërë titujt të dallohen. Duket mirë me fjali të shkurtra, me pak fjalë, si dhe me fjali të gjata.
Fontet janë një pjesë integrale dhe shumë e rëndësishme e dizajnit të faqes së internetit, duke theksuar individualitetin e saj. Artikulli do të flasë për lidhjen e shkronjave standarde me një faqe në internet, ato quhen gjithashtu fontet e sistemit, dhe në artikullin vijues do të hedhim një vështrim më të afërt në zgjedhjen dhe lidhjen e shkronjave nga Google Fonts me një faqe WordPress.
Sistemi, fontet standarde, të sigurta
Çdo shfletues shfaq vetëm ato fontet që janë të pranishme në sistemin operativ të kompjuterit. Prandaj, ato quhen sistem dhe instalohen si parazgjedhje së bashku me sistemin operativ.
Dhe ato quhen shkronja të sigurta, sepse ato kanë më shumë gjasa të shfaqen në shfletues për shumicën e vizitorëve të faqes.
Por i gjithë problemi është se grupe të ndryshme shkronjash janë instaluar në sisteme të ndryshme operative. Ju mund të shikoni grupet e shkronjave të dhëna së bashku me sistemin operativ në faqet zyrtare të Windows, Mac OS. Dhe në Unix / Linux nuk ka fare standarde.
Në mënyrë që faqja e internetit të shfaqet në përputhje me idenë e projektuesit, në CSS u vendos një veçori e fontit të quajtur font-family.
Prona e font-familjes
Vetia font-family është një familje shkronjash e grupuar sipas kritereve specifike.
Familjet gjenerike:
- serif - fontet me serif në skajet;
- sans-serif - fonts sans serif;
- kursive - shkronjat kursive;
- fantazi - shkronja dekorative;
- monospace - font monospace (me germa të së njëjtës gjerësi).
Kështu, fontet e ngjashme nga sisteme të ndryshme operative thjesht zgjidhen dhe lidhen me faqen e internetit të ndara me presje.
Ja një shembull, vetëm për perceptim vizual. Ne do të kthehemi te ky shembull kur të shikojmë lidhjen e drejtpërdrejtë të shkronjave.
Mjafton të ndiqni logjikën dhe gjithçka do të bëhet shumë e qartë.
Trupi (font-familja: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;)
Le të analizojmë atë që shkruhet:
- OC Windows - Arial;
- OC Mac OS - Helvetica CY;
- OC Unix / Linux - Nimbus Sans L;
- Familja gjenerike është sans-serif.
Të ashtuquajturat shkronja të sigurta
Bazuar në Windows OC, është përpiluar një listë me disa shkronja të sigurta.
- Arial
- Arial i zi
- Comic Sans MS
- Korrier i ri
- Gjeorgjia
- Ndikimi
- Times New Roman
- Trebuchet MS
- Verdana
Të gjitha këto fonte janë instaluar në Mac OS X, Windows dhe shumë përdorues Unix / Linux që kanë të instaluar fontet Core për Ueb.
Për përdoruesit e tjerë, ofrohet një tabelë korrespondence. Ai përmban një përzgjedhje të shkronjave të ngjashme që i përkasin një familjeje specifike.
Tabela e korrespondencës dhe përkatësia e shkronjave në një familje specifike:
| Dritaret | Mac OS | Unix / Linux | Familje stërgjyshore |
|---|---|---|---|
| Arial i zi | Helvetica CY | Nimbus sans l | Sans-serif |
| Arial | Helvetica CY | Nimbus sans l | Sans-serif |
| Comic Sans MS | Monako CY | * (Shikoni më poshtë) | kursive |
| Korrier i ri | * (Shikoni më poshtë) | Nimbus Mono L | Monohapësirë |
| Gjeorgjia | * (Shikoni më poshtë) | Libri shkollor i shekullit L | Serif |
| Ndikimi | Qymyr druri CY | * (Shikoni më poshtë) | Sans-serif |
| Times New Roman | Times CY | Nimbus Roman nr 9 L | Serif |
| Trebuchet MS | Helvetica CY | * (Shikoni më poshtë) | Sans-serif |
| Verdana | Gjenevë CY | DejaVu Sans | Sans-serif |
* Kur lidhni fontet, mund të mbështeteni me siguri në të. Tabela mbështet karaktere cirilike, alfabet rus.
Unë e mora vetë tabelën në këtë artikull.
Lidhja e shkronjave të sistemit me sitin
Ka disa mënyra për të lidhur fontet e sistemit me sitin. Përveç kësaj, ju mund të lidhni fonte të ndryshme me paragrafë të ndryshëm. Aplikoni shkronja të ndryshme për fjalë dhe fraza specifike. Të gjitha këto do të përpiqem ta konsideroj tani.
Pra, le t'i marrim të gjitha në rregull.
Lidhja e shkronjave në një skedar CSS
Nëse keni nevojë të lidheni fontin bazë për të gjithë dokumentin, thjesht duhet të shtoni kodin e mëposhtëm në fletën e stilit:
Trupi (font-familja: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; / * shtoni fontin në të gjithë dokumentin * / madhësia e shkronjave: 16 px; / * vendosni gjithashtu madhësinë e shkronjave * / fontin -pesha: 400; / * vendosni peshën e fontit, ose në vend të 400, vendosni vlerën në normale * /)
Caktimi i një fonti për titujt H1, H2, H3, H4, H5, H6, (këtu është e njëjta gjë, thjesht vendosni vlerën e peshës për të theksuar kokat):
H1, h2, h3, h4, h5, h6 (familja e shkronjave: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; / * shtoni fontin tek titujt * / pesha e shkronjave: 600; / * grup guximi i fontit, ose në vend të 600, vendosni vlerën - bold * /)
Ne caktojmë një font vetëm për paragrafët:
P (Font-familja: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; / * shtoni fontin në paragrafë, mund të aplikohet në listat, divs, format dhe elementë të tjerë * / pesha e shkronjave: normale ; / * vendosni guximin e fontit, ose në vend të 600, vendosni vlerën - bold * / madhësia e shkronjave: 16 px; / * vendosni gjithashtu madhësinë e shkronjave për paragrafët * /)
për të caktoni një font vetëm për një paragraf specifik, ose një bllok, fillimisht duhet t'i caktoni një klasë këtij blloku në dokumentin HTML
Këtu është një paragraf me një font të caktuar
Dhe në tabelën CSS, shkruani kodin e mëposhtëm:
Fonti (familja e shkronjave: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; / * lidhni fontin me paragrafë specifikë, mund të aplikohet në lista individuale, divs, forma dhe elementë të tjerë * / font- pesha: normale; / * vendosni peshën e shkronjave, ose në vend të 600, vendosni vlerën - me shkronja të zeza * / madhësia e shkronjave: 16 px; / * vendosni gjithashtu madhësinë e shkronjave për paragrafët * /)
Tani, çdo etikete - një element html me font të klasës . (quajeni si të doni) do t'i caktohet një font Arial, me peshë normale (400) dhe një madhësi prej 16 pikselësh.
Po kështu, ju mund të caktoni fonte të ndryshme në lista, tabela, div të tëra, fjalë individuale ose fraza.
Lidhja e shkronjave në një dokument HTML
Fontet lidhen drejtpërdrejt me dokumentin HTML në të njëjtën mënyrë si skedari CSS, ndryshimi i vetëm është në sintaksë. Ju mund të lidhni fontet në titullin e dokumentit - midis etiketave
(i ngjashëm me një skedar CSS), ose inline - duke caktuar vetitë drejtpërdrejt te etiketat html.Ne përfshijmë fontet në kokë, midis etiketave
... Për ta bërë këtë, shtoni kodin e mëposhtëm në dokumentin html:
Nuk do ta përsëris veten këtu. Gjithçka është e ngjashme me lidhjen në skedarin CSS.
Fontet inline, direkt tek elementët e faqes. Ketu jane disa shembuj:
Bashkangjitja e fontit në paragrafin
Këtu është një paragraf me tekst
Theksoni një fjalë të veçantë me shkronja të zeza dhe caktoni një font të ndarë nga fonti kryesor
Këtu është një paragraf me tekst, dhe ky është fjalë të theksohen me shkronja të zeza
Këtu është lidhja
Në mënyrë të ngjashme, ne caktojmë fontet për çdo etiketë html.
Sidoqoftë, është më mirë dhe rekomandohet të stiloni elementët përmes një skedari CSS. Së pari, ju duhet vetëm të stiloni CSS-në një herë dhe më pas të caktoni vetëm klasën që dëshironi në HTML. Së dyti, duke shkruar stile inline, krijohet një përmbajtje e kopjuar. Këto veti dhe klasa, me sa duket, janë të indeksuara nga motorët e kërkimit dhe kam dëgjuar se W3C dëshiron të heqë fare inline. Edhe pse ndonjëherë është më e lehtë të shkruash stile në këtë mënyrë.
Gjithçka. Ndiqni përditësimet e faqes, unë jam duke përgatitur një artikull për lidhjen e shkronjave jo standarde dhe origjinale me sitin, në mënyrë që ato të shfaqen saktë në të gjithë shfletuesit. Do t'ju prezantoj gjithashtu me disa shërbime të mira ku mund të zgjidhni fontet jo standarde.
Kur filloni të shtypni paraqitjen, është e nevojshme, në veçanti, të specifikoni fontet e përdorura në faqen në CSS. Shpesh, stilisti shkruan me shkronja të ndryshme jo vetëm tekstin kryesor të faqes, por edhe tituj të ndryshëm, logot, monogramet:
Një projektues i mirë, si një projektues i mirë i paraqitjes, e di se shfletuesi mund të përdorë vetëm fontet që janë instaluar në kompjuterin e përdoruesit për të shfaqur faqen. Kjo do të thotë, fontet mund të ndahen përafërsisht në dy kategori:
- Fontet që do të shfaqen pa probleme për shumicën dërrmuese të përdoruesve.
- Fontet që një grup mjaft i madh përdoruesish nuk i kanë.
Nëse një stilist ka përdorur shkronja të tipit 2 për të krijuar, për shembull, një logo ose tituj të mëdhenj statikë, nuk duhet të hezitoni të përdorni teknikën. Disavantazhi i përdorimit të kësaj teknike është jofleksibiliteti. Në rast të ndryshimeve në tekst, do t'ju duhet të ribërni imazhin dhe të ndryshoni CSS (për shembull, nëse dimensionet e imazhit të ri nuk përputhen me atë të vjetër).
Mund të themi se rreziku i përdorimit të teknikës varet drejtpërdrejt nga probabiliteti i ndryshimit të tekstit. Prandaj, për shembull, teksti i përgjithshëm i faqes nuk mund të bëhet me shkronja jo standarde! Një projektues kompetent nuk do ta bënte kurrë këtë. Dhe nëse një projektues merr ngjyrë jeshile, një dizajner i mirë i paraqitjes është thjesht i detyruar të korrigjojë gabimin e tij - në paraqitje, zëvendësoni këtë font me atë standardin më të ngjashëm.
Por si mund të dalloni fontet e grupit të parë nga i dyti? Është e qartë se nuk mund të mbështeteni në një grup shkronjash të instaluara drejtpërdrejt në kompjuterin tuaj! Le ta kuptojmë.
Fontet standarde
Fontet standarde janë një grup shkronjash që janë instaluar me sistemin operativ. Meqenëse sistemet operative janë të ndryshme, ato kanë grupe të ndryshme shkronjash. Një listë e shkronjave standarde për versione të ndryshme të Windows mund të gjendet, për shembull, në artikullin Shkronjat standarde të Windows dhe një listë e shkronjave standarde të Mac OS në faqen Fonts të dërguara me Mac OS. Sa i përket sistemeve operative Unix / Linux, ato nuk kanë një grup të vetëm shkronjash. Shumë përdorues Linux përdorin grupin e shkronjave DejaVu, veçanërisht në Ubuntu ato janë instaluar si parazgjedhje. Sipas statistikave nga http://www.codestyle.org, shumë përdorues të Unix / Linux kanë të instaluar gjithashtu grupe shkronjash URW, Free dhe të tjerë. Sipas të njëjtave statistika, më shumë se 60% e përdoruesve të Unix / Linux kanë fontet Core për Ueb në kompjuterët e tyre, të cilat deri në vitin 2002 ishin zyrtarisht në dispozicion për shkarkim falas në faqen e internetit të Microsoft.
Në mënyrë që faqja të shfaqet ashtu siç e ka menduar projektuesi, në çdo sistem operativ, është e mundur të specifikohen disa fonte në vetinë CSS, të ndara me presje.
Kjo veçori specifikon një listë me prioritet të emrave të familjeve të shkronjave dhe/ose emrave gjenerikë të familjeve. Sipas specifikimit CSS2, ekzistojnë dy lloje të emrave të familjeve të shkronjave:
- Emri i familjes së fontit të zgjedhur. Për shembull "Times new Roman", "Arial" dhe të tjerë. Emrat e familjeve të shkronjave që përmbajnë hapësira duhet të vendosen në thonjëza. Nëse thonjëzat mungojnë, çdo karakter hapësirë para dhe pas emrit të fontit shpërfillet dhe çdo sekuencë e hapësirave brenda emrit të fontit konvertohet në një hapësirë të vetme.
- Familje gjenerike (e përbashkët). Specifikimi përcakton familjet e mëposhtme gjenerike:
- serif - fontet me serif në skajet;
- sans-serif - fonts sans serif;
- kursive - shkronjat kursive;
- fantazi - shkronja dekorative;
- monospace - font monospace (me germa të së njëjtës gjerësi).
Kështu, për dizajnin, merret një font standard nga OS Windows, një i ngjashëm për Mac OS dhe Unix / Linux është zgjedhur për të, një familje e zakonshme e shkronjave është vendosur dhe gati.
Por jo gjithçka është kaq e thjeshtë. Le të gërmojmë më në detaje.
Gjetja e shkronjave të sigurta në ueb
Interneti është njohur historikisht si fontet "të sigurta" të ueb-it. Një font i sigurt është një font që është standard në të gjitha sistemet operative. Meqenëse mund të ëndërroni vetëm për një gjendje të tillë, atëherë nuk ka shkronja absolutisht të sigurta!
Disa fonte mund të quhen të sigurta me disa paralajmërime.
Baza për përcaktimin e shkronjave "të sigurta" ishin fontet e sistemit operativ më të zakonshëm Windows, të cilët përdoren edhe në sisteme të tjera operative. Një shembull i një përdorimi të tillë janë fontet Core të përmendura tashmë për paketën e shkronjave në internet, të cilat, sipas statistikave, janë shkarkuar nga shumë përdorues të Unix / Linux.
Kjo paketë përfshin fontet e mëposhtme: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Të gjithë ata mbështesin alfabetin cirilik, i cili është i rëndësishëm për Runet.
Seti i shkronjave të përfshira në dorëzimin standard të Mac OS X (ky OS është më i zakonshmi në mesin e përdoruesve të Mac OS) përfshin të gjitha fontet në fontet kryesore për grupin e uebit.
Kështu, bazuar në fontet Windows të përdorura në sisteme të tjera operative, u formua lista e mëposhtme e të ashtuquajturave shkronja "të sigurta" të Uebit:
- Arial
- Arial i zi
- Comic Sans MS
- Korrier i ri
- Gjeorgjia
- Ndikimi
- Times New Roman
- Trebuchet MS
- Verdana
Fonti Webdings përmban një grup ikonash, kështu që nuk mund të përdoret për përmbajtje. Andale Mono nuk përdoret gjerësisht sepse nuk është i përshtatshëm për leximin e përditshëm të ekranit dhe jo të gjithë përdoruesit e Windows e kanë atë.
Të gjitha këto fonte janë të disponueshme për çdo përdorues të Windows, përdorues të Mac OS X dhe shumicën dërrmuese të përdoruesve të Unix / Linux (d.m.th. ata që kanë të instaluar fontet Core për Ueb).
Por çfarë ndodh me pjesën tjetër? Në fund të fundit, ju dëshironi që ideja e stilistit të shihet nga sa më shumë përdorues të jetë e mundur!
Lexoni për këtë në pjesën e dytë të botimit.
Kjo listë përmban fontet që janë të zakonshme për të gjitha sistemet aktuale operative Windows (në fakt, duke filluar me Windows 98) dhe ekuivalentët e tyre në Mac OS. Këto fonte nganjëherë referohen si "fonte të sigurta për shfletuesin" ( fontet e sigurta të shfletuesit). Kjo është një referencë e vogël që përdor kur bëj faqe në internet dhe mendoj se do të jetë e dobishme edhe për ju.Nëse jeni i ri në dizajnimin e uebit, mund të jeni duke menduar diçka të tillë si, “Pse duhet të kufizohem në një grup kaq të vogël shkronjash? Unë kam një koleksion të madh të shkronjave të shkëlqyera!" Fakti është se shfletuesi i vizitorit mund të shfaqë vetëm ato fontet që janë instaluar në të tijën sistemi operativ ( përafërsisht. përkthyesi: në kohën e tanishme është tashmë e mundur të përdoret pothuajse çdo font në hartimin e faqeve dhe pronës së saj të re @ font-face; megjithatë, jo të gjithë shfletuesit e mbështesin ende këtë funksion), që do të thotë se secili vizitori në faqen tuaj duhet të jetë pronari i shkronjave që keni zgjedhur. Prandaj, duhet të përdorni vetëm fontet që janë të disponueshme në secilin sistem operativ. Për fat të mirë, CSS ka një pronë @ font-familje që e bën këtë detyrë më të lehtë.
Listë
| @ Vlera e fontit-familjare | Dritaret | Mac | Familja |
|---|---|---|---|
| Arial, Helvetica, sans-serif | Arial | Arial, Helvetica | sans-serif |
| "Arial Black", Gadget, sans-serif | Arial i zi | Arial Black, Gadget | sans-serif |
| "Comic Sans MS", kursive | Comic Sans MS | Comic Sans MS 5 | kursive |
| "Courier New", Courier, monospace | Korrier i ri | Courier New, Courier 6 | monohapësirë |
| Gjeorgjia, serif | Gjeorgjia 1 | Gjeorgjia | serif |
| Ndikim, Qymyr druri, sans-serif | Ndikimi | Ndikimi 5, Qymyr druri 6 | sans-serif |
| "Lucida Console", Monako, monospace | Lucida Console | Monako 5 | monohapësirë |
| "Lucida Sans Unicode", "Lucida Grande", sans-serif | Lucida Sans Unicode | Lucida grande | sans-serif |
| "Palatino Linotype", "Libri Antiqua", Palatino, serif | Palatino Linotype, Libri Antiqua 3 | Palatino 6 | serif |
| Tahoma, Gjenevë, sans-serif | Tahoma | Gjenevës | sans-serif |
| "Times New Roman", Times, serif | Times New Roman | Kohët | serif |
| "Trebuchet MS", Helvetica, sans-serif | Trebuchet MS 1 | Helvetica | sans-serif |
| Verdana, Gjenevë, sans-serif | Verdana | Verdana, Gjenevë | sans-serif |
| Simboli | Simboli 2 | Simboli 2 | - |
| Uebsajtet | Uebsajtet 2 | Uebsajtet 2 | - |
| Wingdings, "Zapf Dingbats" | Krahët 2 | Zapf Dingbats 2 | - |
| "MS Sans Serif", Gjenevë, sans-serif | MS Sans Serif 4 | Gjenevës | sans-serif |
| "MS Serif", "New York", serif | MS Serif 4 | Nju Jork 6 | serif |
1 Shkronjat Georgia dhe Trebuchet MS dërgohen me Windows 2000 / XP dhe përfshihen në paketën e shkronjave IE (dhe në të vërtetë vijnë me shumë aplikacione të Microsoft), kështu që ato instalohen në shumë kompjuterë Windows 98.
2 Fontet e simboleve shfaqen vetëm në Internet Explorer, në shfletues të tjerë zakonisht zëvendësohen me një font standard (edhe pse, për shembull, fonti Symbol shfaqet në Opera dhe Webdings në Safari).
3 Libri Antiqua është pothuajse identik me Palatino Linotype; Palatino Linotype dërgohet me Windows 2000 / XP dhe Book Antiqua dërgohet me Windows 98.
4 Vini re se këto fonte nuk janë fonte TrueType, por bitmap, kështu që mund të duken keq në disa madhësi (ato janë krijuar për t'u shfaqur në 8, 10, 12, 14, 18 dhe 24 pt me 96 DPI).
5 Këto fonte funksionojnë vetëm në stilin standard në Safari, por nuk funksionojnë me shkronja të theksuara ose të pjerrëta. Comic Sans MS funksionon gjithashtu me shkronja të zeza, por jo të pjerrëta. Shfletuesit e tjerë Mac duket se i imitojnë vetitë e mungesës së shkronjave (falë Christian Fecteau për këshillën).
6 Këto fonte instalohen në Mac vetëm gjatë instalimit Classic
Pamjet e ekranit
- Mac OS X 10.4.8, Firefox 2.0, ClearType i aktivizuar (faleminderit Juris Vecvanags për pamjen e ekranit)
- Mac OS X 10.4.4, Firefox 1.5, ClearType i aktivizuar
- Mac OS X 10.4.11, Safari 3.0.4, ClearType i aktivizuar (faleminderit Nolan Gladius për pamjen e ekranit)
- Mac OS X 10.4.4, Safari 2.0.3, ClearType i aktivizuar (faleminderit Eric Zavesky për pamjen e ekranit)
- Windows Vista, Internet Explorer 7, ClearType Enabled
- Windows Vista, Firefox 2.0, ClearType i aktivizuar (faleminderit Michiel Bijl për pamjen e ekranit)
Kur filloni të shtypni paraqitjen, është e nevojshme, në veçanti, të specifikoni fontet e përdorura në faqen në CSS. Shpesh, stilisti shkruan me shkronja të ndryshme jo vetëm tekstin kryesor të faqes, por edhe tituj të ndryshëm, logot, monogramet.
Një projektues i mirë, si një projektues i mirë i paraqitjes, e di se shfletuesi mund të përdorë vetëm fontet që janë instaluar në kompjuterin e përdoruesit për të shfaqur faqen. Kjo do të thotë, fontet mund të ndahen përafërsisht në dy kategori:
- Fontet që do të shfaqen pa probleme për shumicën dërrmuese të përdoruesve.
- Fontet që një grup mjaft i madh përdoruesish nuk i kanë.
Nëse një projektues ka përdorur fontet e tipit 2 për të krijuar, për shembull, një logo ose tituj të mëdhenj statikë, mund të ndiheni të lirë të përdorni metodën e zëvendësimit të tekstit me një foto. Disavantazhi i përdorimit të kësaj teknike është jofleksibiliteti. Në rast të ndryshimeve në tekst, do t'ju duhet të ribërni imazhin dhe të ndryshoni CSS (për shembull, nëse dimensionet e imazhit të ri nuk përputhen me atë të vjetër).
Mund të themi se rreziku i përdorimit të teknikës varet drejtpërdrejt nga probabiliteti i ndryshimit të tekstit. Prandaj, për shembull, teksti i përgjithshëm i faqes nuk mund të bëhet me shkronja jo standarde! Një projektues kompetent nuk do ta bënte kurrë këtë. Dhe nëse një projektues merr ngjyrë jeshile, një dizajner i mirë i paraqitjes është thjesht i detyruar të korrigjojë gabimin e tij - në paraqitje, zëvendësoni këtë font me atë standardin më të ngjashëm.
Por si mund të dalloni fontet e grupit të parë nga i dyti? Është e qartë se nuk mund të mbështeteni në një grup shkronjash të instaluara drejtpërdrejt në kompjuterin tuaj! Le ta kuptojmë.
Fontet standarde
Fontet standarde janë një grup shkronjash që janë instaluar me sistemin operativ. Meqenëse sistemet operative janë të ndryshme, ato kanë grupe të ndryshme shkronjash. Një listë e shkronjave standarde për versione të ndryshme të Windows mund të gjendet, për shembull, në artikullin Fontet standarde të Windows dhe një listë e shkronjave standarde të Mac OS në faqen Fonts të dërguara me Mac OS. Sa i përket sistemeve operative Unix / Linux, ato nuk kanë një grup të vetëm shkronjash. Shumë përdorues Linux përdorin grupin e shkronjave DejaVu, veçanërisht në Ubuntu ato janë instaluar si parazgjedhje. Sipas statistikave nga http://www.codestyle.org, shumë përdorues të Unix / Linux kanë të instaluar gjithashtu grupe shkronjash URW, Free dhe të tjerë. Sipas të njëjtave statistika, më shumë se 60% e përdoruesve të Unix / Linux kanë fontet Core për Ueb në kompjuterët e tyre, të cilat deri në vitin 2002 ishin zyrtarisht në dispozicion për shkarkim falas në faqen e internetit të Microsoft.
Në mënyrë që faqja të shfaqet ashtu siç ka menduar projektuesi, në çdo sistem operativ, është e mundur të specifikohen disa fonte në pronën CSS font-family, të ndara me presje.
Kjo veçori specifikon një listë me prioritet të emrave të familjeve të shkronjave dhe/ose emrave gjenerikë të familjeve. Sipas specifikimit CSS2, ekzistojnë dy lloje të emrave të familjeve të shkronjave:
- Emri i familjes së fontit të zgjedhur. Për shembull "Times new Roman", "Arial" dhe të tjerë. Emrat e familjeve të shkronjave që përmbajnë hapësira duhet të vendosen në thonjëza. Nëse thonjëzat mungojnë, çdo karakter hapësirë para dhe pas emrit të fontit shpërfillet dhe çdo sekuencë e hapësirave brenda emrit të fontit konvertohet në një hapësirë të vetme.
- Familje gjenerike (e përbashkët). Specifikimi përcakton familjet e mëposhtme gjenerike:
- serif - fontet me serif në skajet;
- sans-serif - fonts sans serif;
- kursive - shkronjat kursive;
- fantazi - shkronja dekorative;
- monospace - font monospace (me germa të së njëjtës gjerësi).
Emrat gjenerikë të familjes janë fjalë kyçe dhe nuk kanë nevojë të citohen.
Kështu, për dizajnin, merret një font standard nga OS Windows, një i ngjashëm për Mac OS dhe Unix / Linux është zgjedhur për të, një familje e zakonshme e shkronjave është vendosur dhe gati.
Por jo gjithçka është kaq e thjeshtë. Le të gërmojmë më në detaje.
Gjetja e shkronjave të sigurta në ueb
Interneti është njohur historikisht si fontet "të sigurta" të ueb-it. Një font i sigurt është një font që është standard në të gjitha sistemet operative. Meqenëse mund të ëndërroni vetëm për një gjendje të tillë, nuk ka shkronja absolutisht të sigurta!
Disa fonte mund të quhen të sigurta me disa paralajmërime.
Baza për përcaktimin e shkronjave "të sigurta" ishin fontet e sistemit operativ më të zakonshëm Windows, të cilët përdoren edhe në sisteme të tjera operative. Një shembull i një përdorimi të tillë janë fontet Core të përmendura tashmë për paketën e shkronjave në internet, të cilat, sipas statistikave, janë shkarkuar nga shumë përdorues të Unix / Linux.
Kjo paketë përfshin fontet e mëposhtme: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Të gjithë ata mbështesin alfabetin cirilik, i cili është i rëndësishëm për Runet.
Seti i shkronjave të përfshira në dorëzimin standard të Mac OS X (ky OS është më i zakonshmi në mesin e përdoruesve të Mac OS) përfshin të gjitha fontet në fontet kryesore për grupin e uebit.
Kështu, bazuar në fontet Windows të përdorura në sisteme të tjera operative, u formua lista e mëposhtme e të ashtuquajturave shkronja "të sigurta" të Uebit:
- Arial
- Arial i zi
- Comic Sans MS
- Korrier i ri
- Gjeorgjia
- Ndikimi
- Times New Roman
- Trebuchet MS
- Verdana
Fonti Webdings përmban një grup ikonash, kështu që nuk mund të përdoret për përmbajtje. Andale Mono nuk përdoret gjerësisht sepse nuk është i përshtatshëm për leximin e përditshëm të ekranit dhe jo të gjithë përdoruesit e Windows e kanë atë.
Të gjitha këto fonte janë të disponueshme për çdo përdorues të Windows, përdorues të Mac OS X dhe shumicën dërrmuese të përdoruesve të Unix / Linux (d.m.th. ata që kanë të instaluar fontet Core për Ueb).
Por çfarë ndodh me pjesën tjetër? Në fund të fundit, ju dëshironi që ideja e stilistit të shihet nga sa më shumë përdorues të jetë e mundur!
Shkronjat cirilike
Një veçori specifike e Runet është problemi me kodimin e faqeve dhe mbështetjen për cirilik në shkronja. Për të shmangur problemet me kodimet e ndryshme të karaktereve, njerëzit e zgjuar dolën me Unicode, i cili ju lejon të kombinoni karaktere nga disa gjuhë në një font. Kështu, për faqet në gjuhën ruse, duhet të përdorni vetëm fontet Unicode që mbështesin alfabetin cirilik.
Më poshtë është një tabelë e korrespondencës së shkronjave.
| Dritaret | Mac OS | Unix / Linux | Familje stërgjyshore |
|---|---|---|---|
| Arial i zi | Helvetica CY | Nimbus sans l | Sans-serif |
| Arial | Helvetica CY | Nimbus sans l | Sans-serif |
| Comic Sans MS | Monako CY | * (Shikoni më poshtë) | kursive |
| Korrier i ri | * (Shikoni më poshtë) | Nimbus Mono L | Monohapësirë |
| Gjeorgjia | * (Shikoni më poshtë) | Libri shkollor i shekullit L | Serif |
| Ndikimi | Qymyr druri CY | * (Shikoni më poshtë) | Sans-serif |
| Times New Roman | Times CY | Nimbus Roman nr 9 L | Serif |
| Trebuchet MS | Helvetica CY | * (Shikoni më poshtë) | Sans-serif |
| Verdana | Gjenevë CY | DejaVu Sans | Sans-serif |
* në kolonën përballë fontit do të thotë që sistemi operativ nuk ka ekuivalente cirilike amtare të Windows. Por në të njëjtën kohë, ekziston një probabilitet i lartë që vetë ky font të instalohet drejtpërdrejt në sistemin operativ.
Për shembull, nëse teksti kryesor i paraqitjes është Arial, ne e gjejmë këtë font në tabelë dhe shkruajmë rreshtin përkatës në CSS:
trupi (font-familja: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;)
trupi ( font - familja: Arial, "Helvetica CY", "Nimbus Sans L", sans - serif; |
Kjo hyrje do të thotë që nëse përdoruesi ka fontin Arial (dhe të gjithë përdoruesit e Windows dhe të gjithë përdoruesit e Mac OS X e kanë atë), atëherë faqja do të shfaqet në këtë font. Nëse përdoruesi nuk e ka këtë font, atëherë faqja e përdoruesit rusisht-folës të Mac OS 9 do të shfaqet me saktësi në fontin standard të sistemit Helvetica CY, dhe për përdoruesin Unix / Linux do të shfaqet në Nimbus Sans L font, i cili është instaluar nga 90% e përdoruesve të Unix / Linux. Nëse përdoruesi i Unix / Linux është brenda 10% që nuk e ka këtë font, atëherë faqja do të shfaqet në fontin e paracaktuar serif për shfletimin e ueb-it.
Përveç faktit që tabela merr parasysh fontet Unix / Linux, ekziston edhe një ikonë e çuditshme CY pas Helvetica-s së zakonshme. Le të kuptojmë se çfarë është!
Para lëshimit të Mac OS X, kjo linjë kishte kuptimin e mëposhtëm: për përdoruesit e Windows, ne shfaqim faqen Arial, për përdoruesit e Mac OS 9, në fontin standard Helvetica, dhe pjesa tjetër e tyre shikon faqen me sistemin sans- fonti serif i vendosur si parazgjedhje në shfletues. Por përsëri, një nuancë e rëndësishme! Shkronja standarde Mac OS 9 Helvetica nuk ka cirilik! Për faqen në gjuhën ruse, kjo do të thoshte si vijon: për përdoruesit e Windows, ne shfaqim faqen Arial, për përdoruesit e Mac OS 9 - në fontin standard Helvetica, i cili shfaq informacione të palexueshme, dhe pjesa tjetër shihni faqen me sistemin sans- fonti serif i vendosur si parazgjedhje në shfletues.
Për shfaqjen e saktë të këtij grupi për përdoruesit e Mac OS 9 në vend të Helvetica jo të cirilizuar, ka kuptim të specifikoni të njëjtin font standard Mac OS 9 Helvetica CY që përmban cirilik.
Leximi i sundimtarëve ka ndryshuar që nga lëshimi i Mac OS X. Një font standard i zakonshëm është specifikuar tani për Windows / Mac OS X. Dhe nëse duam që përdoruesit e Mac OS 9 të jenë në gjendje të shohin idenë e projektuesit, ata duhet të shkruajnë një font që përmban cirilik në vijën e fontit.
Kështu, ndërsa nuk ka fonte të sigurta, ka sundimtarë të sigurt të shkronjave. Ata quhen gjithashtu Skemat e shkronjave CSS... Përveç shkronjave standarde Windows / Mac OS X, këto rreshta mund të përfshijnë gjithashtu fontet ekuivalente nga grupi standard Mac OS 9 (i cili nuk përmban fontet "të sigurta" si parazgjedhje) dhe fontet e zakonshme Unix / Linux.
Çdo shtypës herët a vonë has në një moment kur një projektues përdor një font në një plan urbanistik që nuk përfshihet në listën e atyre "të sigurt"; Por kjo nuk është një arsye për të dhënë alarmin! Për shembull, dizajnerët shpesh përdorin fontin Tahoma në paraqitjet e tyre, i cili nuk përfshihet në këtë listë. Një linjë fonti e ndërtuar siç duhet hap mundësinë e përdorimit jo vetëm të Tahoma, por edhe të shkronjave të tjera. Gjithnjë e më shumë projektues po përfitojnë nga kjo mundësi dhe një projektues kompetent i paraqitjes duhet të jetë i vetëdijshëm për këtë.
Më poshtë është një tabelë shtesë e shkronjave që nuk përfshihen në listën e "të sigurt", por mund të përdoren në paraqitjet.
| Dritaret | Mac OS | Familje stërgjyshore |
|---|---|---|
| Lucida Console | Monako | Monohapësirë |
| Lucida Sans Unicode | Lucida grande | Sans-serif |
| Tahoma | Gjenevë CY | Sans-serif |
Dhe nëse pa alfabetin cirilik?
Për tekstet në gjuhën angleze, tabelat e mësipërme kanë një pamje paksa të ndryshme.
| Dritaret | Mac OS | Unix / Linux | Familje stërgjyshore |
|---|---|---|---|
| Arial i zi | Vegël | Nimbus sans l | Sans-serif |
| Arial | Helvetica | Nimbus sans l | Sans-serif |
| Comic Sans MS | Monako | TSCu_Comic | kursive |
| Korrier i ri | Korrier | Nimbus Mono L | Monohapësirë |
| Gjeorgjia | * (Shikoni më poshtë) | Libri shkollor i shekullit L | Serif |
| Ndikimi | qymyr druri | Rekha | Sans-serif |
| Times New Roman | Kohët | Nimbus Roman nr 9 L | Serif |
| Trebuchet MS | Helvetica | Garuda | Sans-serif |
| Verdana | Gjenevës | DejaVu Sans | Sans-serif |
Për fontet Arial, Courier New dhe Times New Roman, është më mirë të specifikoni fillimisht fontin për Unix / Linux, dhe më pas për Mac OS kur kompozoni vizoret. Kjo është për shkak të disa lakimeve të grupit të shkronjave bazë Linux X11.
Fontet që nuk janë në listën "të sigurt", por që mund të përdoren në paraqitje, përcaktohen më së miri me grupet e shkronjave CSS bazuar në këtë tabelë.
| Dritaret | Mac OS | Unix / Linux | Familje stërgjyshore |
|---|---|---|---|
| Lucida Console | Monako | - | Monohapësirë |
| Lucida Sans Unicode | Lucida grande | Garuda | Sans-serif |
| Linotipi Palatino | Palatino | Garuda ** | Sans-serif |
| Tahoma | Gjenevës | Kalimati | Sans-serif |
Një vizë në kutinë Unix / Linux tregon se përdoruesit e këtyre sistemeve operative ka të ngjarë të shohin fontin e paracaktuar për shfaqjen e faqeve në faqe.
** Në këtë linjë, ka kuptim të vendoset Garuda përpara Palatino (shih shpjegimin më lart).
Konkluzione:
- Nuk ka fonte plotësisht të sigurta. Shkronjat e mëposhtme mund të quhen të sigurta me kusht:
- Arial
- Arial i zi
- Comic Sans MS
- Korrier i ri
- Gjeorgjia
- Ndikimi
- Times New Roman
- Trebuchet MS
- Verdana
- Rafte të sigurta CSS që marrin parasysh mbështetjen për cirilik në shkronja mund të gjenden në artikull.
- Nëse mbështetja cirilike nuk është e rëndësishme në faqe, përdorni rafte CSS nga artikulli.
