div és css mániám

**Harder** · 2007-05-25, 13:12

Nem olyan nagy ördöngősség, több megoldása is van.

Először is döntsd el, hogy mely böngészőkre szeretnél elsősorban optimalizálni és azokat vizsgáld meg. Persze az ideális eset az, hogy minden létező böngészőn tökéletesen ugyanúgy néz ki a lapod, de azért át kell gondolni, hogy megéri-e mondjuk azért szívni órákat, napokat, egy 0.002%-os arányú böngészőre is optimalizált legyen a lap.

Amire biztos kell: Internet Explorer, Firefox
Amire szintén kell(het, esetfüggő): régebbi IE-k, Safari, Opera, linuxos böngészők stb.

Szívem szerint az Opera-t is az IE és FF mellé tenném (én oda szoktam annak ellenére is, hogy nálam 2-3%-ot jelent), de elég alacsony a használtsága a stat-ok szerint.

Nálam ez pl. így néz ki: böngésző statisztika - 1 hónapra

Nyilván ha egy mac-eseknek szóló blogot indítok, akkor a Safari lesz az első, ha linux-os témájú lapom van akkor annak Firefox és a többi linuxos böngésző kerül előtérbe, IE meg nagyon hátracsúszik.

Hasznos lehet még olvasni pl. a Kirowski által kiadott TechStat 2007 c. PDF-et (357kb)

Aztán ha ezek megvannak, több lehetőség is van.

1.) Olyan kódot írsz, ami böngészőfüggetlen. Ehhez érdemes megismerni és megjegyezni, hogy mely böngésző mit hogy értelmez, kezel. Ekkor nem használsz javascriptet, hacket, feltételeket. Mondjuk hozzáteszem, hogy ez a legnehezebb megoldás, viszont a legidőtállóbb és a későbbiekben a legkönnyebben fejleszthető, karbantartható.

* Hogy tisztába légy vele, mely böngésző mit értelmez: Will the browser apply the rule(s)?
* Milyen CSS változások vannak az IE7-ben? Details on our CSS changes for IE7

2.) Optimalizálsz Firefox-ra, aztán az IE hülyeségeit kiegyengeted egy másik CSS-ben, amire mutató hivatkozást egy feltételes szabállyal adsz meg. Ehhez egyszer már írtam anyagot (Böngészőfüggő CSS - feltételek segítségével), amit elolvasva akár tovább is mehetsz.

Nem egy rossz megoldás egyébként, sokan szeretik, tisztán tartja a kódot és egyszerű átlátni, hogy mi mire van hatással.

3.) Lehet alkalmazni css-ben is hack-eket (vagy filterek). Ezek 1-1 böngésző hibáját kihasználó hack-ek, amikor is a böngésző egyik hibáját egy másikkal javítasz.

Ehhez tartozó leírásokat szintén találsz a lapomon, illetve ajánlott elolvasni:
* CSS hack-ek menedzselése
* CSS hacks lista (quirksmode)
* CSS hacks lista (css-discuss)
* css hacks leírás

Használom ha kell, de próbálom ezek számát minimalizálni. A lényeg: ésszel kell vele élni.

4.) A problémák nagy részét át lehet hidalni a IE7 javascripttel, amit Dean Edwards-nak köszönhetünk (IE7 compatibility list)

Bevallom, szemezgettem már vele hogy kipróbálom, de mivel első pontban vázolt megoldás híve vagyok (és nem igazán van rá szükségem), nem került rá sor. Viszont ismerősök nagyon pozitívan nyilatkoztak róla, áldották az úriember nevét.

Hátránya, hogy javascripthez között a lapod helyes megjelenése (js-t meg ugye ki is lehet kapcsolni).

**tillz** · 2007-05-25, 13:41

Köszönöm! Nagyon profi, összeszedett anyag ismét!

**bugyli** · 2007-05-25, 15:57

"Amire biztos kell: Internet Explorer, Firefox
Amire szintén kell(het, esetfüggő): régebbi IE-k, Safari, Opera, linuxos böngészők stb."

Nem értem ezt a firefoxot... én még nem tudtam használni 2percnél tovább. Szerintem egy gagyiság az egész észrevehetően az operát akarják utánozni az egyediséggel és hogy kizárták a megboldogult mozzillát amit most én is használok igaz már SeaMonkey néven de még mindig ez a böngésző felel meg legjobban a w3c-nek. A legjobbann ő olvassa a lapot és ő tudja megjeleníteni kifogástalanul. Az opera gyorsaságát meg soha nem éri utol senki és semmi.

A firefox a google reklámoknak köszönheti sikerét, nem a teljesítményének.

Az opera és a seamonkey veri a mezőnyt. Ezt én mondom

**Harder** · 2007-05-25, 16:20

Nincs értelme, hogy flame-be menjen át a topic, úgyhogy részemről inkább nem kommentálom ezt a bejegyzést. Maradjunk inkább a témánál.

**Csicso** · 2007-05-25, 23:08

bugyli eredeti hozzászólása

A firefox a google reklámoknak köszönheti sikerét, nem a teljesítményének.

Az opera és a seamonkey veri a mezőnyt. Ezt én mondom

Én se akarom szétoffolni a topicot, de használtam mind3 böngészőt. Az Operából akkor lett elegem, mikor pl. az iwiw-et egyszerűen nem nyitotta meg. Meg még kb. 30 weboldalt egyszerűen nem hozott be. Szóval ezzel konkrétan ki is esett a mezőnyből, bármilyen szép, jó és gyors is. Szóval maradt az IE, és a FF, a FF gyorsabb, biztonságosabb, és sokkal többet tud, mint az IE. az IE egyetlen előnye hogy az új 7-es verzió nagyon "széppé teszi" a weboldalakat, öröm rájuk nézni, simuló betűtípusok, stb.

**huncyrus** · 2007-05-26, 11:04

szép kódcsomag

a böngésző körhöz inkább én sem szólok hozzá (bár csak annyit, hogy ha nem érted és szereted a firefoxot, akkor miért használod a seamonkey-t? amikor mindkettőnek ugyanaza mozilla az alapja... ezért is a teljes neve a firefoxnak h mozilla-firefox ... részemről ennyivel zárom

**bugyli** · 2007-05-26, 20:50

huncyrus eredeti hozzászólása

szép kódcsomag

a böngésző körhöz inkább én sem szólok hozzá (bár csak annyit, hogy ha nem érted és szereted a firefoxot, akkor miért használod a seamonkey-t?

Azért mert a SeaMonkey még tartalmazza az eredeti mozzilla komponenseket. Html szerkesztő, levelező, böngésző, irc, címjegyzék.

A firefoxal az a bajom, hogy rámentek a "csináljunk egy csakböngészőt mint az opera és reklámozzuk mindehol". Opera reklámot még nem láttam sehol...

**garrotter** · 2007-05-26, 21:45

Flame nélkül, de az opera sem csak böngésző. Van benne e-mail kliens (címjegyzékkel) és irc is. Html szerkesztő az nincs.

G.

**mastinaro** · 2007-06-09, 18:01

Tehát leegyszerűsítve azt mondjátok, hogy írjuk meg a css-t az FF-hoz és utánna írjunk egy css-t az IE-hez is, vagy amelyik böngészőben nem úgy jelenik meg mint ahogy szeretnénk, vagy csak a hibás megjelenésre írjunk egy új css leírást. Te jó ég! Minnél többet tudok meg annál butább vagyok.