« 1 2 »
Autor Zpráva
Sirius
Profil
Zdravím,

už mě nebavilo koukat na všechny ty odlesky a průhledné prvky a zároveň jsem konečně chtěl využít svůj oblíbený font Georgia. Chtěl jsem jednoduché (administrační) prostředí, které nebude být do očí. Vzniklo tohle a já vás prosím o zhodnocení (a případné návrhy, jak to změnit k lepšímu).

Odkaz na obrázek
Chamurappi
Profil
Reaguji na Siria:
Na administrační rozhraní to vypadá opravdu netradičně. Možná moc vzdušně a chudě. Nemusíš přidávat odlesky a průhlednost, ale s nějakými obrázky bys v tom svém obrázku počítat mohl. Stačilo by pár smysluplných ikonek a vypadalo by to živěji.

prostředí, které nebude být do očí
Tahle hrubka docela byje do očí :-)
Nox
Profil
Georgia je hezká....no líbí se mi to. Možná na pár místech zvýšit kontrast, trochu míň odstínů té modré bych řekl, možná ještě nějakou barvu + jak píše Chamurappi ikonky na oživení, ale základ je dobrý

Patička by mohla být odsazená aby byla zarovnaná s ostatním
Sirius
Profil
Chamurappi:

Ty ikonky vůbec nezní špatně. Poohlédnu se po nich, snad objevím nějakou pěknou galerii.

A díky za upozornění na tu chybu, dneska sázím jednu za druhou, i v tom obrázku jich mám několik. :))

Nox:

Zkusím to. (Dlouho jsem přemýšlel jak zformulovat, že co se webů týče tak mě barvy nemají rády - na nic jsem nepřišel.)

Díky

Edit: Mé předtuchy ohledně náročnosti nalezení kvalitní galerie s ikonkama (přesněji typem co by se tam hodil) se vyplnily.
RockFire
Profil
Velmi kvalitní sada, avšak podle licence nutno zanechat alespoŇ na jedné stránce, nebo v patičce a podobně link na set...
http://www.widlak.cz/2007/11/18/silk-icons-ikony-do-kazde-rodiny/
Chamurappi
Profil
Reaguji na RockFira:
Velmi kvalitní sada
A také velmi okoukaná.


Reaguji na Siria:
Zkus pátrat tady. Někde tam jsou k nalezení celé sestavy ikon.
imploder
Profil
http://naldzgraphics.net/freebies/40-excellent-free-icon-sets-everyone-must-have/
Nox
Profil
tady taky pár
Sirius
Profil
Díky za všechny ty linky. Prolezl jsem je a taky spoustu dalších. Zalíbily se mi tyhle ikonky, ale abych pravdu řekl, tak se mi to moc ve výsledku nezdá, asi si s tím pak ještě pohraju. Docela jsem narážel na problém, že jsem sehnal 3 ikonky, ale nebyla k nalezení čtvrtá ve stejnym stylu.

http://img208.imageshack.us/img208/2644/administraceserifv2.png
RockFire
Profil
Mě se výsledek zdá pěkný, minimálně lepší :-)

Chamurappi: No jo, okoukaných je věcí...
imploder
Profil
Právě ikonky v administračním rozhraní je lepší mít okoukané, které už uživatel možná zná, než nějaké těžce originální, jejichž význam nikdo neuhodne.
Sirius
Profil
RockFire:
Tak to jsem rád. :)

imploder:
Řekl bych spíš jednoznačné, než okoukané.
Sirius
Profil
. Asi se to poslalo dvakrát .
Sirius
Profil
Tak jsem to ještě mírně poupravil, začlenil jsem další barvu, nakódoval to a tady je výsledek - http://wow.vigudes.cz/georgia/

Můžete prosím zhodnotit tuhle (pravděpodobně výslednou) podobu, včetně HTML a CSS kódu?
Railbot
Profil
- u tabulky záhlaví otevíráš <th> a ukončuješ <td>
- menu je zbytečně uzavřené v divu
- ikonky u položek by bylo lepší vkládat přes css
- název webu jako <h1> a <h1> jako nadpisy v obsahu nejdou dohromady, buď jedno nebo druhé
- <br> se používá pro zalomení řádku, ne pro odsazení prvků. Používej margin a padding.
- v css naprosto zbytečné hacky
- s ohledem na IE6 není dobré zadávat velikost písma v px

padding: 0px;
padding-left: 20px;

se dá zjednodušit na padding:0 0 0 20px

border: 3px solid;
border-color: d4dbe4;

