Változó szélességű oldal készitése + webes betütipusok
Sziasztok,
Szivességből 1 portfolió oldalt készitek az egyik ismerősömnek
A régi oldallal is az volt a probléma, hogy adott fix szélességre készült , és 1 nagyobb felbontású monitoron nagyon bénán nézett ki az oldal
(valamilyen javascript-es megoldással lekérdezte a kliens képernyő szélességét és ahhoz próbálta igazitani a többi dolog pl a képek szélességét, ami érthető módon nem sikerült)
Szóval a kérdésem az lenne, hogy a adott látványterv-ből /PSD-ből hogyan lehet manapság változó szélességű oldalt késziteni?
Kezdetnek elég lenne, ha mondjuk 1024x768-ban, és 1920x1080 ban is hasonlóképpen jól nézne ki az oldal
Azt nyilván nem lehetséges, hogy minden képet a webes verzióban nem képre cserélünk, mert akárhogy is csürjük csavarjuk a dolgokat a logó pl mindig kép lesz(csak a modern design-ok esetében nem img html elem, hanem css háttérkép pl)
Vagy pl az eddigi képes menük lecserélhetőek sima szöveges menükre , feltéve ha a font-face css css tulajdonságot/property-t támogatja a böngésző
Eddig az egész webes betütipusok kérdés-körrel úgy voltam, hogy minnek, hiszen úgysem "minden böngésző" támogatja
De most ennek a projectnek a kapcsán használhatnék webes betütipusokat
Tudnátok tudnátok esetleg webes betütipusok témakörében releváns szakirodalmat ajánlani? ( mit miért hogyan)
Gondolok itt olyanokra mint:
- font-face css property
- milyen betütipusok használhatóak egyáltalán a weben?
- hogyan lehet 1 már meglévő betütipusból (a psd-hez használt true type fontból pl) a weben is használható betütipust késziteni?
Tudnátok ebben a 2 témakörben (változó szélességű oldal , és webes betütipusok ) releváns szakirodalmat (akár online akár nyomtatott formában ) ajánlani?
Előre is köszönöm a hozzászolásokat :)
■ Szivességből 1 portfolió oldalt készitek az egyik ismerősömnek
A régi oldallal is az volt a probléma, hogy adott fix szélességre készült , és 1 nagyobb felbontású monitoron nagyon bénán nézett ki az oldal
(valamilyen javascript-es megoldással lekérdezte a kliens képernyő szélességét és ahhoz próbálta igazitani a többi dolog pl a képek szélességét, ami érthető módon nem sikerült)
Szóval a kérdésem az lenne, hogy a adott látványterv-ből /PSD-ből hogyan lehet manapság változó szélességű oldalt késziteni?
Kezdetnek elég lenne, ha mondjuk 1024x768-ban, és 1920x1080 ban is hasonlóképpen jól nézne ki az oldal
Azt nyilván nem lehetséges, hogy minden képet a webes verzióban nem képre cserélünk, mert akárhogy is csürjük csavarjuk a dolgokat a logó pl mindig kép lesz(csak a modern design-ok esetében nem img html elem, hanem css háttérkép pl)
Vagy pl az eddigi képes menük lecserélhetőek sima szöveges menükre , feltéve ha a font-face css css tulajdonságot/property-t támogatja a böngésző
Eddig az egész webes betütipusok kérdés-körrel úgy voltam, hogy minnek, hiszen úgysem "minden böngésző" támogatja
De most ennek a projectnek a kapcsán használhatnék webes betütipusokat
Tudnátok tudnátok esetleg webes betütipusok témakörében releváns szakirodalmat ajánlani? ( mit miért hogyan)
Gondolok itt olyanokra mint:
- font-face css property
- milyen betütipusok használhatóak egyáltalán a weben?
- hogyan lehet 1 már meglévő betütipusból (a psd-hez használt true type fontból pl) a weben is használható betütipust késziteni?
Tudnátok ebben a 2 témakörben (változó szélességű oldal , és webes betütipusok ) releváns szakirodalmat (akár online akár nyomtatott formában ) ajánlani?
Előre is köszönöm a hozzászolásokat :)
Úgy gondolom, hogy a
A fontok témájához irodalmat nem tudok ajánlani, némi tapasztalattal viszont rendelkezem: a Font Squirrel segítségével szoktam a webes fontokat elkészíteni, viszont tudni kell, hogy nem enged meg mindent feltölteni (pl. a Century Gothicot próbáltam pár napja). Ezen felül le kell ellenőrizni, hogy az általunk használt betűkészletben benne vannak-e az ékezetes betűk, mert ha nincsenek, akkor a böngésző egy másik fontból fogja ezeket helyettesíteni, ami elég csúnya szokott lenni. A Font Squirrelben ügyelni kell arra, hogy a teljes betűkészletet konvertálja, alapértelmezésben csak a latin ABC betűi kerülnek bele.
Weben használható betűtípusok. Azt javasolnám egyébként, hogy ha nem muszáj, ne használjunk speciális betűtípust, főleg úgy ne, ha mobil eszközökön is fogják az oldalunkat nézni, valamint akkor se, ha nem rendelkezünk olyan tudással, hogy hol milyen betűtípust lehet használni.
Kezdetnek elég lenne, ha
Responsive / Adaptive dizájn témakörére keress rá, de íme egy pár hasznos cikk kiindulásnak:
A
@font-face-t minden mai böngésző támogatja, még a régebbi IE verziók is (IE 4+, Fx 3.5+, Chrome 4+, Opera 10+, Safari 3.1+). És tényleg a legegyszerűbb a FontSquirell-t használni, hogy a betűtípust web kompatibilissé tedd. Persze ne feledkezz el a fontok licencéről sem, nehogy bajba kerülj.When can I use SVG Fonts?