jún
25
Írta: Tupacko, 2008-06-25, (Blogolok, Design, Hírek)

A kommenteket figyelembe véve elkészítettem az oldal felső részének a javított változatát. A betűtípusokat kicseréltem Verdanára, a színekkel is eljátszodtam, illetve a fejléc szövegét és zsúfoltságát is próbáltam korrigálni. A tartalmi résznél megváltozott a fejléc háttere (narancssárgáról kékre) és a fejléc szövegének színe (erdész zöldről mély kékre). Ez nem tudom mennyire jó így, de van akinek így tetszik. Az oldallécben is van változás. A partnerek gombjai kerültek alaposabb kidolgozásra, illetve a Photoshop szótár kapott új reklámfelületet.

WebPillangó 2 fejléc design


Elolvasom a teljes bejegyzést »



máj
22
Írta: Tupacko, 2008-05-22, (Blogolok, CSS, Design, Web)

A Typetester egy nagyon hasznosnak bizonyuló web 2.0 alkalmazás, ami nagyban felgyorsíthatja a weboldalkészítés művészetét. Dióhéjban, a Typetesterben három oszlopban, valós időben, grafikus felhasználói felületen kereszűl, változtathatjuk a szöveg kinézetét: betütípus, méretek, elő és háttér színek, stb. A formázások eredményét egy CSSként kaphatod vissza, mindössze egy kattintásba kerül.

A Typetester
Elolvasom a teljes bejegyzést »



máj
04
Írta: Tupacko, 2008-05-04, ((X)HTML, CSS, JavaScript, Web)

Biztos vagyok benne, hogy már többetek fejében megfordult a gondolat, hogy bizonyos elemeknek új méretet kellene adni az ablak újraméretezése esetén. Nem nagy szó, CSS. Igen ám, de mi van abban az esetben, hogyha egyes elemek, mint például egy űrlap elemei dinamikusan fix egy százalékban kifejezett értékből kivont képpontokban meghatározott mérték szélességű.

Példa

Az oldal dinamikusan váltja a szélességét az ablakmérettől függően. Ráadásként, az oldal tartalmi része dinamikus szélességű, míg az oldaléc fix értékkel rendelkezik. A tartalmi részben van egy űrlap, ami dinamikusan kell változtassa a méretét a tartalmi rész szélességétől függően.
Elolvasom a teljes bejegyzést »



ápr
20
Írta: Tupacko, 2008-04-20, (Adatbázis kezelés, Photoshop, Programozás, Web)

Top tartalom, csillagot érdemel :)A WebPillangó eddigi bő féléves pályafutása alatt született néhágy olyan bejegyzés, ami iránt szépen gyarapodott az érdeklödők száma. A bejegyzés célja egy helyen összegezni ezeknek a bejegyzéseknek a krémét, témától függetlenül, legyen az photoshop, webdesign, web programozás vagy bármi egyéb kiegészítő, mint például a Magyar-Angol, Angol-Magyar Photoshop szótár program formájában megvalósítva.

A csemegézést a legtöbbet értékelt és a legjobb értékelést szerzett bejegyzésekkel kezdem. Az értékelést a bejegyzések alján lehet elvégezni a csillagokat használva. A legtöbb szavazatot a Retró kép készítése segédlet kapta. A legjobb értékelést pedig a WebPillangó Photoshop szótár.

A Google Analytics szerinti, a WebPillangón, a top tartalom (top content) a következőkből áll:


Elolvasom a teljes bejegyzést »



jan
29
Írta: Tupacko, 2008-01-29, (Blogolok, Hírek)

Lassan eljött az idő egy nagyobb frissítéshez. A WebPillangóról van szó. Sajnos azt kell tapasztaljam, hogy még mindig nem elég jó az oldal. Ez alatt az értem, hogy a grafikával sem vagyok megelégedve és az oldal funkcionális felépítése is szinte már szörnyű, amikor tudom, hogy jobban is meglehetne oldani. A tartalom is kissé eltért attól, amit nyújtani akart a WebPillangó, ezért tartalom szempontjából is szigorításokat tervezek.
Elolvasom a teljes bejegyzést »



jan
13
Írta: Tupacko, 2008-01-13, ((X)HTML, CSS, Design)

Nem számít egy nagyon új dolognak a CSS segítségével megvalósított gomb, viszont a dinamikus szélességgel bíró gomb igenis új távlatokat nyit a weblapkészítésben. A következő leírásban egy ilyen szerű gomb elkészítéséről lesz szó. Először elmondanám, hogyan is működik a gomb, milyen elmélet alapján, majd a szükséges kódot is közzéteszem.
Az ötlet az, hogy ne legyen egy statikus háttér, amiről lefuthat a szöveg, ha éppen hosszabb, mint a kép maga. Persze ezt elméletben ne lehet tökéletesen kiküszöbölni, még szerencse, hogy a gyakorlati világban élünk. A háttér dinamikus szélességét annak köszönhetjük, hogy a linkekbe nem a szöveget helyezzük, ahnem egy span elemet, ami tartalmazza a szöveget, így valójában két hátterünk van: egy nyitó, ami nyulni is fog, ahogy a szöveg egyre hosszabb (persze csak egy pontig, de mivel mi határozzuk meg, nem okoz gondot) és egy záró háttér, amely lezárja az első háttér végét, így egységes megjelenést biztosít.
Elolvasom a teljes bejegyzést »



