Autor Zpráva
chodnik74
Profil
Dobrý den,
Rád bych se naučil HTML/CSS a později přidal PHP,JS a databáze MySQL. Chtěl bych od vás zhodnotit stránku a poradit, co psát jiným způsobem nebo co jsem napsal špatně a znáte lepší řešení z praxe. Každá rada mne posune dopředu, proto předem děkuji všem.

Ondra


www.chodnik74.ic.cz
peta
Profil
- moc barev
- moc odlisneho textu (tucny, tenky, velky, maly)
- moc odlisnych stylu grafiky (logo sprej + ostre hrany, ostre hrany, plne plochy, ramecky, v kontakt dvojrameckova tabulka)
- prilis dlouhe radky, presahuji 80 znaku na radek
- nerovnomerne okraje (neco o mne) - doel patika je nalepena na modrem obdelniku, nahore ma obrazek dost mista, ale text nezacina pod obrazkem (asi bych ho dal sirsi)
- odstavce v cestine se delaji bud odsazenim zhora nebo odsazenim zleva. Aspon nam ucitelka cestiny vzdy rikala, ze v sesite nejde udelat pul radku mezera a cely radek vypada divne, ze to mame odsadit zleva.
Ale, kdyz jsem dal ve FF - zobrazit stranku - bez stylu, tak to vypada hodne dobre. Kdyz to nechas takto, jen jemne nebo vubec zabarvis, pridas to menu. Nastavis sirku na max sirku toho obrazku. Nebudes sahat do marginu, padingu. Tak to pujde.
jenikkozak
Profil
chodnik74:
Mám-li mluvit za sebe, tak na první web to určitě není špatné.
1) Asi bych odstranil ty tmavé rohy z hlavičky. Tím se vzhledově propojí záhlaví a obsah stránky.
2) „Něco o mě“ se píše s enkem. Viz článek Mně, mi, mě, mne. A dvacetiletý se s číslovkou píše také jinak.
3) Zkus na patičku také použít bezpatkové písmo, aby se stránka sjednotila. V takovém případě bys mohl písmo nastavit prvku <body> a nemusel písmo zvlášť vypisovat u všech ostatních prvků ve stylopisu.
4) Zelené orámování záhlaví při přejetí myši se tam příliš nehodí, protože zelenou nemáš nikde jinde na webu použitou.

Ale protože se chceš věnovat HTML a CSS, mrkneme do zdrojového kódu. Ten je poměrně dobrý.
5) Pozor na to, že v HTML atributech width a height se pixely nezapisují s jednotkou. <img src="Obrazky/logo.jpg" alt="logo" height="150px" width="1024px" />
6) Dělat obdélníkové pozadí pomocí tabulky s jedinou buňkou není to nejlepší řešení. Tabulka má jiný význam, raději použij <div>.
7) Úplně jsi vynechal nadpisy první úrovně. V kódu používáš až <h2>.
Ivy
Profil
Mě trošku vadí, že se menu při najetí myší "rozmlží". Asi bych doporučila jiné označení, třeba mírnou změnu barvy.
chodnik74
Profil
Tak jsem to trochu poupravil dle předešlých rad, které jsem pochopil. Zkuste se podívat, zda je vše opraveno nebo něco ještě chybí.

Děkuji
margin
Profil *
Mezi odkazy v menu a orámováním není mezera, zkus třeba:
padding: 5px 20px;

Nějaký hover by se taky hodil, můžeš změnit barvu orámování, pozadí, textu. Neznamená to, že musíš změnit všechno, ať to nevypadá, jako na pouti.
Stránku máš širokou 1024px, to znamená, že do šířky 1024px nevejde, protože nějakou šířku zabírá svislý scrollbar, proto bys měl mit web široký nanejvýš 1003px.
http://978.gs/browsers/

© znamená Copyright, takže Copyright © znamená Copyright Copyright.
smerovak.cz
Darker
Profil
chodnik74:
něco ještě chybí.
Mě/Mně na stránce kontakt. Doporučuji pomůcku ti/tobě.

