Kritika webu http://mainos.cekuj.net/

HTML a CSS Kritika webů - ukažte se! http://mainos.cekuj.net/ American English version English version

Jak se ti líbí web?
Celkové hodnocení (7 hlasů):
2.142862.142862.142862.142862.14286
Přejít na web:
http://mainos.cekuj.net/
Avatar
Michal Kuba
Redaktor
Avatar
Michal Kuba:

Ahoj.
Pomalu finišuji se svou maturitní prací a rád bych vás poprosil o konstruktivní připomínky, zejména k designu. Můžete ozkoušet funkčnost, ovšem ne všechny funkce možná nebudou dobře pracovat. Nadále chci tento server rozvíjet, zaplatit si lepší doménu a propagovat stránku a zanést do povědomí alespoň zlomku uživatelů internetu.

Děkuji.

 
Odpovědět 2.3.2015 21:56
Avatar
BlugW
Redaktor
Avatar
Odpovídá na Michal Kuba
BlugW:

Projel jsem to tak zběhle, funkcionalitou je to na první vzhled ok.
Ale pokud ho chceš rozvíjet dál, tak určitě předělej design na moderní.

PS: Proč všichni co znám dělají web doma, a já ho budu muset dělat ve škole v pspadu nebo vs 2010 web developer, bez připojení k netu a celkově na to bude 6hodin? To je de*ilita.

Editováno 3.3.2015 1:37
Nahoru Odpovědět 3.3.2015 1:36
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
Inoue Yūki
Redaktor
Avatar
Odpovídá na Michal Kuba
Inoue Yūki:

Ahoj, Michale,
nejprve ti chci pochválit rozvržení stránky, je opravdu dobře, přehledně udělané. Na druhou stranu samotný design dost pokulhává a to v několika bodech:

  • barevná paleta působí zastarale (všimni si, že velké weby jako Google, seznam, atlas, atd. mají bílé pozadí, je k tomu důvod :) )
  • patičkový font se užívá pouze při tisku, protože se lépe čtou řádky, na web bych užil spíše bezpatičkový font
  • při menším rozlišení mi menu a logo lítá jak si chce
  • pokud to opravdu nepotřebuješ, tabulky nepoužívej

No, musím na autobus, potom možná ještě něco dopíšu. :)

Nahoru Odpovědět  +1 3.3.2015 6:19
Avatar
Majkl
Člen
Avatar
Majkl:

V mojem malém rozlišení logo není vůbec celé a menu je rozskočené, musíš myslet i na takové, co mají malej komp :D

Nahoru Odpovědět 3.3.2015 7:44
Lidé jsou jako stromy, když do nich sekáš sekerou, umřou.
Avatar
Michal Kuba
Redaktor
Avatar
Odpovídá na Inoue Yūki
Michal Kuba:

Jsem rád, že alespoň rozvržení je dobré :) Patky jsem oddělal, nějak vymyslím to přizpůsobení na menší rozlišení.. úplně si nejsem jist jak, ale zkusím některé šířky a výšky změnit z pixelů na procenta, že?
Tabulky myslíš viditelné? Nebo na úvodní stránce to, že ty jednotlivé čtvrce jsou vlastně v tabulce?

 
Nahoru Odpovědět 3.3.2015 20:06
Avatar
Michal Kuba
Redaktor
Avatar
Odpovídá na BlugW
Michal Kuba:

Ještě bych se chtěl zeptat, zda nevíte, jak vytvořit navigaci mapující historii pohybu. Aby se zobrazovalo například pět posledních navštívených částí webu. Obrázek snad bude pochopitelnější (je to jen foto, tohle tam ve skutečnosti není)..

Jde to udělat přes PHP nebo jak? Děkuji

 
Nahoru Odpovědět 3.3.2015 20:45
Avatar
Jan Vargovský
Redaktor
Avatar
Odpovídá na BlugW
Jan Vargovský:

Protože všichni ostatní na to mají celý rok doma. Ty si zase posedíš pár hodin ve škole a nemusíš celý rok nic řešit (pro mě lepší varianta, když rozumíš tomu co děláš).

Sorry za OT.

 
Nahoru Odpovědět  +1 3.3.2015 20:48
Avatar
Ori
Člen
Avatar
Odpovídá na Michal Kuba
Ori:

to BlugW: nuž tak ak bez netu bez bootstrapu, jquery, ach, to ti nezávidím :D