tam je chyba u barvy a lze to zjednodušit na border: 3px solid #d4dbe4

Jelikož je web hodně jednoduchý, kvalita kódu by mohla být podstatně lepší.
panther
Profil
Sirius:
je hezké, že jsi použil „label“, ale pokud nemá atribut „for“, je tam jaksi k ničemu.
Sirius
Profil
Railbot:

- u tabulky záhlaví otevíráš <th> a ukončuješ <td>
Původně tam bylo td, zapomněl jsem upravit ukončovací značku.

- název webu jako <h1> a <h1> jako nadpisy v obsahu nejdou dohromady, buď jedno nebo druhé
To už se tu několikrát řešilo. Došlo se k závěru, že je to jedno.

- <br> se používá pro zalomení řádku, ne pro odsazení prvků. Používej margin a padding.
Margin a padding tam samozřejmě nastavenej mám, potřeboval jsem vidět jak to bude vypadat s volným řádkem, kvůli tomu nebudu u dvou tagů přes CSS nastavovat větší margin/padding.

- v css naprosto zbytečné hacky
Které přesně prosím? Je možný, že některý tam opravdu nemaj co dělat a jenom jsem je tam zapomněl.

- s ohledem na IE6 není dobré zadávat velikost písma v px
Jsem si toho vědom a nijak mě to na duši netíží. Jsem toho názoru, že většina uživatelů IE6 je na tom tak, že ani neví jak písmo zvětšit, nebo ho musí používat - např. v práci.

se dá zjednodušit na padding:0 0 0 20px
Ano vím. Tohle mi přišlo přehlednější, když jsem řešil zobrazení v různých prohlížečích.

tam je chyba u barvy a lze to zjednodušit na border: 3px solid #d4dbe4
Když mi tam chyběl znak #, tak se rámeček nezobrazil ve FF, proto to bylo na dvou řádcích. Díky za upozornění na zápis té barvy, nevím co mě to popadlo.

- menu je zbytečně uzavřené v divu
Opraveno.

- ikonky u položek by bylo lepší vkládat přes css
Můžu se zeptat na výhody?

panther:

Aha, neveděl jsem, že ten label má i jinou funkci, než čistě informativní, opraveno.

----

Díky za kritiku.

A co říkáte na vzhled? To je to tak hrozné, že to nikdo nehodnotí?
Railbot
Profil
Sirius:
To už se tu několikrát řešilo. Došlo se k závěru, že je to jedno.
Řešilo se možná jestli to může být jedno nebo druhé. Oboje dohromady nejde. Sémanticky to nedává smysl. Ale prakticky je to jen nepodstatný detail.

Které přesně prosím? Je možný, že některý tam opravdu nemaj co dělat a jenom jsem je tam zapomněl.
Všechny.

Margin a padding tam samozřejmě nastavenej mám, potřeboval jsem vidět jak to bude vypadat s volným řádkem, kvůli tomu nebudu u dvou tagů přes CSS nastavovat větší margin/padding.
Samozřejmě. Proč napsat form input {margin: 0 0 x 0}, když se může html kód prasit zbytečnými tagy navíc :)

Můžu se zeptat na výhody?
Můžeš. Obrázky vkládané jako <img> by měly nést nějakou informační hodnotu, což se o ikonkách, které patří mezi pouhé ilustrace, říci nedá. Navíc když už je vkládáš jako <img>, chybí ti tam alt. Vložením přes CSS se dají nacpat do jednoho obrázku (css sprite), což vede jako bonus k o chlup rychlejšímu načítání.

Mimochodem nevychází ti šířka stránky. Layout má nastaveno 800px, hlavička také, ale + 20px levý padding. Obsah je na tom ještě "lépe", ten má 780px, ale padding 20px tentokrát z obou stran,takže ještě 20px u šířky uber.
Sirius
Profil
Railbot:
Všechny.
Mám tam celkem tři. První se vztahuje k obrázkům skrze tag img v menu, o tom až dál. Druhý se vztahuje k té šířce stránky. Poslední souvisí se špatným zobrazováním tlačítek v IE7 a IE8, na to řešení mě odkázal někdo tady z diskuse - funguje to, řeší to problém a není to zase tak velká prasárna, abych to nepřekousl.

Samozřejmě. Proč napsat form input {margin: 0 0 x 0}, když se může html kód prasit zbytečnými tagy navíc :)
Musel bych těm dvěma inputům nastavit class a nastavit margin v CSS. Stojím si zatím, že do kódu raději přidám dvě <br> navíc, než dělat tohle, což by bylo pracnější. Stejně takhle nebudu ty inputy nikdy odsazovat, šlo mi jenom o to, abych viděl jak bude vypadat samotný, bez dalších přilepených tlačítek.