Nevidím zvýrazněnou aktuální položku menu.
V dnešní době CSS3 už by nebyl problém udělat hlavičku jako prostý text. Když mám O2 modem (neuvěřitelně pomalá záležitost) můžu vyletět z kůže kdykoli narazím na stránky složené z obrázků.
Teď mi to hodilo:

Service Temporarily Unavailable

(asi chyba na straně WZ) takže pokračování příště.
chodnik74
Profil
margin:
Opraveno :) Děkuji za upozornění

Darker:
Nevím, jak bych to udělal, viděl jsem řešení s PHP, ale nechci si tam dávat něco, čemu zatím nerozumím :)
pcmanik
Profil
chodnik74:
Darker myslí css vlastnosť text-shadow.
margin
Profil *
chodnik74:
Nevím, jak bych to udělal
Pokud máš na mysli zvýraznění aktivní položky menu, tak na webu, který má pár stránek, jde ručně.
návod
Darker
Profil
pcmanik:
Mám pocit, že spíš odpovídal na moji výtku k menu.

Když už tedy reaguji:
Když jsem ještě neuměl PHP, nebo jsem dělal stránky načítané javascriptem, menu jsem řešil tak, že každá položka měla ID které se zvýraznilo javascriptem.
V případě webu skládajícího se z HTML souborů by se to dalo udělat třeba tak, že si javascript z URL vyparsuje jméno souboru bez přípony a to bude odpovídat ID aktuální položky. Samotné zvýrazňování by vypadalo ve skriptu takhle:
var id ="";
/* zjisteni jmena souboru */
document.getElementById(id).addClass("active");

HTMLElement.prototype.addClass = function(classname) {
  if(!this.hasClass(classname)) {
      this.className+=" "+classname;
      return true;
    }
    return false;
}
HTMLElement.prototype.hasClass = function(classname) {
  var classes = this.className.split(" ");
  for(var i=0; i<classes.length;i++) {
      if(classes[i]==classname)
        return true;
    }
    return false;
}
Chamurappi
Profil
Reaguji na Darkera:
Nastavování prototypů na HTMLElement nefunguje spolehlivě ve všech prohlížečích.

V dnešní době CSS3 už by nebyl problém udělat hlavičku jako prostý text.
Vlastnost text-shadow nepodporuje žádná verze Exploreru.
jenikkozak
Profil
Taky reaguji na Darkera:
Ještě ráno byl ten obrázek v záhlaví komplikovanější. Autor stránky ho sice na mou radu [#3] zjednodušil, dá se však předpokládat, že se nejedná o konečnou verzi. Použití textové verze by ho zbytečně omezovalo v grafických kouzlech.

Darker:
Když mám O2 modem (neuvěřitelně pomalá záležitost) můžu vyletět z kůže kdykoli narazím na stránky složené z obrázků.
Pokud ti tak vadí tento jeden obrázek, raději z kůže vyleť rovnou, protože na všech ostatních webech budeš čekat mnohem, mnohem déle. Zvykej si. :)

Když koukám na ten tvůj skript, přemýšlím, jestli by nebylo snazší do těch čtyř (4) stránek přidat třídu ručně.

chodnik74:
1) Patička patkovým písmem vypadá lépe. Teď by ji chtělo trochu oddělit od obsahu. Můžeš použít barvu na pozadí, světlejší písmo, oddělení čarou, ... Nejjednodušší na vymýšlení bude asi použití větší mezery.
2) Obrázku v záhlaví nastav nulový rámeček (jestli ho tam nechceš), jinak ho tam totiž Internet Explorer na rozdíl od ostatních prohlížečů vykresluje.
chodnik74
Profil
margin:
Děkuji, hotovo :)-

