NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!

Kritika webu http://skkelti.cz/

Jak se ti líbí web?
2 hlasů
Přejít na web:
http://skkelti.cz/

Při vložení tohoto webu do kritiky web získal od našeho robota následující hodnocení:

Kladných hodnocení: 10; Varování a poznámky: 17; Kritické chyby: 4.
Stránka obsahuje mnoho zbytečných chyb. Většinu nalezených chyb je možné jednoduše opravit. Pokud si s něčím nevíte rady, použijte Český neoficiální validátor HTML stránek

V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
tbartolen
Člen
Avatar
tbartolen:16.3.2016 10:11

AHoj, po delší době jsme provedli opět nějaké změny na našem webu. Máme novou kamarádku co nám dělá grafiku. S tím se pojí nový header. Máme ho tam jeden den, ale mě se prostě zdá nemastný, neslaný, špatný. Nevím jak ho jen trochu upravit, aby byl top. Měli by jste někdo nějaký nápad? Zarovnání textu, výška, umístění obrázku, atd?
Jinak další rady ohledně designu si rád poslechnu, jsem amatér a vše to dáváme dohromady jen svépomocí a zadarmo, takže nejde o profesionální práci, to ale neznamená, že to tak nemusí vypadat :-)

Děkuji za konstruktivní kritiku =)

Odpovědět
16.3.2016 10:11
Navštiv www.fb.com/skkelticz
Avatar
kelley
Člen
Avatar
kelley:16.3.2016 13:24

Hodnocení grafiky přenechám jiným, nejsem grafik, ale stránka mi připadá tak nějak "standardní" :-) Výhrady mám k nesrovnaným sekcím/divům svisle pod sebou. Header, menu, obsah i patička jsou o dva tři body "poskákané" do stran. Pak bych se podíval na to, proč se header, menu i úvodní fotka pohne směrem dolů při najetí myší, dělají to i nadpisy s odkazem... asi to měl být úmysl, ale na mě to působí jako chyba. A další věc: v rozbalovacích menu dát menší font a nastavit nějaký margin-left, ať to není tak nalepené na boku.

 
Nahoru Odpovědět
16.3.2016 13:24
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:16.3.2016 14:19

Rady českého neoficiálního validátoru jsou výborný :D

Nahoru Odpovědět
16.3.2016 14:19
Neaktivní uživatelský účet
Avatar
martinkhla
Člen
Avatar
martinkhla:16.3.2016 19:55

Stránka mi príde nemastná, neslaná. Grafika zastaralá, nudný font a všetko moc na kope. Ďalej, ako písal kelley vyššie, vypol by som / upravil by som hýbanie, pri hoveri, smerom dole, nakoľko to dáva dojem nefunkčnosti stránky. Začal by som prve fontom, nakoľko je to základ web dizajnu a vie veľa pokaziť. Zmenil by som ho na nejaký modernejší napr. Lato alebo iný. Z grafickej stránky by som ti dal inšpiráciu napr. http://demo.themeum.com/sportsline/ , kde môžeš vidieť ako sa dajú pekne zladiť farby, ako sa dajú pekne spraviť výsledky zápasov, ako sa dajú moderne nastaviť novinky a ako sa dá dať stránke šmrnc. Skús popozerať aj inde, pohľadaj stránky s podobnou tématikou a sleduj funkcie ktoré používajú a ktoré si myslíš že by sa hodili tvojej stránke. Na záver: Dúfam, že ťa moja kritika nejako neodradila. Ber to ako pomoc do budúcna a verím, že nabudúce to bude lepšie. Za mňa máš 2 / 5.

Nahoru Odpovědět
16.3.2016 19:55
Logic will get you from A to B. Imagination will take you everywhere. - Albert Einstein
Avatar
tbartolen
Člen
Avatar
Odpovídá na martinkhla
tbartolen:16.3.2016 22:38

To mě v žádném případě neodradí. Bohužel to co si poslal je jiná wordpress šablona, která není zadarmo. Určitě je to ale inspirace jakým směrem to směrovat. Děkuji.

Nahoru Odpovědět
16.3.2016 22:38
Navštiv www.fb.com/skkelticz
Avatar
00
Člen
Avatar
Odpovídá na tbartolen
00:17.3.2016 21:02

Na rozházené velikosti se hodí

* {box-sizing : border-box}

dát do CSS

 
Nahoru Odpovědět
17.3.2016 21:02
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Odpovídá na 00
Matúš Petrofčík:17.3.2016 21:19

Ja to robím takto:

/* box-sizing: border-box */
html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}
Nahoru Odpovědět
17.3.2016 21:19
obsah kocky = r^2 ... a preto vlak drnká
Avatar
tbartolen
Člen
Avatar
tbartolen:17.3.2016 21:53

Co se týče podskakování odkáazů, snažil jsem se ve widgetu udělat efekt tlačítka na obrázku. Použil jsem na to následující kód

<style>
a:hover {position: relative; top: 2px}
</style>
<a href="http://www.cmshb.cz/mladez/hokejbalova-centra-mladeze/">
<img src="http://skkelti.cz/wp-content/uploads/2016/02/logo_hcm-e1456319541343.jpg"  title="SK Kelti 2008 jsou držitelem statusu Hokejbalové centrum mládeže!">
</a>

Nevím proč, ale ten efekt se mi začal dělat na všech odkazech...:(

Nahoru Odpovědět
17.3.2016 21:53
Navštiv www.fb.com/skkelticz
Avatar
martinkhla
Člen
Avatar
Odpovídá na tbartolen
martinkhla:17.3.2016 21:58

Pretože týmto spôsobom nastavíš efekt globálne pre všetky odkazy na stránke. Navrhujem napr. určiť si konkrétnu oblasť, kde chceš efekt využiť, napr.

.widget a:hover {  }
Nahoru Odpovědět
17.3.2016 21:58
Logic will get you from A to B. Imagination will take you everywhere. - Albert Einstein
Avatar
martinkhla
Člen
Avatar
Odpovídá na tbartolen
martinkhla:17.3.2016 22:11

A tento efekt by som asi riešil skôr cez transfrom a zároveň pridal transition - touto úpravou docieliš peknej animácie.
Čiže finálny kód by som napísal takto:

/* .widget je príklad Oblasti pre ktorú chceš efekt využiť */
.widget a {  transition: 0.2s linear;  }
.widget a:hover > img {  transform: translate3D(0, 3px, 0); }
Nahoru Odpovědět
17.3.2016 22:11
Logic will get you from A to B. Imagination will take you everywhere. - Albert Einstein
Avatar
martinkhla
Člen
Avatar
Odpovídá na martinkhla
martinkhla:17.3.2016 22:20
  • oprava kódu
/* .widget je príklad Oblasti pre ktorú chceš efekt využiť */
.widget a > img {  transition: 0.2s linear;  }
.widget a:hover > img {  transform: translate3D(0, 3px, 0); }
Nahoru Odpovědět
17.3.2016 22:20
Logic will get you from A to B. Imagination will take you everywhere. - Albert Einstein
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 11 zpráv z 11.