Diskusní fórum webu fotobanky.cz

[Anika]

Můžeš se podívat třeba tady, některé ty šablony stáhnout a podívat se, jak jsou dělané.
http://freebiesbug.com/psd-freebies/website-template/

[Ravennka]

Tyo, problematika webů je tak rozsáhlá...

nicméně, pár rad:

-> než začneš, tak je dobrý vytáhnou se zadavatele maximálně o tom, co chce, jak si to představuje a případně co určitě nechce - týká se to i barev... i když někdo prodává doplňky pro fenky čivav, tak ten web nechce růžový (ačkoliv by k tomu ta růžová logicky sedla). I pokud zadavatel tvrdí, že nemá žádnou představu, tak kecá
-> já radím naskicovat si pár v ruce... můžeš to dělat i mimo comp, líp si u toho rozmyslíš, které prvky kam logicky sednou - pokud teda nemáš zadáno a jenom tomu nemáš dát grafický kabátek
-> vymýšlíš-li i layout, tak nenuť uživatele myslet -ať všechno rychle a logicky najde tam, kde to očekává
-> a to nejdůležitější - ať se to dá dobře přečíst když to přeženu, ať nemáš tmavě šedé písmo na černém podkladu a buttonky neonově zelené se žlutým písmem

[Lenka]

Co to je layout?

Má to probíhat tak, že centrum komunikace je programátor (což je super, protože ví, co je možné) a z jedný strany ho otravuje blbýma požadavkama klient, z druhý strany mám stupidní začátečnický dotazy já. Zatím nemám konkrétní zakázku, ale potřebuju se "teoreticky připravit", abych věděla, co je možný a co ne. Neony ani nekontrasty nechystám, vzhledem k mýmu věku a dioptriím se asi nedopustím ani mikropísma, protože bych na to neviděla.

Co mě zajímá: Musím (mám) navrhovat konkrétní fonty, nebo je zvykem nahodit jenom skrumáž textu, aby bylo vidět KDE je a zbytek si dořeší programátor s klientem?
Má práce v rastru nějaké zásadní výhody, nebo je praktické si vše předpřipravit ve vektoru a jen to vyexportovat?
Jsou nějaké technické limity, do kterých je lepší se nepouštět? (Blur, průhlednost, poloprůhlednost)
Může bejt průhledná vrstva se semtamněčím umístěná navrchu nad tlačítkama, nebo je to blbost a aktivní prvky musej bejt úplně nejvíc nahoře?
Šířku webu mám "nařízenou", ale co výška webu, je nějaký nepsaný pravidlo? Jak rozdělit stránku proporčně, aby to šlo používat na různejch zařízeních?

Našla jsem nějaký tutoriály z r. 2007, ale možná se to už dnes dělá jinak....

Jo, eště, co to je mockup?

[Ravennka]

Layout je vzhled tý stránky - kde bude menu, kde bude text, jestli tam vlevo budou fotky, atp...

Délka většinou daná není, protože záleží na obsahu tý stránky... může tam toho být hafo. Nicméně je super, že to budeš řešit s programátorem, protože ten by Tě mohl dost usměrnit, abys to nemuselo tisíckrát předělávat.

JInak jako čistě teoreticky jde udělat všechno, ale bude záležet na tom, jestli se to tomu programátorovi bude chtít dělat.. něco je jednoduchý, něco je složitý a je otázkou, jestli se mu to bude chtít dělat (jestli to klient zaplatí).

Font bych určitě navrhla - nějaký buď běžně dostupný font, který je všude, a nebo webfont - nahrajete na server, popř. https://fonts.google.com/ (plus když se nenačte tenhle, tak se dává nějaký záložní font "klasický" - povětšinou Arial).

Nerozumím úplně tý průhledný vrstvě... ale pokud se to tlačítko (ativní prvek) nebude dělat obrázkem, tak bych řekla, že se Ti na to programátor vyprdne protože by to musel pozicovat jeden obrázek - pozadí aktivního prvku, na to by ten text, pak nad to dát tu poloprůhlednou vrstvu a vlastně ten aktivní prvek by musela být ta vrstva... jestli si nepletu dojmy s pojmy, ale myslím, že ne. Aktivní musí být nahoře. Nicméně pokud by celé to tlačítko byl aktivní prvek, tak se to právě vyřeší obrázkem, který řízneš v gimpu i s textem a nazdar.

[Lenka]

Rozumím tomu tedy tak, že zakrejt pět tlačítek "jednotícím závojem" je blbost. Dobrá, budu hledat jednodušší formy. Věci, se kterýma mě pošle do háje mám v plánu nahrát na Pond. Třeba prolomím svůj rekord (jeden prodej za dva roky).
Pro začátek teda díky a já se budu asi průběžně doptávat jak na něco narazím co nebudu chápat.