a teraz k téme, pokiaľ to má byť maturitná práca, tak sa snažím o validitu. (poväčšine to sú alt atribúty pri obrázkoch

taktiež pomerne neopodstatnené použitie HTML5 tagov, napríklad article na homepagy ako wrapper pre obsah.

  • to čo bolo spomenuté hore vyššie
 
Nahoru Odpovědět 3.3.2015 20:52
Avatar
BlugW
Redaktor
Avatar
Odpovídá na Jan Vargovský
BlugW:

Na jednu stranu to je lepší, na druhou bude mě bolet zadek od těch nepohodlných židlí :D

PS: Michal Kuba Pro maturitní práci si hlídej určitě tagy v headu (description, keywords), dal samozřejmě v obrazcích alt jak už bylo řečeno.
Ten article je snad jen chybka která se omylem vloudila :D

Ale jinak nevím, ale hodnotit se bude asi víc PHP nebo ne?

Nahoru Odpovědět 3.3.2015 22:01
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
Mego
Člen
Avatar
Mego:

Je mi to velmi luto, vidno, ze sa snazis a za to ti patri vsetka cest :) Nemozem vsak dat viac ako 1 hviezdu a to z niekolkych dovodov

  1. Dizajn z roku 2002. Nikde nie je napisane, ze musi byt biele pozadie, aby si mal dve hviezdy. Odporucam sa inspirovat nejakymi inymi webmi.
  2. Ikony musia byt rovnakeho typu. Nemoze sa stat, aby jedna ikona bola v ciernom kruhu, ina modra, ina zasa roztiahnuta, ze je rozmazana a ina lacno "orezana" v skicari
  3. Polozky menu nesedia. Posledna polozka menu sa mi zarovnava pod cele menu. Treba to upravit, idealne na percenta
  4. Defaultne modre a fialove visited odkazy su hnusne a vzdy aj boli. V sucanosti sa uz viacmenej nerobia rozdiely medzi a:link a a:visited. A podciarkovanie v hoveri by som datoval do roku 2008 maximalne. Takze odkazom pridat nejake pekne farby a nech sa menia len pri hoveri
  5. Je pekne, ak sa dodrziava standardna sirka webu. Tie ikony mam na skoro 100%, menu na kus menej. Do footera kde je tvoje meno sa neostychaj hodit aspon 20px padding
  6. Kontaktny formular: Urcite odstranit ten hnusny send button. Teda aspon mu zmensit sirku standardnych inputov. To sa da dosiahnut pomocou selektora input[typt="sub­mit"]. Ta ikona gigantickej ciernej obalky sa tam prinajmensom nehodi a nahradil by som ju nejakou adresou, alebo cim. Tiez by som zjednotil farby inputov a textarea-y
  7. Nejnovejsi inzeraty hadze internal server error
Nahoru Odpovědět 4.3.2015 13:22
Radšej 15 minút skôr, ako 15 sekúnd neskoro...
Avatar
Michal Kuba
Redaktor
Avatar
Odpovídá na Mego
Michal Kuba:

Jedna hvězda mi nevadí, rady a poznámky jsou skvělý!
Co se týče ikon u kategorií, zrovna jsem čekal až mi kámoš dodá várku zbylých čtyř (už jsou všechny stejně udělané).

S designem jsem nikdy nebyl příliš kamarád, právě proto mi stejnej kamoš trochu pomáhal něco doladit, nevím ale jak pozměnit kompletně barvu pozadí (nevím na jakou).

Co se týče položek v menu tak si s tím nevím dlouho rady.. Zkusím přidat kus CSS jestli z toho bude vidět nějaká chyba a případná úprava:

nav ul{

   list-style-type: none;
   background: #CEA151;
   min-height: 35px;
   /*min-width: 960px;*/
   min-width: 80%;

}


nav ul li {
    padding: 5px 30px;
    margin: 0px 15px;
    float: left;
   border-right: 1px solid grey;
   min-height: 20px;
   min-width: 5%;

}
nav ul li a:hover{
    color: #257ea4;
}

nav ul li a {
    text-decoration: none;
    font-size: 20px;
    font-family: Calibri, Arial;

  padding: 5px 30px;
    line-height: 10px;
    display: block;
    color: #fff;
    transition:.3s;

}

Odkazy jsem změnil všechny na černou barvu, při hover zbělají. Stejně tak u tlačítka reagovat jsem odstranil podtržení a nastavil to stejně, navíc jsem odkaz trochu odsadil oproti jménu autora.

Do patičky jsem přidal padding aby to bylo prostornější.

