Nový design: druhý pokus (diskuse)

Diskuse byla administrátory uzamčena.

[Josef Kufner]

Prvni co me tak nejak prastilo pres oci je ta horni cast stranky... je takova rozsypanna. Chtelo by to, aby spodni hrana loga a spodni hrana radku "Rubriky, hw, ..., ankety, hledat" byly ve stejne rovine. A nadpisy v levem a pravem sloupci "Anketa" a "Reklama" taky.

Ta sediva v prostoru pod reklamou vypada znatelne lip nez "relaxacni folie", ale mozna by chtela trosku pribarvit do odstinu cele stranky.

Mozna taky o kousicek zvetsit mezery mezi odkazy "Rubriky, hw, slovnik,..." na ukor jejich velikosti, ale ne moc... jenom kousek.

btw. chybi mi tam ten roztomilej obloucek

[Josef Kufner]

tak me tak napada... co udelat ten pruh pro reklamu stejne jako je pozadi loga? Ten barevnej prechod by hohl vypadat dobre...

[Josef Kufner]

pak by se primo nabizela barva pro tu listu od stickfish... stejna jako horni okraj gradientu...

[undy]

Nelibi se mi novy vzhled abc linuxu je jeste vice neprehledný.

po strance kodu taky nevidim nejake extra zlepšení

Trendy na webu jsem si myslel že je zjednodušení atp a né to naplácat všechno na sebe, pořádně vobarvit (s myšlenkou barev je dycky malo ...) no je to prostě celý špatně.

Shrnuto - nelibi se mi to a to vubec.

[unchallenger]

Pořádně obarvit myslíš něco jako http://www.vesmirni-lide.cz/default_c.htm ?

Barev je skoro vždycky příliš mnoho.

[VícNežNic]

1. Je nějaký důvod proč bílé pozadí hlavního sloupce nepokračuje až k tomu černému pruhu dole? Dole tam vzniká divně prázdný prostor.
2. Ty nové boxy mají světlé barvy a jsou trochu laděné do šeda. Mimochodem jsou tak moc hezké, ale do té stránky se nehodí. Předělal bych ji celou do té šedé, nebo bych předělal boxy. Vypadají jak z jiného světa.
3. Nové zobraz je jenom větší více, zkusil bych ho dát někam napevno (třeba nalevo dolů ke každé zprávičce).
4. Zvýraznění položek v diskusi je hezké, ale bylo by hezčí, být celé odkazem.

Jinak je to výrazně hezčí, gratuluji.

[VícNežNic]

Zkoušel jsem si vytvořit světlejší verze panelů, ale nevím (vypadá to hůř, než jsem čekal). Každopádně mi tam ty světlé boxy stále nesedí. (Co naopak vypadalo řekl bych dost dobře, bylo dát tlačítku Zobraz styl display: block; width: 25%. Zkuste to taky )

[llook]

> display: block; width: 25%

Zkusil jsem to. Těch 25% se počítá z šířky sloupce, který je zadán v pixelech. Stačí zvětšit si písmo a už se do 25% (tedy 50px) nevejde. Navíc různí uživatelé můžou mít různá písma s různými proporcemi...

Jestli kýžený efekt, byl ten, že je to tlačítko na novém řádku, tak bych ho radši rovnou obalil do odstavce a žádnou šířku bych nedeklaroval.

[Josef Kufner]

vypadaji hezky, ale prijde mi, ze jsou kapku nevyrazne oddeleny od sebe... precejenom to LCD ma mensi kontrast nez CRT

[Josef Kufner]

Diskuzni forum vypada lip to stare. vyhazel bych hr a nechal jenom ty sedde tenke linky jako jsou ve starem foru.

[Josef Kufner]

Co takle udelat obloucky ke kazdemu cernemu pruhu v postranich sloupcich?

Mohlo by to vypadat tak, ze cerny pruh by mel vlevo na kraji v obrazku na pozadi nakresleny obloucek, ktery by mel vnejsi barvushodnou s barvou stredniho sloupce. A pak by byl tesne nad nim stejny obloucek, jen vzhuru nohama a v te brcalove modri.

Hmm? jeto jenom napad... troska grafiky navic

[Devilkin]

