Jak rozřezat obrázkový návrh stránky?

Tipuju, že se to rozřezává a že to je ta nejhorší práce, co může být...

viděl jsem např. návrhy, kde byl navrhnutej box se zakulacenýma rohama a gradientem z levého spodního rohu do pravého horního rohu... celkem by mě zajímalo jak se toto řeší...

Pokud to html/css koder chce udělat tak, aby box neměl pevnou šířku (tedy sestavení ze 4 divů, v každém jeden roh), pak je v podstatě nemožný vytvořit jakýkoliv gradient (který má být aplikován na celý box)...

Nebo jsem také viděl pozadí, která nad hlavním boxem mělo vertikální gradient a pod hlavním boxem horizontální gradient. Nedokážu se představit toto vyřešit při faktu, že každý monitor je jinak široký

na to slúži nástroj slices:

Není na tom nic těžkého, chce to prostě trochu umět html a css a mít v hlavě návrh, jak to udělat.

U tohoto se strašně těžko radí...asi to ze začátku vypadá těžce, ale prostě myslim že když umíš html a css
a zapneš šedý buňky mozkový, tak by to neměl být problém....chvílu si nad tím sedni a zkus to
Víceméně vytaháš z designu všechny obrázky a pozadí a pak je používáš v html a css, což snad umíš

Hubert, H13
takhle teoreticky se to říct nedá, záleží případ od případu. Tohle všechno se nedá naučit jen tak, na papíře, ale zkušenosti přicházejí s takovýhlemi věcmi, které je třeba řešit v reálných příkladech.

V začátcích by to chtělo mít v ruce konkrétní problémový návrh a třeba se poradit s nějakým zkušenějším kodérem, který ti řekne/poradí, jak to nejlépe udělat. Pak se to stane rutinou, zvládneš si rozřezat (a později i nákódovat) všechno sám, až budeš na dostatečné kodérské úrovni.

Všechno se dá rozřezat i nakódovat dvěmi způsoby - dobře a špatně. Zkraje, jako začínající kodér, špatně rozřežeš a ještě hůř nakóduješ, ale to je normální. Každý nějak začíná.

Nox
panther
súhlasim z vami

Jak tedy "dobře" rozřezat a nákodovat následující box (za předpokladu dynamycké výšky a šířky boxu a taky dynamického nadpisu, který např. při delším textu může být rozdělen na více řádků, navíc obsahuje jako pozadí nějaký znak... tedy nelze použít spodní přímku v pozadí)? :-(

H13
no rozdeliť to treba na 6 častí kedže to má gradient. a potom to vnoriť doseba. ale ja by som radšej navrhol nejake jednoduchšie riešenie

pollo22
„ale ja by som radšej navrhol nejake jednoduchšie riešenie“
to není moc dobré řešení problému :-)

panther
no ja som tam riešenie povedal....stači ho rozsekať na myslim 6 časti a vnoriť ich do seba

H13
To co sem davas je extrem, kazdy normalny grafik toto koderovi nepredlozi. A ak aj predlozi, mal by sa mu pratat z dosahu.

srigi
„To co sem davas je extrem, kazdy normalny grafik toto koderovi nepredlozi. A ak aj predlozi, mal by sa mu pratat z dosahu.“
Proč myslíš? Právě takovéhle věci mohou klienta/potencionálního zákazníka přilákat. Žádný zkušený kodér by před tím neutíkal, i když, ano, není to řešení na minutu, ale musí se nad tím trochu zamyslet, jak to správně a hlavně nejlépe udělat.

panther
Osobne si myslim, ze takato vec sa nakodit neda, ale ak by si mal link napr. na clanok alebo ukazku, uznam svoje tvrdenie ako chybne.

srigi
To co sem davas je extrem
Na tom obrázku jsem chtěl demonstrovat, co se stane, pokud grafik nezná hranice html a css. I tady v diskuzi jsem viděl mnoho grafických návrhů připravených pro rozřezání, které takové oříšky obsahovaly. Já osobně jsem nikdy grafický návrh nerozřezával, ale dovolím si s tebou souhlasit, "ze takato vec se nakodit neda"

Ale nic není nemožné :-) a možná nám panther ukáže způsob jak to vyřešit...

H13
Ono niektore veci sa daju, ale diagonala fakt asi nie. Ale ak mas (ale aj ostatni mate) tu moznost, kukni sa na stranku Windows update pomocou IE. Spodny modro-biely gradient dokaze "scale-ovat" pri nastavovani rozmeru okna. Velmi zaujimave.

Jo to vypadá dobře, dokonce jsem vypl javascript a jelo to, to by mě zajímalo, jakým způsobem je to dělaný... je ale zajímavý, že to nefunguje pod ostatníma prohlížečema, viz např.:
http://www.microsoft.com/downloadS/details.aspx?familyid=E59C3964-672D-4511-BB3E-2D5E1DB91038&displaylang=en

takže zřejmě nepoužitelný :-(