S formulářem si trošku pohraju. U textarea jsem zatím nastavil, aby se při chybové hlášce nevymazal její obsah --> každého by naštvalo zadat dlouhou zprávu nebo inzerát a například kvůli nevyplněnému městu by se mu text inzerátu smazal.

Nevím proč ti nejnovější inzeráty nejdou :/

Jediné tedy co, tak nevím jak poladit procentuálně to menu, aby se nikdy takto nerozpadlo při menším rozlišení.

 
Nahoru Odpovědět  +2 4.3.2015 20:29
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Michal Kuba
Jiří Gracík:

Jestli to je maturitní práce, tak bych to už ani nijak neřešil. Z tohohle budou skoro všude odvařený.

Nahoru Odpovědět 4.3.2015 22:06
Creating websites is awesome till you see the result in another browser ...
Avatar
Michal Kuba
Redaktor
Avatar
Odpovídá na Jiří Gracík
Michal Kuba:

Trošku z toho, že budou všichni odvaření tak cítím ironii.. Ale předělal jsem teď trochu design a to i barvy pozadí a hned se to i mě více líbí.. zkuste se podívat třeba: mainos.cekuj.net

Jinak i potom, co snad odmaturuji nebo alespoň dokončím dlouhodobou práci obhajobou tak chci na projektu dále pracovat a vylepšovat co se dá.. Proto také chci tu kritiku - kdyby to bylo pouze pro školní účely tak to tolik nehrotím :)

 
Nahoru Odpovědět 4.3.2015 22:34
Avatar
Neaktivní uživatel:

Na tvé stránce je hodně obrázků, které neobsahují alternativní popisek, takže se vyhledávače a hlasové čtečky vůbec nedozví, co na obrázcích je. Správně je:
<ims src="slozka/o­brazek.png" alt=Alternativní podpis>

Nahoru Odpovědět  +1 5.3.2015 19:35
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel:

A ještě něco: nemáš tam nadpis <h1> který je dle mého důležitej ale jinak dobrý

Nahoru Odpovědět 5.3.2015 19:36
Neaktivní uživatelský účet
Avatar
Daniel Vítek
Tým ITnetwork
Avatar
Odpovídá na Neaktivní uživatel
Daniel Vítek:
  1. né ims ale img
  2. vkládej to jako zdrojový kód ..
 
Nahoru Odpovědět  +1 5.3.2015 21:04
Avatar
Odpovídá na Neaktivní uživatel
Michal Šmahel (ceskyDJ):

Je, ale v některých případech se prostě nehodí.

Nahoru Odpovědět  -5 5.3.2015 21:05
Nejdůležitější je motivace, ovšem musí být doprovázena činy.
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Michal Kuba
Jiří Gracík:

Ironie v tom nebyla. Úroveň IT na většině škol je k breku.

Nahoru Odpovědět  ±0 5.3.2015 21:22
Creating websites is awesome till you see the result in another browser ...
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Neaktivní uživatel
Jiří Gracík:

Všechny hodnoty html atributů musí být v uvozovkách

Nahoru Odpovědět  ±0 5.3.2015 21:25
Creating websites is awesome till you see the result in another browser ...
Avatar
Daniel Vítek
Tým ITnetwork
Avatar
 
Nahoru Odpovědět  ±0 5.3.2015 21:33
Avatar
IT Man
Redaktor
Avatar
Odpovídá na Daniel Vítek
IT Man:

Zkus to, dej si ke svým obrázkům alt Daniel Vítek. :D

Editováno 5.3.2015 21:35
Nahoru Odpovědět  +1 5.3.2015 21:34
Když nevíš jak dál, podá ti ruku někdo, od koho by jsi to nečekal. A tu šanci musíš přijmout!
Avatar
Mego
Člen
Avatar
Odpovídá na Jiří Gracík
Mego:

To neni pravda, musia byť v úvodzovkách iba vtedy, ak ide o viacslovné pomenovanie...

napr. <img src=images/obra­zek.png> je v pohode
ale <img alt=Obrazek> je tiež v pohode
ale <img alt=Obrazek dva> neni v pohode, tu už musia byť úvodzovky <img alt="Obrazek dva">

Keď dáš úvodzovky všade, nič sa nestane, ale tiež sa nič nestane, ak v jednoslovných atributoch nebudú

Nahoru Odpovědět 6.3.2015 9:08
Radšej 15 minút skôr, ako 15 sekúnd neskoro...
Avatar
Mego
Člen
Avatar
Odpovídá na Michal Kuba
Mego:

Najlepšie bude, ak z <li> spravíš display:block a necháš ich vedľa seba floatovať. Nadradený atribút <ul> by kvôli tomu mal mať overflow:hidden; alebo za posledným floatovaným <li> by malo nasledovať ukončenie floatovania pomocou clear:both, inak ti to bude robiť blbosti.

Ako spraviť, aby odkazy nepresahovali, to je možné hneď niekoľkými spôsobmi:

1. Nastaviť percentuálne šírky: Ak používaš border-box, bude ti všetko pekne sedieť. Floatovaným <li> nastavíš určitú percentuálnu hodnotu, ktorej sa budú prispôsobovať. Všetky odkazy tak budú mať rovnakú šírku. Čiže ak máš v menu 4 odkazy a vieš, že ich nebude viac, môžeš kľudne nastaviť <li> css vlastnosť width:25%, ak ich máš 5, môžeš nastaviť 20%. Ak ale nepoužívaš border-box, musíš si tieto šírky vystihnúť pomocou chrome developer tools. Pri border-boxe (vlastnosť box-sizing CSS) sa ti budú bordery, aj paddingy prispôsobovať (marginy nepoužívať), pri content-boxe (což je vychodzia hodnota, ak nemáš nastavený border-box) sa ti nebudú paddingy ani bordery prispôsobovať a bude ti to každú chvíľu presahovať.

ul **{
box-sizing:border-box;
overflow:hidden;
}**

ul li **{
box-sizing:border-box;
width:25%; /*ak máš 4 položky menu...*/
float:left;
display:block;
}**

ul li a **{
text-align:center;
display:block;
color:#fff;
background:#414141; /*Farby si doplníš podľa nálady, rovnako aj ul li a:hover */
}**

2. Nenastavovať width vôbec: A oddelenie jednotlivých položiek menu dosiahnuť pomocou paddingov a borderov (ako to vyžaduje grafický návrh). To znamená, že z vyššie uvedeného kódu vyhodíš ten width:25%; a do selektora ul li a vložíš {padding:0 40px}, čím dosiahneš, že odkazy v menu budú od seba oddelené o 40px z obidvoch strán (Čiže v skutočnosti medzi nimi bude 80px [40px+40px]). Nevýhoda je tá, že to nebude na celú šírku, výhoda je tá, že v budúcnosti môžeš pokojne pridávať niekoľko nových položiek menu, kým ich počet nebude taký, že budú presahovať. Ak by začal presahovať, jednoducho znížiš hodnotu paddingu na 0 30px a ešte ti tam zas čosi vojde.

3. Existujú ešte rôzne iné fušerské spôsoby, napr. taký, že ti javascript podľa počtu položiek vyráta šírku jednej položky v pixeloch, toto riešenie je však cba.

Nahoru Odpovědět 6.3.2015 9:22
Radšej 15 minút skôr, ako 15 sekúnd neskoro...
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Mego
Jiří Gracík:

To že to funguje neznamená, že to tak může být.

Nahoru Odpovědět 6.3.2015 17:30
Creating websites is awesome till you see the result in another browser ...
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Jiří Gracík
Tonda Kozák:

Pleteš se, v určitých případech (zjednodušme to na: když je hodnota jednoslovná) se uvozovky psát nemusí.
http://www.w3.org/…/syntax.html#…

 
Nahoru Odpovědět  +1 6.3.2015 19:17
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Tonda Kozák
Jiří Gracík:

Ok, tak tohle jsem nepostřehl. V tom případě se Mego omlouvám :)

Nahoru Odpovědět  +1 7.3.2015 11:02
Creating websites is awesome till you see the result in another browser ...
Avatar
Jiří Gracík
Redaktor
Avatar
Jiří Gracík:

Ne že by to měnilo něco na tom, že se mi to nelíbí, že s tím nesouhlasím nebo že to určitě nebudu používat :D

Nahoru Odpovědět 7.3.2015 11:05
Creating websites is awesome till you see the result in another browser ...
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Jiří Gracík
Tonda Kozák:

Můžeš s tím nesouhlasit, můžeš o tom vést spory, ale to je asi tak vše, co s tím lze dělat. (Cimrman)
:-)

 
Nahoru Odpovědět  +2 7.3.2015 17:51
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Tonda Kozák
Jiří Gracík:

To je taky vše, co s tím hodlám dělat :D

Nahoru Odpovědět  +1 7.3.2015 18:52
Creating websites is awesome till you see the result in another browser ...
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 29 zpráv z 29.