nov
28
Írta: Tupacko, 2007-11-28, (Blogolok, Design, Web)

Ízléses web 2.0A webkettes design elemek leírása elég hosszúra sikerült. Az elöző részekben szó volt a lényeges, nagy elemekeről. A jelen, harmadik és talán befelyező részben az apróságokra próbálom fektetni a hangsúlyt. Mint afféle bevezetés, megragadnám a lehetőséget egy, az elöző leírásokban nem szereplő, nagy elem ecsetelésére. Arról van szó, hogy minden webkettes oldalon megfigyelhetőek az elkülönített részek a tartalmi egységeben is. Reményeim szerint ezt a tulajdonságot tovább boncolva minden említésre érdemes elemet érinteni fogok.
A részek elkülönítése nagyon egyszerű dolog (nak tűnhet): fogok egy oda nem illő háttérszínt, nem találó szövegelemeket és készen is vagyok. Rossz! A lényeg, hogy megtartsuk az oldal áttekinthetőségét, egyszerűségét, vagyis a letisztultságot. Első lépés, hogy különítsük el az állandó navigációs elemeket. Ez álltalában a főmenü. Használjunk a designba találó, de mégis összetéveszthetetlen formákat és színeket, tisztán olvasható betűket az elkészítéshez. Ez azért fontos, hogy tudassuk a böngésző személlyel, hogy: hol van és hová mehet.
Elolvasom a teljes bejegyzést »



nov
26
Írta: Tupacko, 2007-11-26, (Blogolok, Web)

A hasonló címmel olvasható egy bejegyzés Harder oldalán, ugyanis ő adta az ötletet! Ebben a témában már több bejegyzés is van az oldalon, de talán még egyik sem szólított Téged a visszajelzésre. Ez a bejegyzés most nem arról szól, mint a Hogyan blogoljunk, vagy a A webdesignerek hét bűne, hogy csak a legtalálóbbakat említsem. A bejegyzés lényege, hogy mond el mit szeretsz Te, vagy mit szeretnél látni egy blogon, vagy éppen a WebPillangón!
Én is írok egy rövid kritérium listát, miszerint szoktam blogot olvasni, vagy mi az, amitől nyomba elmegy a kedvem. Elsősorban a tartalom az, ami megfog. Nem kell feltétlenül egy olyan témája legyen, ami a favoritomba tartozik, de az írási mód az valami egyedi kell legyen.
Elolvasom a teljes bejegyzést »



nov
25
Írta: Tupacko, 2007-11-25, (Blogolok, Design, Web)

Az első részben szó esett az általános jellemzőkről, az oldal elrendezéséről, méreteiről és a szövegek formálásáról. Ez a rész egy más megközelítésből szemlélteti a webkettes karaktersziszikákat.

Pozitív egyszerűség

Elkülönített fejléc

Régebb is említettem, hogy az egyszerűség egy etalon a web 2.0 világában. Ezt most mélyebben is elemezném: mit is értek a pozitív egyszerűség alatt. Vegyük alapul a valós életet: ha van egy megoldásra váró feladat és két megoldási lehetőség, melyiket választjuk? Természetesen az egyszerűbb nyeri el a tetszésünk! Így van ez a weben is: a böngészőt nem érdekli, hogy mennyi mindent lehet belemocskolni egy jó, tartalmas, weboldalba. A látogatókat a tartalom érdekli; az, hogy egyszerűen megtalálja, szinte elvárássá vált.
Ha például egy weboldalt teleszúrkálunk mindenféle widgettekkel, annak nem lesz jó vége, mivel a látogató a csicsás dolgokra fog odafigyelni és nem lesz már türelme/ideje az igazi tartalom megtalálására. A hasonló kellemetlenségek elkerülésére több egyszerüsítő módszer is van a gyakorlatban. Egy bevált eljárás, ha eltüntetjük a fő tartalomhoz szorosan nem tartozó elemeket vagy kevesebb figyelemfelkeltést biztosítunk ezeknek az elemeknek. Ugyancsak ide tartoznak a sokak szerint dekorálásnak tartott, úgynevezett webkettes megbélyegzések. Az ikonok, kitűzők és egyébb szemkápráztató elemek fő célja a figyelemfelkeltés: a fontos információra való figyelmeztetés.
Elolvasom a teljes bejegyzést »



nov
23
Írta: Tupacko, 2007-11-23, (Blogolok, Design, Web)

Browse Happy, web 2.0 jellegzetességekAz előbbi cikkekben (web 2.0 gyorstalpaló, web 2.0 műszaki szemmel) nem került kihangsúlyozásra a webkettes esztétikum. Ebben a bejegyzésben megpróbálom körülírni és megmagyarázni a webkettő grafikai szokásait.

Általános vonások

Szinte minden webkettes weboldalon találhatunk színátmenetet, kontrasztot, letisztultságot, harmadik dimenziót, ikonokat és sok-sok szabadhelyet. Bizonyára sokan megkérdik magukban: mi az új? Talán semmi! Minden esetre, abban gondlom mindenki egyetért, hogy régen nem volt ilyen népes a jól megformált weboldalak tömege. Több dolgonak is köszönhető ez, köztük a jobb eszközöknek, a web fejlődésének, de akár az inspiratív odalaknak is! A következő részben sorraveszem a legfontosabb elemeket.
Elolvasom a teljes bejegyzést »