mustra bečka

12 Feb, 2011

Kako da brendirate svoj sajt?

Posted by: mustrabecka In: css

Pod terminom “brendiranje” ne mislim na pojam da vaš sajt postane brend tj. kako da od njega napravite brend. Ovaj tekst se odnosi na sve popularniji način reklamiranja sponzora vašeg sajta tako što ćete mu posvetiti prostor sa strane. Većina sajtova se još uvek pravi u širini 960px što odgovara rezoluciji monitora 1024px. Kako veliki broj ljudi prelazi na LCD monitore, tj. veće rezolucije, prazan prostor levo i desno od vašeg sadržaja može se lepo iskoristiti za prodaju oglasnog prostora. Dizajner vrlo lako može da ukomponuje reklamu sponzora u vaš postojeći dizajn kako bi pozadina sajta postala veliki bilboard i još klikabilan.

Sledi kratko uputstvo kako napraviti pozadinu sajta koja je ustvari link ka sponzoru:

1. Recimo da se vaš sajt sadrži iz 4 osnovna div-a. Prvi među svima je tzv. “kontener” (onaj koji drži sve). Napravite klasičan link u njemu i dodelite mu id:

<a href="http://mustrabecka.com" title="Naslovna" id="">Klikabilna pozadina</a>

Klikabilna pozadina
————————————————-
2. U CSS fajl dodajte sledeće linije:

#klik {
    background-image:url(http://www.mustrabecka.com/images/mustra-logo.jpg);
    display:block;
    height:113px;
    width:280px;
}

Link treba da dobije osobine “bloka” i potrebno je odrediti širinu i visinu vaše klikabilne pozadine.

————————————————-
3. Linku smo dodelili id koji smo definisali u css fajlu. Sada bi to trebao da izgleda ovako:

Klikabilna pozadina

<a href="http://mustrabecka.com" title="Naslovna" id="klik">Klikabilna pozadina</a>

————————————————-
4. Naravno ne želimo da se link vidi, da bi smo ga sklonili sa pozadine potrebno je u css fajl dodati još jedan parametar:

#klik {
    background-image:url(http://www.mustrabecka.com/images/mustra-logo.jpg);
    display:block;
    height:113px;
    width:280px;
    text-indent:-9999px;
}

Poslednja dodata osobina “text-indent” gura link u levo toliko pixela da se on ne može pokazati na monitoru.

Klikabilna pozadina

I to je to, klikabilna pozadina je spremna za implementaciju – MAKE SOME MONEY! ;)

Live demo i Source

Domaći primeri:

05 Feb, 2011

Kako omogućiti bilo koji font na web sajtu

Posted by: mustrabecka In: Internet

Ako ste nekada imali zadatak da ubacite nestandardni font na vaš web sajt a to niste znali, evo jednog od mogućih rešenja.

Predpostavimo da imate neki font .ttf ekstenzije, prvo je potrebno od njega napraviti “web font”. Zgodan online alat za to je FontSquirrel. Zatim iz menija izaberite @font-face Generator izaberite dodatne opcije za podešavanje i pošaljite vaš ttf fajl.

Kada sajt završi konverziju, dobićete zapakovanu datoteku, KIT sa 4 ekstenzije fonta (.eot, .ttf, .woff, .svg ), jednim index fajlom gde se nalazi primer vašeg fonta i stilom za pozivanje tih fontova.

Na vama je ostalo da u svoj style.css ubacite sledeće:

@font-face {
    font-family: 'ElementarzRegular';
    src: url('elementarz-webfont.eot?') format('eot'),
         url('elementarz-webfont.woff') format('woff'),
         url('elementarz-webfont.ttf') format('truetype'),
         url('elementarz-webfont.svg#webfontaGW4zO6m') format('svg');
    font-weight: normal;
    font-style: normal;

}

Naravno i 4 gore nabrojana fonta morate smestiti negde na svoj server (za ovaj primer sam koristio font “ElementarzRegular”)

Ako vaš odabrani font nekim slučajem neće da se konvertuje pomoću veverice pokušajte ga “regenerisati” pomoću ovog servisa.

Dobra vest je da je Google od nedavno počeo da hostuje dosta free web fontova tako da i tamo možete naći alternativu ovom postupku.

29 Jan, 2011

SMS Parking Srbija – Besplatna aplikacija za iPhone

Posted by: mustrabecka In: Apple|iPhone

sms parking srbija aplikacija Moj dobar prijatelj je odlučio napraviti aplikaciju za plaćanje parkinga, ujedno kao vežba jer ulazi u svet iOS programiranja ali zbog potrebe da napravi nešto bolje jer za to ima mesta na tržistu pouđenih app.

Neke od karakteristika aplikacije su sledeće:

- jednostavn korisnički interfejs koji je lak za korišćenje. Nakon početnog podešavanja možete platiti parking u par poteza

- mogućnost dodavanja velikog broja vozila

- centralizovan i organizovan prelged svih podataka za izabranu parking zonu i parking servis

- prikaz lokacije parking servisa na mapi

- sve zone su označene bojama i nazivima kao na tablama radi lakšeg prepoznavanja

- jednostavno ažuriranje podataka, program automatski proverava ažurnost baze svakih 15 dana, a to možete učiniti i ručno na ekranu za izbor Zone / Grada

Program automatizuje i olakšava proces plaćanja parkinga putem SMSa. Sadrži detaljnu bazu gradova u Srbiji gde se parking plaća na ovaj način, sa svim podacima o zonama: naziv, boja, trajanje, ograničenje, cena, ao i o podacima o parking servisima: adresa, telefon, adresa internet prezentacije.

Ograničenja:

- zbog obaveznih ugovora koje parking servisi moraju imati sa operaterima, plaćanje je moguće samo pretplatnicima sa srpskih mobilnih mreža

Aplikacija i najnoviji screen shotovi se mogu naći na iTunesu

Odgovori na neka od najčešće postavljenih pitanja

Video klip sa kratkom prezentacijom podešavanja i korišćenja programa

22 Dec, 2010

Marketinška fora zvana Bonbon

Posted by: mustrabecka In: marketing

Priča meni kolega danas kako su prošle godine bili u prodavnici za dečiju odeću. Malom su se zasviđale neke pantalone, a mama i tata su hteli da mu kupe jaknu.

Na kraju su se dogovorili da će da mu kupe obe stvari… Pošto su mu pantalone bile za zimu a kupovane su za vreme leta, tek su ih sada izvadili iz ormana.

Kada je dete uguralo ruke u džepove i osetilo bonbone u njima sreći nije bilo kraja :) Efekat bi bio još bolji da su pantalone probane i nošene odmah nakon kupovine. Detetu će sigurno ostati urezano u svesti čin prodavca a i uspomena na prodavnicu. Možda i prepriča svojim drugarima :)

Ovo me podsetilo na onu situaciju kada s vremena na vreme u nekom levom džepu pronađemo 100 500 din od ko zna kada, u međuvremenu 2x ispranih.