Tnx za opozorilo ... Sem preveril tudi sam in vidim, da bo CSS za landscape na mobilcih res treba še malo izpiliti :)

Živjo!

Kot oblikovalcu s kroničnim pomanjkanjem časa, mi je po (pre)dolgem odlašanju končno uspelo postaviti stran s predstavitvijo svoje dejavnosti in študijami preteklih projektov.

InternetMojstre bi prosil za kakšen komentar v zvezi s hitrostjo nalaganja (heavy JS in CSS), dizajnom, prikazom na prenosnih napravah, morebitnimi bugi ali čem drugim :) Stran sicer ni priklopljena na noben CMS, mogoče v prihodnje, če se pokaže potreba.

Še povezava: Maleo.si

Ključ je v background attachmentu ...

background-image: url('image.jpg');

background-repeat: no-repeat;

background-attachment: fixed;

background-position: center;

Meni strukturiraš s pomočjo ul in li značk. Preko ul značke določiš širino menija, ozadje, pisavo itd.

ul {

  width: 800px;

  background: #000;

  font-family: 'Arial';

}

Ker je li značka v osnovi namenjena seznamom in zato prikazuje tiste grde črne pike (bullete), jih odstraniš s pomočjo list-style, nastaviš display na inline-block (da bo klikabilen cel gumb, ne samo tekst) ter dodaš malo paddinga, da ne bo vse skupaj natlačeno.

ul li {

  list-style: none;

  display: inline-block;

  padding: 10px 0;

}

Oblikuješ še linke ter mouse-over event

ul li a {

  padding: 10px 30px;

  text-decoration: none;

  font-size: 2em;

  color: #fff;

}

ul li a:hover {

  color:#000;

  background: #dd5627;

}

Na koncu CSS izgleda takole:

ul {

  width: 800px;

  background: #000;

  font-family: 'Arial';

}

ul li {

  list-style: none;

  display: inline-block;

  padding: 10px 0;

}

ul li a {

  padding: 10px 30px;

  text-decoration: none;

  font-size: 2em;

  color: #fff;

}

ul li a:hover {

  color:#000;

  background: #dd5627;

}

Na hitro spišeš še HTML in voila ... najbolj osnoven meni ;)

<ul>

  <li><a href="#">Home</a></li>

  <li><a href="#">Building</a></li>

  <li><a href="#">Buying</a></li>

  <li><a href="#">Selling</a></li>

  <li><a href="#">Moving</a></li>

</ul>

Potem se lahko igraš še z raznimi transitioni in podobnimi zadevami za kakšne fancy efekte, ampak v osnovi je to to.

Lahko delaš strani na napotnico. Če imaš dovolj znanja, lahko kontaktiraš par podjetij, če imajo slučajno gužvo bodo z veseljem poiskali zunanjo pomoč in te plačali preko napotnice. Lahko si tudi postaviš svojo stran kjer opišeš svoja znanja in pretekle projekte. Narediš si profile na Behance, Dribbble in podobnih straneh ter začneš spremljati sodobne trende. Greš v knjižnico, si sposodiš par temeljnih knjig iz področja, ki te najbolj zanima.

V bistvu sem pisal v obratni smeri, kot se moraš lotiti stvari, ampak you get the picture.

Karmenca:

Štos pa je v tem, da, če npr. pristaneš v bolnici, ZZZS od podjetnika zahteva, da se mu priložijo vsi trije dokumneti, sicer ti izstavijo račun za zdravljenje; zadnji tak primer je bil za 18.000 eur.

Tole bolj spada v temo vici, šale in podobne fore

Omenjeni primeri so t.i. one page strani, ki pa ne vsebujejo veliko parallax scrollinga, ki je pogost spremljevalec. Tak tip strani seveda ni primeren za spletno trgovino ali news portal, je pa odličen za predstavitev posameznega izdelka ali storitve, za kakšen landing page. Trende je treba obrnit sebi v prid ter jih uporabiti tam kjer je to primerno, ne pa jim samo slepo slediti in jih uporabiti pri vsakem naslednjem projektu, dokler se ne pojavi the next big thing.

Mogoče MighyDeals?

Glava mene ful zmoti ... je previsoka in zamaknjena v levo. Probaj jo zoožat po višini in pa zamaknit znak in navigacijo za 30px v desno.

Jaz kar na photodune.net ponavadi poiščem ... verjetno iz razloga ker imam na envatu nekaj več credita naloženega, pa se mi ne da potem loviti še z ostalimi istocki. Pa tudi izbira mi zaenkrat zadostuje.