jenikkozak:
- Obrázek nastaven: border: 0;
- stále přemýšlím, co je patička :-/ od slova pata, čili konec stránky? takže oddělit Copyright?
panther
Profil
chodnik74:
stále přemýšlím, co je patička
:)

Stranka se vetsinou sklada z nekolika celku (nehlede na to, o jakou stranku se jedna): jsou to hlavicka (tam byva logo, casto horizontalni menu, prepinac jazyku, ...), obsah (doplneny treba o sloupec s novinkami) a paticka, casto obsahujici copyright, zrychlenou navigaci, vybrane konktatni udaje... Jedna se pouze o nepsane znaceni, ale kolem webu mu vsichni rozumi :)

Na zaklade toho znaceni se temto logickym blokum davaji vetsinou i stejna ID (header, content, footer) - s temito se setkas na vetsine stranek, pretoze by se mohly jmenovat... jarda, pepik, emilka. V takovem pripde by vse fungovalo, mno, orientace na strance, resp. stylopisu by byla mizerna.
chodnik74
Profil
panther:

Děkuji za vysvětlení, je to tak, jak jsem si myslel a domníval jsem se ;-)
peta
Profil
- stale moc barev
- hlavicka je stale nepovedena, spoustu pismen, prilis tmavy stin. Jestli na tom obrazku v prezentace jsi ty, tak bych ho vyuzil jako zaklad pro obrazkovou hlavicku. Doleva dal tve jmeno (mensim pismem), pod to osobni web, pak chvili uprostred nic a doprava pak text s postavickou. Ten text trochu mensi, aby se tam vesel.
- menu je nepovedene, text se dotyka okraju ramecku, neni vyrazne
- ve FF v okne 700x700 mi horni lista konci na asi 700px, logo obrazek na asi 800px, ramecek textu na asi 806px. Takze to neni zprava pekne zarovnane.

Ja bych treba do casti s textem vubec barvu nedaval, nechal to bilou. Tu svetle modrou bych natahl pod menu a cernou zrusil uplne. Mozna kolem strnky. Mozna bych ji zesvetlil, protoze syta cerna dost taha oci, kdyz je zbytek plochy svetly, bily.
Menu, jestli tam trvas na carach a rameccich, muzes zkusit

    Úvod     Prezentace    Výuka PHP    Kontakt
--------------------------------------------------------------

   ------   --------------  ------------  ---------
    Úvod      Prezentace     Výuka PHP     Kontakt
   ------   --------------  ------------  ---------
http://axpsu.fpf.slu.cz/~web/x/ocohdnicky-web.png
chodnik74
Profil
peta:

http://www.chodnik74.ic.cz/index.html

a co říkáš na tohle? ;-) trochu jsem to přepracoval.
peta
Profil
Vis urcite, ze te zajima muj nazor? :)
Podivej, na strance mas more jakehosi textu nahodne rozhazeneho. Velky, maly, uprostred, vlevo, jinak vlevo, centrovany. Chaos.
Ano, menu je ted lepsi, mozna i hlavicka. Ale ted zas nemas pozadim odlisenou hlavicku od informaci pro navstevnika, takze nevi, kde ma zacit cist. Proto bych do hlavicky vyuzil obrazek z prezentace, abys ji odlisil. Obrazek = hlavicka a ostatni je text. Pak zarovnat vsechny texty v hlavicce vlevo a dalo by se s tim pocitat. Mozna bych zmensil pismo u Ondreje a osobni web. A u menu pridal pading zleva a prava, aby to zvyrazneni nebylo nalepene na textu. Osobni web je ted prilis nalepeny na obrazku a obrazek se mi vzhledem k velikosti hlavicky jevi prilis mrnavy. Jinak bych si mozna vybral spis usmevavy oblicej nebo neco abstraktniho. Z tech obrazku, co mas na webu, mi tam nejlepe sedl ten z prezentaci. V kontaktu je pekna fotka, ale prisla mi prilis tmava pro hlavicku.

Vaše odpověď

Mohlo by se hodit

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: