Dnevnik eklektika - Piše Dragan Babić

Steadicam

Danas sam završio rad na sajtu jedne mlade novosadske advertising agencije “Altertise”, koja se pored usluga snimanja reklamnih spotova, režije, motion graphics-a, itd. bavi i rentiranjem Glidecam sistema za stabilizaciju.

Nedavno se na Biznisblogu potegla priča o worn look-u i grunge fazonu na Webu danas, tada sam i izjavio da je to jedan stil koji jako teško pođe po zlu, tj. prilično je teško napraviti ga da izgleda loše—po mom skromnom mišljenju. (Ili samo ja nisam naišao na lokaciju koje su urađene ovim stilom a loše izgledaju?)

U svakom slučaju sa www.steadicam.co.yu nismo išli na wicked worn look, već pre na neku siroviju, prljaviju varijantu. Nismo hteli da dizajn ispadne digitalan takoreći, hteli smo postići efekat kao da je sklapan živom rukom.

Ukoliko imate nekih komentara na dizajn molim vas iznesite ih, takođe ukoliko primetite neke nedoslednosti u smislu browser quirksa—i njih prijavite. ;)

PS

Opera ima toliko problema sa ovim layoutom da je to smešno, radi se na tome, pogledajte, igrajte se malo. HINT: Otvorite stranicu, minimizirajte ga pa ga vratite, probajte da skrolujete, dupli klikovi… (Ako neko zna postojeća rešenja za ovakve probleme neka mi prijavi please, tipa neklikabilni linkovi itd.)

Generalno Opera ima problema sa pozadinskim slikama, nekada traži posebne kombinacije naznake za vrednosti njihovih pozicija (npr. 50% top i center top znaju da naprave znatnu razliku u smislu da jedno radi drugo ne). Najveći problem je u tome što Opera ima gadnu naviku da kada “vidi” da joj nešto ne štima odluči da to i ne prikaže uopšte. U ovom slučaju su to pozadinske slike, ali znaju da budu i kompletni elementi.

Upravo sam otklonio jedan problem, naime Opera ne ume baš sa apsolutno pozicioniranim elementima (stara boljka), dobro je što je ovde problem samo oko pozadinskih slika, pa ću nadam se i uz malo eksperimentisanja otkloniti probleme.

Update

Sve je popravljeno, Opera ima problema sa -9999em kao vrednosti za text-indent (Phark image replacement), kada sam sve instance ovoga prebacio u -2048px (za Operu ne postoji veća vrednost od ove) sve je proradilo savršeno, čak više nema problema ni sa skrivanjem pozadinskih slika. Jebem ti browser i šveđane i sve u tri pizde materine…

• « Favicons, please
• Lansiran Herbiv.org »

Komentari na ovaj unos 18

1. Mladen Jablanović kaže 14/02/06 03:59 PM

   Samo par primedbi (donekle subjektivnih):
   
   1) nagoveštaj trenutne i hover stavke u meniju je previše suptilan (recnuta hartija)
   
   2) pozadina selektovanog teksta je bela, pa se selektovani tekst slabo razlikuje od okolnog (verovatno zbog osnovne boje pozadine koja nije svetla, već čini mi se neka braon)
   
   3) upotrebljivi deo stranice je suviše mali: čak i na 1024×768 margina je prevelika, a saam deo rezervisan za content je sićušan, jedva 300×240 px.

2. Dragan Babić kaže 14/02/06 05:15 PM

   

   @ 1):
   
   Uzeto k znanju, definitivno naglašavamo.

   @ 2):
   
   Primetih, to je možda zato što element koji sadrži taj tekst ima transparentnu pozadinu? Mislim da ovo nije krucijalan problim, tj. više mi je _“nepogodnost”_ nego problem.

   @ 3):
   
   Površina jeste mala, ali ima i malo sadržaja. Ne znam na koju marginu misliš? Dimenzije su fiksne.

3. Ivan Minic kaže 14/02/06 09:11 PM

   Brojevi telefona na kartonskim kutijama i kafanskih salveta su najromanticnija stvar posle crvenih i plavi kariranih stoljnjaka…
   
   O mladosti…

   Inace… imas i steadicam-u suptilan horizontalni scroll iz Opere kao i ovde..