Můžeš. Obrázky vkládané jako <img>...
Přemýšlel jsem potom ještě nad tím a došel jsem k tomu samému. Souhlasím. Asi to stejně předělám, kdybych pak chtěl udělat nějaký hover efekt pro ty obrázky, bude to jednodušší a nebudu tam muset rvát JS. Tím se vyřeší i ten "zbytečný" hack.

Mimochodem nevychází ti šířka stránky.
Jo o tom vím a jsem z toho už docela zoufalej. Prostě pořád se to v IE / ostatních prohlížečích zobrazuje jinak. Ještě se na to podívám.
Railbot
Profil
Sirius:
Musel bych těm dvěma inputům nastavit class a nastavit margin v CSS
Třídy jsou v tvém případě zbytečné, nemusel bys.

Prostě pořád se to v IE / ostatních prohlížečích zobrazuje jinak
Tomu se říká box model. Současný doctype ti IE hází do quirku. Pokud ho vyměníš například za
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


tak tím problém s rozdílným box modelem vyřešíš.
Sirius
Profil
Railbot:
Třídy jsou v tvém případě zbytečné, nemusel bys.
A zase máš pravdu. :) Ale kdybych chtěl přidat třetí, co už nebude o řádek odsazený, tak musím. Stojím si za tím, že je snazší při použití na ostro umazat <br> než to hledat a přepisovat v CSS.

Současný doctype ti IE hází do quirku.
Tak to jsem vůbec netušil. Žil jsem s tím, že PSPad za mě takové věci vyřešil. Jak koukám, tak vyřešil, ale ne jak bych chtěl.

Asi tam hodím ten doctype z příkladu na JPW - je kratší. Nebo myslíš, že by s tím mohli být nějaké problémy do budoucna? Např. s novými verzemi prohlížečů? Ten doctype mi nikdy nic neříkal. Edit: Použiju to tvé. Konečně jsem to dohledal na W3. OT: Mimochodem nebyla tu dřív možnost škrtnout text?

Nastudoval jsem si teď něco o tom quirk módu, proč to tak je, jak se toho zbavit atd., ale nikde jsem nenašel, co bych teda měl používat pro HTML4. Nebo má smysl začít používat XHTML? Nikdy mě to nelákalo, nevidím rozdíl v tom co použiju, hlavně když ten kód bude sémantický, web se dobře zobrazí a poslouží návštěvníkovi.
Chamurappi
Profil
Reaguji na Siria:
Asi tam hodím ten doctype z příkladu na JPW - je kratší.
Ten kratší právě vyvolává quirk. Jestli chceš standardní režim, použij ten, který ti doporučuje Railbot, nebo tenhle kratší:
<!doctype html>
Box model můžeš přepnout i opačným směrem.
Na tvém místě bych se tak či onak zkusil vejít do 780 pixelů, protože pak by se web vešel i do rozlišení 800×600. Ocení to sice v dnešní době už jen zanedbatelné procento lidí, ale ty těch 20 pixelů ani moc nepotřebuješ.


Reaguji na Railbota:
- s ohledem na IE6 není dobré zadávat velikost písma v px
Všechny verze Exploreru při zvětšování písma nezvětšují písmo v px, nejen šestka.

- název webu jako <h1> a <h1> jako nadpisy v obsahu nejdou dohromady, buď jedno nebo druhé
Oboje dohromady nejde. Sémanticky to nedává smysl.
Proč to nedává smysl? Některé weby mají v <h1> nadpis webu a v <h2> nadpis článku, jiné to mají naopak, takže není ustálená konvence, který z těch nadpisů je důležitější. Představ si to třeba jako jeden hlavní rozdělený nadpis a pak to smysl dává.
Railbot
Profil
Chamurappi:
Všechny verze Exploreru při zvětšování písma nezvětšují písmo v px, nejen šestka.
Opravdu? Žil jsem s vědomím, že další verze už px za absolutní jednotku nepovažují. O iluzi méně, díky.

