Kritika webu agility-zak.tk

HTML a CSS Kritika webů - ukažte se! agility-zak.tk American English version English version

Jak se ti líbí web?
Celkové hodnocení (4 hlasů):
1.51.51.51.51.5
Přejít na web:
http://agility-zak.tk
Avatar
00
Člen
Avatar
00:

Jsou to webové stránky o skupině Agility v Havlíčkově Brodě, kterou vede Josef Žák.

Jemu jsem tyto stránky vytvořil v čistém PHP, HTML, CSS a JS (zčásti jQuery). Jsou trochu pomalejší, ale je to tím, že tam jsou věci, jako FB like nebo Google Analytics a také spousta fotek. Výsledky ze závodů (jako třeba http://agility-zak.tk/profil/zak#… ) jsou stahovány z KAČRu (kacr.info) přes php skript. Jako databázi jsem použil SQLite, kterou tvořím pomocí SQLiteStudio.

Do hlavičky jsem vložil video, protože mi to připadalo hezké a zajímavé. A pokud video v prohlížeči není podporované, používá se statický obrázek, který je za videem. Jako ikony (zatím pouze dvojitou šipku dolů) jsem použil Font Awesome.

Z kontaktního formuláře mi vše chodí na e-mail (centrum), který rozesílá zprávu na další adresy.

Bílé pozadí pro okolí stránky mi přišlo nepěkné a tak jsem použil trávu.

Také nějakou dobu bude fungovat stará verze na http://stary-agility-zak.tk.

Budu rád, když budete hodnotit nebo napíšete, co je špatně nebo dobře
 
Odpovědět 11. září 11:19
Avatar
VitekST
Člen
Avatar
VitekST:

Web bych hodnotil spíše průměrně, tady jsou moje výtky:

  1. Položky v menu - lehce bych je zmenšil, vycentroval, případně dal do nějakého kontejneru s obarveným pozadím. Když už separátory, tak pomocí borderu. Možná bych přidal i ikonky (viz Font Awesome).
  2. Header - text bych absolutně vycentroval (můžeš použít flexbox). To video pozadí je sice dobrý nápad, nicméně je v nízkém rozlišení, proto nevypadá úplně nejlépe.
  3. Texturované pozadí se nenosí, zkusil bych dát nějakou našedlou barvu. Na obsah samotný bych dal barvu bílou.
  4. Stíny. Pokud nejedeš podle material designu, nepoužíval bych je na elementy vůbec. Maximálně za zvýraznění textu, přičemž tam bych dal jen minimální X-Y posuv a rozptyl.
  5. Responzivita. V dnešní době je absolutní nutnost mít web responzivní, máme tablety, mobily, televize, desktopy, různé monitory na desktopech a laptopech a web by se měl přizpůsobit.
  6. Písmo. Obyčejný Sans Serif nepůsobí na mě moc dobře, poohlédnul bych se po Open Sans nebo Roboto,
  7. Jednotlivé sekce textu bych odsadil o pár pixelů dolů, ať je to trochu vizuálně oddělené, působí to pak lépe.
  8. Ta zpráva ohledně cookies nefunguje správně - web jsem párkrát navštívil, lištu skryl a pokaždé se mi zobrazila znovu. Také bych upravil její vzhled, ta žlutá je moc svítivá.
  9. Fotogalerie. Pokaždé, když si člověk chce zobrazit novou fotku, tu zobrazenou musí zavřít (klikem vedle) a otevřít novou (klikem na ní). Proč nepoužít šipky? Našel jsem: http://photoswipe.com
  10. Ten úvodní obrázek v sekci "Hlavní stránka" je taková patlanina, s prominutím. Jde poznat, že se jedná o ne moc dobře udělaný ořez a k tomu ještě je poznat silná JPEG komprese.
  11. Barva odkazů. Ono to nepůsobí úplně nejlépe, když web je v takové zelené barvě (díky té trávě) a vykoukne tam modrý odkaz, plus ještě výrazně světlou modrou. Vybral bych tmavší zelenou.
  12. W3C validita. Úplně to nehoří, přesto ale si myslím, že by bylo užitečné opravit chyby, které W3C validátor vykazuje. Viz zde: http://validator.webylon.info/check?…
  13. Když používáš sémantické elementy (jako třeba header), nemyslím si, že je potřeba k nim dávat ID. Header je jen jeden na stránce, ne?
  14. K šipce v headeru bych přidal animaci, viz následující kód s jQuery:
$(document).ready(function(){
        $('a[href^="#"]').on('click',function (e) {
            e.preventDefault();

            var target = this.hash;
            var $target = $(target);

            $('html, body').stop().animate({
                'scrollTop': $target.offset().top
            }, 800, 'swing', function () {
                window.location.hash = target;
            });
        });
});
Editováno 11. září 19:18
 
Nahoru Odpovědět  +2 11. září 19:16
Avatar
Odpovídá na VitekST
Josef Kuchař (Pepa489):

Header nemusí být na stránce jediný, proto bych mu class nebo id nechal

Nahoru Odpovědět  +1 11. září 20:18
2x piš, jednou debuguj
Avatar
VitekST
Člen
Avatar
Odpovídá na Josef Kuchař (Pepa489)
VitekST:

Tak... já to mám tak nastavené, že header je na stránce jediný, každý to může mít nastaveno jinak.

 
Nahoru Odpovědět 11. září 20:22
Avatar
00
Člen
Avatar
Odpovídá na VitekST
00:

V čem nejsou responzivní?

 
Nahoru Odpovědět 11. září 20:36
Avatar
VitekST
Člen
Avatar
Odpovídá na 00
VitekST:

Rozbíjel se header a obsah, koukám, že je to teď v pořádku.

Jinak, pokusil bych se ještě stránku optimalizovat do šířky obrazovky 240px (toto rozlišení se ještě používá, ačkoli ne moc), třeba se takto rozbíjí header, menu a mizí padding z pravé strany u hlavního obsahu.

 
Nahoru Odpovědět 11. září 20:50
Avatar
00
Člen
Avatar
Odpovídá na VitekST
00:

Před chvílí jsem to opravil, možná ještě budou styly v mezipaměti.

 
Nahoru Odpovědět 11. září 21:00
Avatar
VitekST
Člen
Avatar
Odpovídá na 00
VitekST:

Určitým způsobem si to opravil, nicméně pokud je šířka < 500px, přetéká ti kontejner sociálních sítí v hlavičce pár px přes obrazovku => dá se skrolovat vpravo.

Přetéká proto, protože tam máš margin a máš délku nastavenou na 100% (100% z šířky obrazovky).
Zkus nastavit místo marginu padding, a width na auto (auto v tomto případě vyjadřuje 100% z šířky obrazovky - vnitřní okraj).

 
Nahoru Odpovědět 12. září 19:26
Avatar
Jiří Gracík
Redaktor
Avatar
Jiří Gracík:

Pes AJAX :D Fakt má ten člověk rád psy?

Nahoru Odpovědět 13. září 10:25
Creating websites is awesome till you see the result in another browser ...
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na 00
Jiří Gracík:

Proč si použil SQLite databázi?

Nahoru Odpovědět 13. září 10:26
Creating websites is awesome till you see the result in another browser ...
Avatar
00
Člen
Avatar
Odpovídá na Jiří Gracík
00:

Potřebuji ji měnit jako soubor a jednoduše zálohovat. A přeci se z ní jen čte, ne? To by nemělo být až tak extra pomalý.

 
Nahoru Odpovědět 13. září 15:44
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na 00
Jiří Gracík:

U aplikace, kde do databáze přistupuje víc klientů najednou, není sqlite úplně nejlepší volba. Pokud se z ní jenom čte, tak proč jí zálohovat?
// Předpokládám, že když se z ní jenom čte, tak se nemění

Editováno 14. září 1:20
Nahoru Odpovědět 14. září 1:20
Creating websites is awesome till you see the result in another browser ...
Avatar
00
Člen
Avatar
Odpovídá na Jiří Gracík
00:

Mění se, ale jen výjimečně.

 
Nahoru Odpovědět 14. září 7:14
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 13 zpráv z 13.