4. Nemanja Sreckovic kaže 14/02/06 10:55 PM

   Sajtic je ql, ja inace nikada nemam “hrabrosti” da uradim nesto u ovom fazonu. Moram jednom da probam. Inace karto nisam video skoro, tako da je ql.

   E sad, sajt je sitan jer je i sadrzaj sitan, tako da je to ok.

   Menjaj heder slicice, kad se promeni strana, ovako mi je slabo vidljivo da sam ucitao novu stranu…...

   Takodje se slazem sa Mladenom za stavku 1.

5. Dragan Babić kaže 15/02/06 12:29 AM

   

   Ta Opera će me u grob oterati… Jel mi veruješ da nemam blage veze šta pravi taj skrol?!?!? Jedina stvar na koju mogu da posumnjam je image replacement, ali to mi je malo far fetched...

6. Dragan Babić kaže 15/02/06 01:18 AM

   

   Interesantan predlog za rotiranje slika, razmislićemo oko toga. Bojim se jer je slika kartona “teška” 88kB, a header tridesetak. Koliko je opravdano terati korisnika da svlači 7-8×30-ak kB?

7. Marko Bijelić kaže 15/02/06 10:55 AM

   Sajt je strava dobro osmišljen, pravo osvježenje :)
   
   Što se Opere tiče, a šta misliš da batališ optimizaciju za istu…

   Znaš šta bi možda konceptualno bilo zanimljivo u ovom dijelu koji se skroluje da si možda informacije predstavio u horizontali, odnosno da se koristi horizontalni skrol umjesto vertikalnog. Nema puno informacija da se skroluju i ne bi bilo naporno, a bilo bi to rješenje koje bi se odlično uklopilo u postojeći koncept.

8. Данило kaže 15/02/06 07:09 PM

   Очигледно употреба другачијих фонтова доноси неке непредвиђене појаве (http://kvota.net/tmp/steadicam.jpg) — зелене штрафте. Како повећавам фонт (Ctrl++, слабијег сам вида ;), штрафте постају све израженије, па претпостављам да користиш нека поља која садрже   или већ нешто слично, а која очекујеш да буду празна.

   Остали су већ хвалили оно најзанимљивије ;)

9. Nemanja Sreckovic kaže 15/02/06 08:39 PM

   Sto se tice rotiranja slike u headeru, ja sam za. Nemoras menjati kompletnu sliku, izvedi je iz dva dela pa samo drugi deo rotiraj, siguran sam da to mozes izvesti i sa manje od 5k po stranici.

   Probaj.

10. r3dsc0rpi0n kaže 15/02/06 11:30 PM

    Povećaj sve skupa!! Stavi na središnji dio kartona repeat-x :) Ovaj skroler me ubija.

    Inače jako ljepo.

11. Dragan Babić kaže 15/02/06 11:43 PM

    

    Hvala na pozitivnim kritikama svima. Carevi ste. (Ne samo zato što su kritike pozitivne :) )

    @ Danilo:
    
    Dosta sam menjao stylesheetove, jel moguće da ti je ostalo keširano nešto ako si ranije posećivao sajt? Inače kako to da ti nije serifni font u glavnoj koloni? Jel gaziš autorske stilove sa korisničkim ili se nešto čudno događa? :)
    
    Koji preglednik koristiš? (Da ne kažem _“browser”_ ;) :P)

12. Mladen Jablanović kaže 16/02/06 12:39 PM

    Problem sa pozadinom markiranog teksta koji sam pomenuo rešava se banalnom intervencijom na CSSu:

    html{
      height:100%;
      background:#fff url(images/html2.png); /*(umesto #000 kako stoji kod tebe)*/
      color:#866f42;
    }
    

    BTW, sad nešto razmišljam, uz sve pohvale za “opušteni” dizajn, pitam se kako obični korisnici reaguju na marketing sa pocepanim kartonima i mrljama od kafe… “Pozovite nas, ostavite svoje podatke, a mi ćemo ih zapisati na parčetu jučerašnjih novina i nazvati vas kasnije… ako čistačica Milka slučajno ne baci vaš broj”... ;)

13. Dragan Babić kaže 16/02/06 01:17 PM

    

    Mladene, hvala na rešenju tog “buga”, zanimljivo je da sam rekao da ću staviti svetlu pozadinu na HTML, ali sam je promenio na crnu izgleda greškom (bila je #555 čini mi se). U svakom slučaju nisam je hteo promeniti iz tih razloga već da bi tekst bio čitkiji dok se slika kartona ne učita. Ovo je sada jednim udarcem dve muve. :)

    TW, sad nešto razmišljam, uz sve pohvale za “opušteni” dizajn, pitam se kako obični korisnici reaguju na marketing sa pocepanim kartonima i mrljama od kafe… “Pozovite nas, ostavite svoje podatke, a mi ćemo ih zapisati na parčetu jučerašnjih novina i nazvati vas kasnije… ako čistačica Milka slučajno ne baci vaš broj”... ;)

    Hahahaha, ovo me je nasmejalo! :D

14. Dragan Babić kaže 16/02/06 01:40 PM

    

    E ljudi jel može jedan teaser za vas?

    Ko je tajanstvena ličnost koja se krije u headeru na www.steadicam.co.yu, a preko nje je opaljena PostIt nalepnica?

    Par hintova:

    • Iz sveta muzike je (obratite pažnju na pozadinu i kuću),
    • muškarac je u pitanju,
    • fotka je relativno sveža.

    :)

15. Данило kaže 16/02/06 06:45 PM

    Користим релативно свеж Gecko (Gecko/20051010, из Firefox-а 1.0.7), можда је до њега (нпр. горња зелена штрафта нестане повремено). А заиста „газим“ подешавања фонтова, пошто људи често поставе неке којих нема на мом систему (Verdana, Tahoma, Times New Roman: кад би сви користили serif, sans-serif и слично, било би милина ;), и онда ми приказује битмапиране фонтове (ок, треба да средим систем мало, али ипак нећу зелене штрафте ;).

    А сајт нисам раније посећивао, није баш толико популаран :Р

16. Dragan Babić kaže 16/02/06 07:09 PM

    

    @ Danilo:
    
    Bez obzira što nemaš na primer Georgia font (koja je korišćena u glavnoj koloni) naznačio sam jasno i font-family da bude serif, ali ti izgleda nemaš ni jedan serifni font na računaru ili ipak taj korisnički stylesheet nadjača i tu osobinu? Rekao bih da je ovo drugo.

    Stvarno nemam pojma šta bi moglo da pravi te crte, mislim da bi mogao da bude text-decoration:underline osobina na linkovima. Kod mene je sve normalno pri skaliranju teksta…

17. andrej kaže 16/02/06 11:15 PM

    SvidZa mi se ideja, ali par nepravilnosti(kod mene, ofkors):

    1. iste strafte koje Danilo pominje, samo su kod mene preko cele strane, tacnije svuda osim tamo gde nisu kod njega (^danilo :), Firefox 1.0.7, WinXP
    
    2. u IE 6.0 ne radi Links link, i ovaj custom underline ne radi svuda isto, negde sece text.
    
    3. karton se malko ofucao.

    pozdrav,
    
    andrej

18. Pedja kaže 27/06/06 03:32 PM

    link http://www.stedicam.co.yu me vodi ka neobee hostingu?

    inace sam se ovde vratio (ne pratim tvoj blog redovno) jer sam nasao ovo(zbog kartona):
    
    http://www.kevadamson.co.uk/

    jbg, kasnim :)

Komentariši unos “Steadicam”

Ukoliko se odlučite na smeli korak komentarisanja, Vaše ime će biti linkovano sa Vašim uri-jem ukoliko ste ga uneli. Vaša email adresa je neophodna, ali je diskrecija zagarantovana i neće biti prosleđena trećem licu. Spammeri stop.

Tekst komentara možete formatirati uz pomoć textile-a. Sav HTML će biti odstranjen.
Obratite pažnju na pravopis i po mogućnosti koristite naša slova.

Ime:

Email:

http://

Komentar:

Zapamti info?

Zadržavam pravo da sankcionišem, uklonim, izmenim offtopic komentare, kao i one koje nemaju veze sa unosom pod kojim su objavljeni. Sa druge strane podržavam i ohrabrujem otvaranja konstruktivnih i otvorenih diskusija putem komentara. Unapred hvala što se držite teme.