Už se na to dá dívat .
Jen mi ještě (mimo již napsaného) vadí nezarovnanost v pravém soupci v pozcesttníku. Uvítal bych, kdyby to bylo stejné jako ve starém, to jest zarovnané pod text, ne pod odrážku.

[llook]

Těžko říct, kde začít... Začnu technickým provedením:

CSS je především o změně přístupu k tvorbě webu. Třeba kód

  <div id="logo-pozadi">
    <div id="logo-tucnak">
      <a href="/"><span>ABCLinuxu.cz</span></a>
    </div>
  </div>

je úplně špatně. Docela by stačilo:

  <h1><a href="/">ABCLinuxu.cz</a></h1>

Velikost toho boxu s logem je stejnak fixní, takže není potřeba pozadí a tučňáka rozdělovat do dvou souborů (a tedy dvou HTTP požadavků). Podobných věcí by se v kódu našlo spousta.

Přestaňte myslet tabulkově! Sice je pěkné, že už layout není tvořen tabulkou, ale přesto v kódu je nejdřív levý sloupec, pak prostřední (imho nejdůležitější) a pak pravý.

Jedna z nejvýznamnějších výhod CSS layoutu je, že umožňuje umístit v kódu nejdřív to nejdůležitější a pak zbytek, i když to nejdůležitější má být graficky uprostřed.

To oceníte, až si stránku prohlídnete v Linksu. Kvůli linksákům a podobné verbeži bych asi také přidal odkazy typu "skoč na navigaci", skryté pomocí CSS.

Pokud se chci podívat přes Lynx, vyháže to na mě nějaký chyby (prý jsou zalogovány, takže to sem kopírovat nebudu).

---

Co jinak: Nový návrh je vlastně stejný jako ten starý, pouze jinak provedený a s mírně odlišnou grafikou (konečně zmizeli kulaté rohy, hezčí logo...). Možná by se mělo uvažovat o odlehčení po stránce obsahové. Třeba deset zpráviček je podle mě moc. Nejvýše tak pět a odkaz na další zprávičky. Diskuze by mohla být celá na vlastní stránce atd. atd. atd.

[Leoš Literák]

Pocet zpravicek je nastaven tak, aby oba sloupce byly priblizne stejne dlouhe. Nicmene pokud se prihlasite, ve svem profilu mate moznost nastavit si vlastni pocet zpravicek. Treba na nulu ci dvacet. Jak je libo.

[lamka]

hmmm, tohle vyprávějte jinde. v CSS není ŽÁDNÁ cesta, jak umístit v kódu to nejdůležitější nahoru....

někdy to jde, ale většinou ne. oddělení vzhledu a obsahu je jen zbožné přání...

jinak design je ok. pokud to tak chcete nacpat textem, tak vám to neberu. není to horší než stará verze a je to css. další předělávka se bude dělat líp..

[Robert Krátký]

Velikost toho boxu s logem je stejnak fixní, takže není potřeba pozadí a tučňáka rozdělovat do dvou souborů (a tedy dvou HTTP požadavků). Podobných věcí by se v kódu našlo spousta.

Když už ses díval do zdrojáku, tak sis mohl v CSS souboru všimnout komentáře, že je potřeba převést logo do statické velikosti. Tento hybrid tam ještě zůstal z doby, kdy byl levý sloupec dynamicky rozšiřovatelný, a proto to bylo nutné. Jinými slovy - je to dočasné.

Co se týče pořadí jednotlivých sloupců v kódu stránky za sebou, pak v tom se velmi mýlíš, že si je mohu s CSS naskládat za sebe libovolně. Nemohu. Alespoň ne při použití layoutu, který teď používám. Dokonce to bohužel musím mít tak, že jsou řazeny levý, pravý, prostřední.

------------

Každopádně jsem však měl v článku zmínít, abyste nekomentovali v této fázi čistotu kódu a CSS. Je tam milión komentářů, CSS není optimalizované apod. Vím o tom. Teď jde pouze o svrchní slupku.

[Slávek]

Nějak mi nesedí ta čárkovaná čára ve Zprávičkách. Budí dojem, že také odděluje jednotlivé Zprávičky. Nestačilo by jen odlišná barva pozadí titulku Zprávičky?