Proč to nedává smysl? Některé weby mají v <h1> nadpis webu a v <h2> nadpis článku, jiné to mají naopak, takže není ustálená konvence, který z těch nadpisů je důležitější. Představ si to třeba jako jeden hlavní rozdělený nadpis a pak to smysl dává.
Přesně tak. Pokud někde je <h1> nadpis webu a další nadpisy <h2>, pak mi to smysl dává. Stejně tak pokud nadpis webu není žádný nadpis a nadpisy, dejme tomu těch článků, jsou <h1>. Nadpis webu a další nadpisy v obsahu nejsou stejná úroveň, aby mi dávalo smysl mít všechno v nadpisu stejné úrovně. Ale jak jsem psal výše, prakticky je to jedno. Vím, že na tom prd záleží, takže nemá cenu nad tím dál rozvíjet debatu.
Sirius
Profil
Chamurappi:
Na tvém místě bych se tak či onak zkusil vejít do 780 pixelů
Ok, pokusím se.

Všechny verze Exploreru při zvětšování písma nezvětšují písmo v px, nejen šestka.
Na tom něco bude. Když nad tím přemýšlím, tak přes CTRL - kolečko se zvětšují i obrázky a všechny prvky na stránce, tudíž to je spíš nějaké přibližování... Ale jelikož IE nepoužívám už pár let, tak o funkci zvětšování pouze písma, pokud existuje, nevím. Ani nemám možnost to na tomhle počítači vyzkoušet - IE ho zaseká.

Ohledně mé poslední otázky - asi založím samostatnej topic, on se i trochu změnil obsah otázky a na ten jsem odpověd nenašel.
Railbot
Profil
Sirius:
Když nad tím přemýšlím, tak přes CTRL - kolečko se zvětšují i obrázky a všechny prvky na stránce, tudíž to je spíš nějaké přibližování
Moderní prohlížeče používají defaultně zoom, tj. zvětší vše na stránce, ne pouze text.

ale nikde jsem nenašel, co bych teda měl používat pro HTML4. Nebo má smysl začít používat XHTML?
Doctype pro HTML 4 jsem ti napsal. XHTML nemá smysl začít používat, takhle si ušetříš pár lomítek.
Sirius
Profil
Railbot:
zoom
Přesně tohle slovíčko jsem měl na mysli. Většina uživatelů zvětšování stránky - jakýmkoliv způsobem - vůbec nezná, nebo na něj přisla náhodou, že "při scrollování se jim to všechno zmenšilo". Když už tak zoomují, takže většina uživatelů nebude mít se zvětšováním textu (sice nejen textu, ale to se v některých případech dá považovat i za plus) problém ani když je velikost písma v pixelech. Když zvolím font, který se dobře čte, nastavím mu dostatečnou velikost, správné řádkování, případně mezery mezi písmeny / slovy, tak nevidím žádný problém v zadávání velikosti v px.

Když budu brát v úvahu nejvyšší čísla z TOPlistu, což je nyní okolo 13% pro IE6 - mimochodem docela rychle to klesá koukám - a zahrnu další faktory, jako je:
- nevědomost uživatelů,
- písmo, které pro většinu uživatelů nepotřebuje zvětšit
- pokud vím, tak většina webů má velikost písma zadanou v px, tudíž se uživatelé IE6, kteří si písmo zvětšit chtějí, denodenně potýkají s problémem, že jim to nejde a pravděpodobně pokud můžou přejdou na novější prohlížeč
tak dojdu k závěru, že uživatelů, kterým to dělá problém je zanedbatelné množství.

Doctype pro HTML 4 jsem ti napsal. XHTML nemá smysl začít používat, takhle si ušetříš pár lomítek.
Jo, díky. Jak jsem psal, dohledal jsem to už i na W3. O rozdílech a (ne)výhodách XHTML oproti HTML jsem si toho dost přečetl a souhlasím. Otázka je, co s tím "módním trendem". Dneska každej tvrdí, že kóduje v XHTML. Laik si řekne, že to XHTML bude asi něco víc, něco lepšího než HTML, právě kvůli tomu magickému X. Co s tím? Lhát a psát si HTML?
Chamurappi
Profil
Reaguji na Siria:
Většina uživatelů zvětšování stránky - jakýmkoliv způsobem - vůbec nezná, nebo na něj přisla náhodou, že "při scrollování se jim to všechno zmenšilo".
Většina uživatelů nezná skryté schopnosti kolečka myši (dost z nich ani netuší, že jde zmáčknout), ale je zvyklá šmejdit v menu, pokud něco chce změnit. V menu Exploreru najdou „Velikost textu“.

Když zvolím font, který se dobře čte, nastavím mu dostatečnou velikost, správné řádkování, případně mezery mezi písmeny / slovy, tak nevidím žádný problém v zadávání velikosti v px.
Problém bude pořád v tom, že nepůjde zvětšit.