Anika: Z těch šablon jsem dost "zdrcená", to co mi bylo předložený jako vzor ("takhle to obvykle děláme") se podobalo spíš nejjednodušším stavebnicím ve stylu webnode. (Lidová práce za lidové ceny).

[Anika]

U těch google fontů pozor na to, aby měl českou diakritiku, a když budeš navrhovat nějaký méně obvyklý font, tak radši k němu doporuč ještě jako alternativu nějaký obyč font jako arial, něco, co má v počítači každej.
Taky je vhodné větší řádkování textu, okolo 1,5.
Dělej to klidně v rastru i vektoru dle libosti.
Dnes je možné používat obrázky i ve vormátu .svg, což se hodí na ikonky (například), ale záleží, co si domluvíte.
Výška webu - ideálně nijak neomezovat, různé prohlížeče můžou mírně jinak vykreslovat písmo, nebo si někdo písmo zvětšuje, a to by dělalo neplechu. Počítej s tím, že například v chrome je písmo jakoby sraženější, než třeba ve firefoxu, takže nelpi na tom, aby ten text vypadal všude přesně stejně.

Zobrazování v různých zařízeních - to je téma na mnoho a mnoho příspěvků... Dneska existujou frameworky, jako například bootstrap, které už tyhle funkce obsahují. Ve zkratce to funguje tak, že máš na stránce bloky, které se řadí vedle sebe, a při menší šířce skáčou pod sebe.Třeba při šířce 1200px jsou 4, při 900px už jen dva a dva, při šířce 500px naskáčou pod sebe. Je dobré promyslet, jak ta stránka má vypadat při plné šířce i při menších šířkách, alespoň nějak rámcově. Menu se obvykle při menších šířkách sbaluje do hamburgeru.

Ty průhledné vrsty - v psd je to jedno, programátor si to překóduje, jak potřebuje. PSD je jen mustr.
Tutoriály z roku 2007 zahoď
Mockup je nějaká šablona, na kterou se přidá vlastní grafika, například obrázek s práznými vizitkami ležícími na stole a ty si tam dodáš svojí grafiku těch vizitek. Nebo třeba vyfocený monitor, na který si vlepíš ten svůj návrh webové stránky.
Doporučuju podívat se na ten bootstrap, získaš tak představu, jaká je logika responzivního webu, jak to funguje.

[Ravennka]

Pokud má být odkaz celé to tlačítko, tak to klidně udělat můžeš, uděláš si to v gimpu dle libosti a jenom nařežeš... pokud bude chtít odkaz na text, tak smůla... (a nebo teda já nevím, jak to udělat, což samozřejmě nic neznamená)

jinak nějaké čtení třeba tady - http://www.tutoriarts.cz/tutorialy/webdesign-9 horší je, že moc víc česky není (nebo na mne google kašle)... leda že by Ti Leguán půjčil v knihovně nějakou _novou_ knížku, že bys to alespoň prolítla... (nebo si udělej výlet do Luxoru a prolítni si to na místě, pro představu)

Anika> taky je otázkou, co je to za programátora a jak pracuje...

[Anika]

Pokud má být odkaz celé to tlačítko, tak to klidně udělat můžeš, uděláš si to v gimpu dle libosti a jenom nařežeš... pokud bude chtít odkaz na text, tak smůla... (a nebo teda já nevím, jak to udělat, což samozřejmě nic neznamená)

jinak nějaké čtení třeba tady - http://www.tutoriarts.cz/tutorialy/webdesign-9 horší je, že moc víc česky není (nebo na mne google kašle)... leda že by Ti Leguán půjčil v knihovně nějakou _novou_ knížku, že bys to alespoň prolítla... (nebo si udělej výlet do Luxoru a prolítni si to na místě, pro představu)

Anika> taky je otázkou, co je to za programátora a jak pracuje...

To jo, no
Programátor neznamená kodér.

[alima007]

Tak ve zkratce.

Všechno dělej ve vektorech, pokud možno a pak vyexportuj jpg,atd. Vektor má výhodu, že když ho změníš, změní se souměrně (narozdíl od rastru) - to uživatelé ocení ve chvíli, kdy si danou stránku zmenší. Dále nevím, jaké máš zadání, ale pokud máš na starosti jen pozadí, tak nemusíš řešit tlačítka a písmo. To řeší programátor pomocí kaskádového stylu. Pokud po tobě bude chtít vzorníky ... to ti mohu poradit pouze co se týče barev - používej neagresivní nejlépe pastelové barvy, ale s tvorbou samotného vzorníku nemám zkušenosti.

Hodně zdaru

[Ravennka]

Programátor neznamená kodér.

Víš jak, kodér je hanlivé označení... programátor zní líp