Co mi však vadí (i na původním vzhledu), je odkaz na "wap.abclinuxu.cz" nacházející se uprostřed zpráviček. Způsobuje tam nelogické oddělení jednotlivých zpráviček. V novém vzhledu navíc vypadá, jako že patří do příslušné zprávičky.

Menší písmo v bočních lištách sice umožní zobrazit více informací, ale stránka je pak na můj vkus velmi přeplněná a rázem nepřehledná.

[Pavel Dobeš]

Kdyz jsem se prvne podival na novy design, tak me vice nez zluty pruh upoutal sedy prostor pod nim vedle reklaniho banneru. Takhle se mi zda ta stranka cela jako utrzena.

Udelam takove popisne kolecko...

Cleneni zparavicek se mi zda dobry, akorat bych 'zobraz' udeal mene vyrazne.

Kdyz se podivam na anketu nad nimi, tak misto zlute bych dal jinou barvu. Mozna ze by za to stalo tam dat jiny odstin modre a zviraznit to ohranicenim (1px) a zase bych zmencil 'Hlasuj' (mozna upravit take podobne jako ukazatele hlasu.

Logo je dobry, ale nezapada do toho 1px designu... :( Mozna trozku zmencit linku okolo a sjednotit ji barevne s nejakou barvou pouzitou v designu.

Listu bych barevne zmenil na nejkaou sedou/modrou... pokud by to byla jedina zluta, moc by rusila pri prni navsteve serveru.

O reklame pod listou jsem se jiz zminoval... jak to ale vyresit me nenapada... mozna zrusit tu listu a Rubriky Hardware Diskuse Slovník Ovladače Abíčko Ankety umistit pod logo (?) a misto te listy dat decentmi linku a pravy sloupec zacit pod listou stickfishe.

Ten box zacinajici reklamou na Sun je lepsi nez v stavajici verzi (pokud musi byt takoto umisten). Vzdyt pokud neco na tomto serveru *opravdu* hledam, tak me ani nefungujou xka a jsem rad ze me funguje sit z konzole :)

Mozna bych udelal tmavsi nadpisy pro clanky a neni oddeleno diskuzni forum + mensi font pro jednotlive diskuze...

Vpravo bych roztahl reklamu (C++ ...), zmenil barvu u nazvu serveru v rozcestniku podle hlavicek zpravicek

Dole bych dotahl stredni bily pruh az k paticce...

Dalsi postrehy: v novem designu je dana do pozadi moznost registrace a prihaseni. Zmizelo pokrocile vyhledavani (ikdyz si nevzpominam, kdy jsem ho naposledy pouzil) a cas, kdy se stranka vygenerovala, coz jeskoda, nekdy je to potreba.

Snad jsem pres pokrocilou hodinu na nic nezapomel... PaD

[k3]

pred spanim tu posilam par poznamek k novemu designu.. uz na to skoro nevidim... takze to berte jako kdybych to psal v polospanku... no vlastne taky jo :)

1. ten zluty pruh nahore je celkem rusivy.. co ho tak zrusit nebo mu dat alespon jinou barvu ?

2. ty bile nebo sede (nebo co to ma byt zabarvu) tlacika jsou celkem neprijemne.. co treba zkusit priblizit jejich barvu barve pozadi ? mohlo by to vypadat lip...

3. u zpravicek je hezke, ze je rozdelena hlavicka a text, ale prilis se me mezi tim nezda ten bily pruh.. spis to vypada jako by kazda cast mela byt samostatne. navrhuju ten bily pruh bud odstranit nebo jemu alespon zmenit barvu...

4. prostredni byly pruh by mohl pokracovat az po konec. pokud neni nejaky zavazny duvod proc by tomu tak byt nemelo. mozna by taky nebylo spatne kdyz by i na ostatnich strankach byl uprostred ten bily pruh...

5. nevim jestli je tohle spravne jak by se mely chovat diskuze... http://hakone.sh.cvut.cz/abclinuxu.png

[Leoš Literák]

ad 5\ ve clanku je napsano, ze nemate zkouset jine stranky nez uvodni, nebot nemusi fungovat.

[vdusek]