pokud vím, tak většina webů má velikost písma zadanou v px
Ne.

tak dojdu k závěru, že uživatelů, kterým to dělá problém je zanedbatelné množství.
To je zajímavý závěr, ale žádný z těch faktorů, které zahrnuješ, nepopisuje potíže, které bys měl, kdybys definoval velikost písma v relativních jednotkách. Jinými slovy: co dáváš na druhou misku vah? To, že lidé nevědí, jak písmo zvětšovat, nebo že to neumí, je dost pitomý důvod, proč jim to znemožnit, ne? Oprava zabere méně času než pitvání důvodů pro ni.

Co s tím? Lhát a psát si HTML?
Skutečné XHTML používat nemůžeš kvůli nízké podpoře, takže buď můžeš užívat HTML a lhát, že to je XHTML (a třeba si to napsat i do <!doctypu>, to je fuk), nebo můžeš užívat HTML a nelhat.

Dneska každej tvrdí, že kóduje v XHTML.
Už ani moc ne. Pokud to, co tvrdí tvá konkurence, lze přesvědčivě popřít, nemáš důvod tvrdit to také.

Laik si řekne, že to XHTML bude asi něco víc
Laik zpravidla neví nic, ani nezná chronologii vývoje.


Reaguji na Railbota:
Žil jsem s vědomím, že další verze už px za absolutní jednotku nepovažují.
Žádný prohlížeč nikdy nepovažoval pixel za absolutní jednotku, vždy je relativní (minimálně) k rozlišení a velikosti monitoru — a v tomto duchu je i definována specifikacemi.
Railbot
Profil
Sirius:
V XHTML píší tři skupiny lidí. Ta první skupina používá XHTML, jelikož je to součást marketingu. Nemohou si dovolit psát v tom nemoderním a o písmenko kratším HTML, protože to před klienty a konkurencí nevypadá dobře. Druhá skupina jsou lidé, kteří fanaticky skutečně věří, že je XHTML něco víc. A konečně třetí skupinou jsou lidé, kterým XHTML blbě poradil někdo z první nebo druhé skupiny.

Pokud tě netíží důvody, které mají lidé v první skupině, pak za sebe bych ti doporučil psát tak, jak dosud - v prostém HTML.

Chamurappi:
Žádný prohlížeč nikdy nepovažoval pixel za absolutní jednotku, vždy je relativní (minimálně) k rozlišení a velikosti monitoru — a v tomto duchu je i definována specifikacemi.
IE zřejmě ano pokud px nezvětšuje. Že je px ve skutečnosti relativní jednotka jako em nebo % samozřejmě vím.
Chamurappi
Profil
Reaguji na Railbota:
IE zřejmě ano pokud px nezvětšuje.
Změním-li rozlišení, je pixel jinak velký — v tom je relativní. Na malém monitoru má web 10 centimetrů, na velkém 50 centimetrů — v tom je relativní. Ta definovaná „relativnost“ se neprojevuje tím, že jde písmo zvětšovat (ani u pixelu, ani u jiných jednotek v CSS). Možnost zvětšování písma a to, jestli je jednotka relativní či absolutní, spolu vůbec nijak nesouvisí.
Sirius
Profil
Chamurappi:
Pokud to, co tvrdí tvá konkurence, lze přesvědčivě popřít
Popřít to lze. Problém může být v tom, že se někdy ani nemusím dostat k možnosti to vysvětlit, když někdo bude brát v úvahu zrovna tohle.

Laik zpravidla neví nic, ani nezná chronologii vývoje.
Říkám magické písmenko X a ono v dnešní době asi "magické" je. Všechno je totiž super a eXtra. Teď mě napadá přirovnání k reklamám na holicí strojky - když někde uvidím holicí strojek X3000 a holicí strojek 3000, které budou napohled stejné, tak který si vyberu? Edit: A budou stejně drahé - abych zamezil odpovědi ten levnější. :-)

Railbot:
Hezké rozdělení.


Užiju rad obou a budu si psát v HTML. Možná budu uvádět (X)HTML a když si někdo XHTML vyžádá, vysvětlím mu proč ne, když si za tím bude stát, ok, udělám to v XHMTL.

Nastuduju si něco bližsího o těch jednotkách jiných než pixely. Uf, už jsem chtěl říct relativní jednotky. :-) Párkrát jsem využil jednotek em, ale nepamatuju si, jestli s tím byli nějaké potíže. Stejně asi zůstanu u pixelů.
« 1 2 »

Vaše odpověď

Mohlo by se hodit

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: