márc14
A probléma tehát adott, az előző bejegyzésben megkezdett fluid CSS elrendezés megalkotása zátonyra futott. A viewport felosztása ugyan problémamentesen lezajlott, egyszerűen kívánt arányban %-os szélességértéket kaptak a leendő tartalmat tároló blokkok, azonban a fluid CSS elrendezés felépítéséhez szükséges további elemek: margók,keretek,behúzások beillesztésekor probléma lépett fel. Egyrészt előbbi elemeknek vagy nem adhatunk meg %-os értéket : border, vagy megadhatunk ugyan, de akkor a dizájnolhatóságot csapjuk agyon (én még nem kaptam változó margin,border,padding tulajdonságokkal rendelkező psd-t dizájnertől), ha viszont fix érték(ke)et állítunk be: kinyírjuk a fluid CSS-elrendezést (lásd előző bejegyzés), szükség volt tehát a nagy ötletre, amit kedvenc CSS-könyvünk le is szállít számunkra.
tovább … »
márc9
Ebben a bejegyzésben ‘from scratch’, nulláról kezdünk el felépíteni egy fluid-alkalmazkodó css elrendezést ill. megismerkedünk azzal a mintával, ami egyáltalán lehetővé teszi, hogy egy ilyen elrendezés ne csak elméletben, hanem a gyakorlatban is tervezhető (design) / kivitelezhető (sitebuild) legyen.
Aki esetleg hiányolná a pragmatizmust, a gyakorlatba való átültethetőséget a mintából, tekintse meg a netvibes kezdőlapot, és kövesse szemmel, a google vagy youtube widget-et megjelenítésében beálló változásokat, miközben átméretezi a webböngészőt, ergo a fluid layout tervezési elvei, túl az előző bejegyzésben szerepelteken:
“különböző eszközök megjelenítési képességeihez automatikusan adaptálódik (hozzáigazul), megjelenítési képességek alatt azok (esetlegesen egymástól eltérő) betűtípusait, megjelenítési dimenzióit (szélesség x magasság) ill. nagyítási lehetőségeit értem”
közvetlenül a gyakorlatban kamatoztathatóak : widget gyártáskor. Másrészt megtekinthető hova lesz a téma kifuttatva, azaz hova érkezünk meg pár hónap múlva, előbbi dizájn minden egyes elemére és annak megvalósítására, a későbbiekben egy-egy jegyzet elejéig, vissza fogunk még térni.
tovább … »
márc1
A pozicionálások témakört befejezvén, az elkövetkező bejegyzésekben a CSS elrendezésekkel, és azok holdudvarával fogunk részletekbemenőleg foglalkozni.
Elöljáróban és zárójelben, amennyiben a ‘fluid layouts’-ra egy megfelelő vagy már bevezetett/elfogadott magyar terminus-technicus-t bekommentálna valaki azt előre is megköszönném, egyelőre az alkalmazkodó elrendezést fogom használni – ami elég faramuciul hangzik – ilyenkor mindenki gondoljon a ‘fluid layouts’-ra …
Alkalmazkodónak mondhatunk egy elrendezést akkor, ha a következő alapfeltételeknek képes megfelelni :
- különböző eszközök megjelenítési képességeihez automatikusan adaptálódik (hozzáigazul), megjelenítési képességek alatt azok (esetlegesen egymástól eltérő) betűtípusait, megjelenítési dimenzióit (szélesség x magasság) ill. nagyítási lehetőségeit értem
- akadálymentesség
- modularitás
- könnyű testre szabhatóság
- nyílt forrású javascript könyvtárak használatán alapultság
előbbi tulajdonságok mindegyikéről bővebben lesz még szó a későbbiekben, ebben a bejegyzésben ‘csupán’ megtekintjük azt az alapot, amit a későbbiek során kibővítünk ill. építkezni fogunk.
tovább … »