- jednim slovem :(.

Pokud na tenchto strankach budu neco hledat, tak se v tom ztratim.

To musi byt na te jedne strance tolik textu a odkazu? Uvedomte si, ze mene, je nekdy vice.

[Tomáš Bžatek]

Uh oh... :-x Co me to prastilo od oci?

Je hezke, ze se snazite o novy design, ale vsechno je to takove preplacane, ta zluta mne tam vubec nesedi a celkove je tam min mista, nez na starem designu.

Ale musim pochvalit to logo, opravdu je hezci.

[Petr Jakubec]

Take bych se rad mrknul, ale jsem za fw, 8080 je mimo muj dosah. proc to mate na :8080? Nejde to proste na na :80?
Myslim, ze to zbytecne "diskriminuje" lidi za fw/proxy...
PJ

[Aloner]

Naprosty souhlas! Asi nikdo ze Stickfish nepredpoklada, ze by nekdo mohl sedet za fw/proxy. To je teda diletantismus... :-/

[Leoš Literák]

Naprosty nesouhlas. Nenapadlo te, ze treba na portu 80 bezi neco jineho?

A laskave si odpust urazky, diky.

[Hanser]

Budu upřímný, jediné co se mi na tom líbí jsou na malá okénka vpravo od středu stránky-jinak bych raděli nechal starý vzhled.

[satori]

jestli se v něčem opakuju, pak se omlouvám, ale spěchám do školy...

vršek je podivně neucelený. když už, tak bych i pravý sloupec dal výš než text a nechal bych místo na banner pouze uprostřed - z hlediska estetičnosti. ale i tak by to zůstalo celkem dost nepoužitelný, ten banner bych strčil někam do textu.

barvy na pozadí diskuse (tmavá modrošedá) jsou podle mě příšerný, dal bych světlé pozadí.

v diskusi máte nějakou chybu, takže se nezobrazí.

zbytek - nechodím sem kvůli barvám, takže mi tolik nevadí, že je jich tu moc a že spolu neladí. zprávičky jsou čitelnější než byly, možná by snesly i malinkatý zmenšení. vršek (autor, rubrika...) by měl být určitě menší nebo kratší (co kdyby se objevoval jenom při hoveru?). položky diskuse na titulce mají moc velké rozestupy. standardní písmo je možná až trochu moc velký (jak nadpisy, tak písmo v textu). myslím, že vyhovující je přesně, jako je teď

[Milan Vančura]

Obávám se, že takto se nehnete z místa. V současnosti by soupis prohřešků proti Zásadám W4D byl na několik stran, lepší bude, když si autoři nejdřív W4D najdou, nastudují, promyslí a vyrobí nový design od základů, už s povědomím o tom, že design je mnohem víc, než screenshot z jednoho prohlížeče v jednom nastavení.

Možná vám to přijde strašně obecné, ale věřte: toto je druhá verse mého příspěvku. Když ta první - konkrétní seznam prohřešků a jejich praktického dopadu - začínal přetékat na druhou A4, smazal jsem ho a nahradil předchozím odstavcem.

Dokud se přístup autorů nezmění, je celá diskuse pokusem naladit dřevěný špalík se třemi nataženými provázky na zvuk Stradivárek. Nebo jinak: četli jste od Feynmana o ostrově s dřevěným letištěm, dřevěnými anténami a naštvaných domorodcích, že jim nikdo nechce poradit, jak přihoblovat vysílačku, aby konečně fungovala?

[Milan Vančura]

Vzpomněl jsem si: jmenuje se to kult Cargo a podle toho Feynman popsal "Cargo cult science": http://www.physics.brocku.ca/etc/cargo_cult_science.html

Krátkou citaci jsem dal na konec příspěvku, ale myslím, že celý článek stojí za přečtení, zdaleka ne jenom kvůli designu abclinuxu!

During the war they saw airplanes with lots of good materials, and they want the same thing to happen now. So they've arranged to make things like runways, to put fires along the sides of the runways, to make a wooden hut for a man to sit in, with two wooden pieces on his head to headphones and bars of bamboo sticking out like antennas--he's the controller--and they wait for the airplanes to land. They're doing everything right. The form is perfect. It looks exactly the way it looked before. But it doesn't work. No airplanes land. So I call these things cargo cult science, because they follow all the apparent precepts and forms of scientific investigation, but they're missing something essential, because the planes don't land.

[Leoš Literák]

uz jen slovo dogma me odrazuje od toho, abych to vubec cetl.

[Milan Vančura]

Mě to odrazovalo asi půl roku - a ani dnes netvrdím, že je to samospasitelné. Samospasitelná není ani louka, i ta potřebuje krávu Taky to autoři W4D netvrdí. Důležité je, že ačkoliv je to jen jedna z možností, je to kvalitní možnost. A když něco to nesplňuje výrazně, je dobré si to promyslet, jestli opravdu mám tak dobrý důvod. Co se abclinuxu týče, úplně slyším Ijáčka z Medvídka Pú: "Pochybuji."

Když to přeženu: doba, kdy se <td width=150><font color=green> nahrazovalo konstrukcí <div style="width: 150px"><span style="color: green">, už je doufám pryč

[Robert Krátký]

Popravdě bych rád věděl, kde v designu bys našel něco, na co by šel aplikovat tvůj příměr s tabulkou a div.

Celý design jsou dva plovoucí sloupce po stranách a jeden dynamický uprostřed. Implementace je trochu komplikovanější, ale to vycházelo z nutnosti/požadavku replikovat (z hlediska základního rozložení prvků) původní verzi nového designu.

[Milan Vančura]

To se opravdu ptáte? Vždyť např. celý levý sloupec je jen skladba z <div> elementů. Co si z toho má browser odnést?

Nejsem profík, ale následující nástřel alespoň zachová strukturu dokumentu a prohlížeči sdělí něco smysluplného:

<div id="leftcol">
<h1><a href="/">ABCLinuxu.cz</a></h1>
<h2>Anketa</h2>
<form action="/EditPoll" method="POST"><!-- anketa --></form>
<h2>Zprávičky ABC Linuxu</h2>
<ul>
<li><a href="/zpravicky.jsp">Centrum</a>
<li><a href="/news/edit?action=add">Přidat</a>
<li><a href="/History?type=news&from=10&count=15">Další</a>
</ul>

<h3>16.8. 11:18 | Upozornění<br><a href="/Profile/2312">Jan Beránek</a> | Komentářů:&nbsp;0</h3>
<p>Nova verze abicka je teprve na pocatku vyvoje a testovaci verze je na ceste.&nbsp;<a
href="/news/show/63124" class="tlac-sloup">zobraz&raquo;</a></p>

Opravdu je dobré si to W4D promyslet. Napr. tento nástřel vím, že odporuje pravidlu "H1 se smí použít pouze jednou na stránce, většinou je stejný jako titulek stránky" a musel bych si pečlivě rozmyslet, jestli to pravidlo opravdu chci vědomě porušit nebo ne. Taky při té příležitosti bych si uvědomil, jak je ta stránka přecpaná informacemi, že bych potřeboval nadpisy možná pěti úrovní - na jedné stránce! A začal bych přemýšlet nad rozdělením stránky atd. atd. Základ je uvěřit, že už někdo přede mnou přišel na zajímavé zákonitosti designu.

[brk]

Proti první verzi jsem měl jen dvě výhrady. Když jsem dal zvětšit text, tak se mi všechno promíchalo a bylo to nečitelné. Teď už jen občas ujíždí „zobraz“ v levém sloupci. (Mozilla Firefox/1280*1024/full screen) A pak to divné pozadí pod reklamním bannerem, což už je naštěstí pryč úplně. :o)

[xwitch]

Jenom se neptejte na názory. Nikam to nepovede. A pokud byste náhodou našli konsenzus, bude to eklektismus až běda. Takové plagiální stránky jsou rovněž k ničemu. Tedy buďte sví, ať se s tím čtenáři vyrovnají. Nejde přeci o kabát, ale o obsah.

[Petr Mach]

Ridit se kazdym nazorem je stejna hloupost jako se na nazor neptat vubec. Nazory mohou prinest novou inspiraci i vyresit problem, s kterym si uz unavena hlava nevi rady.

[Leoš Literák]

souhlas. Jde hlavne o to, odchytat co nejvice chyb, otestovat co nejvice moznosti. Prvni verzi testovalo mozna pres deset lidi a nikdo si nevsimnul problemu po zvetseni fontu. Aby se zalibil vzhled vsem, to je absolutne nemozne, tak se o to ani nebudeme snazit.

[Robert Krátký]

Pro všechny, kteří reagovali na vzhled diskuzí: v úvodu jsem psal, že není třeba je komentovat. Skutečně. Zatím jsem na ně ani nesáhl.

[Petr Mach]

1. Roztristeny vrsek. Ten cerny pruh musí být jedna linie, vcetne nadpisu Anketa. Muzete to udelat treba tak, ze trochu zmensite logo a posunete ho nahoru. Ten zluty pruh bude pak bude napravo ud loga.

