NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
S účinností od 26. 3. jsme aktualizovali Zásady zpracování osobních údajů – doplnili jsme informace o monitorování telefonických hovorů se zájemci o studium. Ostatní části zůstávají beze změn.
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Matúš Petrofčík:25.9.2013 15:37

Zdravím páni! :)

V rámci môjho voľného času som sa rozhodol vytvoriť prezentačnú stránku s fotogalériou pre môjho kamaráta, ktorý je výborným fotografom.
Stránku ešte nemám dokončenú (chýba kontaktný formulár a galéria), zato s dizajnom som viac menej skončil.
Stránku sa snažím napísať v HTML5 + CSS, ale na niektoré dynamické obsahy, a menu používam PHP. Pre galériu plánujem použiť aj databázu, aby sa zoznamy obrázkov a zoznamy albumov v daných kategóriach nemuseli vzdy znova získavať prehľadávaním zložiek.

Na to že som začiatočník a nekopírujem cudzie zdrojáky, nevyzerá to zle :)

Od vás chcem ohodnotenie dizajnu. Môžete aj ohodnotiť kód úvodnej stránky ktorý kvoli php pridám. Snažil som sa vyskúšať aj prispôsobovanie stránky, môžete vyskúšať či sa vám na mobiloch zobrazuje menu s ikonkami (ak máte lepšie ikonky, sem s nimi!).

Ďakujem.

PS: vytvoril som si aj vlastnú stránku pre svoju prezentáciu, trvalo mi to asi 5 hodín, vôbec nefunguje tak ako by som chcel, ale môžete pozrieť na http://www.nazovdomeny.eu

php časť

<?php

if(!isset($_GET['p­'])||!$_GET['p']){
require_once('pa­ges/home.php');
}else{
if(isset($_GET['p­'])){
if(!is_numeric($_GET['p­'])){
$page=1;
}else{
$page=$_GET['p'];
}
switch($page){
case("1"):
require_once('pa­ges/home.php');
break;
case("2"):
require_once('pa­ges/gallery.php');
break;
case("3"):
require_once('pa­ges/aboutme.php');
break;
case("4"):
require_once('pa­ges/contact.php');
break;
default:
require_once('pa­ges/home.php');
break;
}
}
}
?>

kod v home.php

<div id="home-background">
<?php
$pics = glob('gallery/ho­mepage/*.jpg', GLOB_NOSORT);
$pic = $pics[array_ran­d($pics)];
echo "<img src=\"$pic\" alt=\"photography frantisek vojtas\"/>";
?>
</div>

Odpovědět
25.9.2013 15:37
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Jozef Krajčovič
Tvůrce
Avatar
Jozef Krajčovič:25.9.2013 17:52

No ale si sa rozpisal :)

Tak čo sa tyka designu (zatial iba home page možem hodnotit) tak idea full screen fajn, ale design je podla mna dost malo sexy.Ten otrasny footer by som zmenil. Skusil by som sa pohrat trocha s veselšimi farbami.

Ako inšpiraciu by som použil niečo taketo:
http://kvetinarska.cz/en
http://www.gt3themes.com/…r/index.html

Icons su strašne skus použit nejake .svg napr. tieto https://www.iconfinder.com/…r-icons-pack

Editováno 25.9.2013 17:53
 
Nahoru Odpovědět
25.9.2013 17:52
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Odpovídá na Jozef Krajčovič
Matúš Petrofčík:25.9.2013 18:07

Čo sa týka farieb, nechcel som aby ťahali pri prezeraní stránky oči.
Ale skúsim popremýšľať ;) nejaké nápady na farby?

Ikony sa nepáčia ani mne :D

cca pozajtra by som mal mať kontaktnú stránku hotovú, tak o týždeň aj galerku.

Nahoru Odpovědět
25.9.2013 18:07
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Vojtěch Mašek (Woyta)
Tvůrce
Avatar
Vojtěch Mašek (Woyta):25.9.2013 18:33

Design se mmi líbí, jen bych přidal na kontrastu modré a zelené barvy a trochu ubral stíny.
Na první stránku to není zlé, moje první pokusy byly výzarně horší, ale doporučuju používat validátor, hlásí mi tady 15 errorů a to je trochu moc...

  1. <a> musí být uvnitř <li> ne naopak, e to syntakticky špatně protože v elemetech <ol> a <ul> jsou povoleny pouze elementy <li> a žádné jiné, je to jako kdybys místo (3+5) napsal 3(+)5...
  2. <div id="floating-menu" class="menu2">, tam máš prohozené hodnoty v atributech, jedno id by se mělo na stránce vyskytovat pouze jednou, kdežto class má společné vlastnosti pro několik elementů
  3. v elementu <img> musí být vždy atribut alt, pokud tě nenapadá jak obrázek pojmenovat, tak ho nech klidně prázdný, ale bez něj je kód nevalidní a když se správně vyplní tak přispívá k optimalizaci pro vyhledávání
  4. ještě tam je jedna chyba která souvisí zřejmě s počítadlem návštěv, nezdá se mi ta adresa ale to je jen odhad
  5. a jako poslední věc bych ti doporučil méně nadávat v komentářích, pamatuj na to, že kdokoliv ti výsledné HTML a CSS může zobrazit a když tohle uvidí, nebude si o tobě myslet nic dobrého
Nahoru Odpovědět
25.9.2013 18:33
Výraz "to nejde" není v mém slovníku
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Odpovídá na Vojtěch Mašek (Woyta)
Matúš Petrofčík:25.9.2013 18:46

moc dík, pomohlo, pozmením ;)

Nahoru Odpovědět
25.9.2013 18:46
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Matúš Petrofčík:26.9.2013 10:07

upravené, validné :)

nevalidný je akurát automaticky pridávaný kód servera

Nahoru Odpovědět
26.9.2013 10:07
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:26.9.2013 10:52

Na ikony se nejlépe dají (alespoň podle mě) použít IconMonstr.com. Najdeš tam skoro všechno.

Jinak web je docela hezký, jen vypadá na těch podstránkách neprofesionálně.

Nahoru Odpovědět
26.9.2013 10:52
Neaktivní uživatelský účet
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Matúš Petrofčík:26.9.2013 11:16

Namiesto zeleneho pozadia pre podstranky som sa rozhodol pouzit opäť náhodné obrázky, tak ako na úvodnej stránke. Kedze to bude stranka na prezentaciu fotiek, myslim ze napad je to dobrý.
Ako sa vám to pozdáva?

Nahoru Odpovědět
26.9.2013 11:16
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Matúš Petrofčík
Honza Bittner:26.9.2013 11:38

Hezky upravené http://www.itnetwork.cz/…s-dolni-menu
:)

Jen by bylo by lepší využít MVC, než to dělat vše takto ručně :)
Získáš tak i hezké url adresy a celkově to bude lépe upravitelné.

Nahoru Odpovědět
26.9.2013 11:38
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Odpovídá na Honza Bittner
Matúš Petrofčík:26.9.2013 14:10

nebol tam len ctrl-c ctrl-v, inak by som sa nič nenaučil. :)
na http://www.itnetwork.cz/…s-dolni-menu som sa samozrejme inšpiroval. Menu a styl h1 nadpisu je priam dokonale, a font sa mi páčil tiež (pre IE som musel googlovat .eot), ale ak si ich porovnáš, tak sú robené inak. a odkukal som názov triedy .item

Tiež dík za http://www.itnetwork.cz/…bove-stranky , skvelý návod :)

Nahoru Odpovědět
26.9.2013 14:10
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Matúš Petrofčík
Honza Bittner:26.9.2013 17:35

Neříkám že jsi to zkopíroval .. jen že jsi to hezky upravil a vylepšil :)

Nahoru Odpovědět
26.9.2013 17:35
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Matúš Petrofčík
Tvůrce
Avatar
Odpovídá na Honza Bittner
Matúš Petrofčík:26.9.2013 18:01

Tak potom dík :) som to zle pochopil

Nahoru Odpovědět
26.9.2013 18:01
obsah kocky = r^2 ... a preto vlak drnká
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 12 zpráv z 12.