2. Cerne nadpisy ve sloupcich vypadaji jako mene dulezite nez ty modre.

3. Zpravicky maji zmatecny layout, tezko se clovek orientuje v tom co je co, kde vlastne zacina a konci. Jsou moc natesnane.

4. Ten odkaz zobraz je zdurazneny az presprilis. Bila barva textu, popr. tucny font by docela stacilo. Krom toho neni intuitivni, clovek nevi co po kliknuti na nej ziska a proc na nej vlastne klikat. Bud lepsi nazev by to chtelo a nebo aspon title.

5. Menu i kdyz je uz vetsi je porad takove utopene a nevyrazne.

6. Ty boxiky mi prijdou OK.

7. Seznamy budou vypadat citelneji a prehledneji (a tim i cela stranka), kdyz budou nasledujici radky zarovnany s prvnim a puntik tak bude v sloupci sam, tak jako to je u stareho layoutu. Nebojte se prostoru, ten stranka musi obsahovat, jinak nikdy nebude vypadat dobre, dostante tam trochu vzdusnosti.

8. Diskuzni forum je nedostatecne oddeleno od seznamu clanku a jednotlive diskuze zas az zbytecne vyrazne.

9. Zvazte, zda by nebylo dobre mit v seznamu clanku jen cca ctyri plne velikosti tak jak jsou a pod nima cca 6 dalsich, ale uz jen nadpisy.

10. Sekci redakce bych hodil dolu, je to tak obvykle a clovek tyto informace stejne hleda dole (vlevo). Ted koukam, ze u stareho designu to dokonce mate spravne.

[Zdeněk Štěpánek]

Zdravim

Je to vyrazne lepsi nez ten prvni popus, ale porad je to takovy divny.

1) pismenka jsou ted pro zmenu moc velky, nechal bych je vsechny tak jak je to ted. zpravicky by treba jeste usly, ale clanky jsou obrovsky a je to necitelny. Kdyz dam dvakrat Ctrl- tak je to tak akorat, takze zmensit.

2) kladne hodnotim ty obdelniky ve sterdnim sloupci, je to jak to bylo, akorat si opravte ty otazniky. Nehlede na to ze mi prijdou zbytecne (vyrusuje to) tak neketry jsou vertikalne centrovany nektery ne.

3) U zpravicek bych odstranil tu teckovanou caru ale barvicky bych nechal.

4) stredovy bily pruh by mel koncit az uplne dole, ted to vypada jako by byla posledni zpravicka pres celou sirku monitoru.

5) Ty strasny tlacitka Zobraz>> bych nahradil textovym odkazem jak to bylo drive. a proboha, zadnou zlutou.

6) Prihlaseni bych dal nekam at je to vic na ocich.

7) Provedl bych odtucnovaci kuru a vyhazel nepotrebvny odkazy. To jest v prve rade ta strasna zluta lista nahore.

8) Podle me je to vsechno naplacany na sebe, takze bych vsechny plochy udelal vetsi aby tam bylo mezi blokama vice mista.

9) Mene znamena nekdy vice. Asi si to dam do paticky.

P.S.: Kam zmizely kernely? IMHO by nebyl spatnej napad vsechny ty obdelniky nacpat jako dalsi servery v rozcestniku a do stejneho designu.

Firefox 1.0PR@Linux, 1024x768

Zdenek

[skonciljsem]

1. Mozilla mi hlásí:
   Error: unterminated string literal Source File: http://beta.stickfish.cz:8080/ Line: 204, Column: 43 Source Code: window.sidebar.addPanel("www.abclinuxu.cz",'http://www.abclinuxu.cz/?
2. Zprávičky už přečtu, díky
3. wap.abclinuxu.cz podivně rozděluje Zprávičky. Nešlo by to přemístit třeba nad ně, nebo do Rozcestníku?