http://kongo-ogrody.pl Opcje

[andrew1985]

Zapraszam do oceny strony
http://kongo-ogrody.pl

[grzesiek_g]

1. Menu do niczego, taki sam efekt uzyskasz mniejszą ilością kodu, bez javascript w css.
2. Piszesz doctype XHTML 1.0 a dajesz onclick? W XHTML inaczej wywołuje się skrypty.
3. Tekst raczej powinno umieszczać się w p, span, ale nie bezpośrednio w div. Dotyczy to m.in. prawego bloku.
4. Nie wiem jak sprawa wygląda w IE, ale widzę, że masz na górze deklarację xml, mam nadzieję, że serwujesz to tylko dla Opery i FF.
5. Galeria na tabelce w dodatu źle zbudowanej - zdjęcie i link nie mają ze sobą żadnego związku w kodzie.
6. Jak wyłączę obrazki nie zobaczę nic w zamian nagłówka.

[andrew1985]

1. Menu do niczego, taki sam efekt uzyskasz mniejszą ilością kodu, bez javascript w css.
2. Piszesz doctype XHTML 1.0 a dajesz onclick? W XHTML inaczej wywołuje się skrypty.
3. Tekst raczej powinno umieszczać się w p, span, ale nie bezpośrednio w div. Dotyczy to m.in. prawego bloku.
4. Nie wiem jak sprawa wygląda w IE, ale widzę, że masz na górze deklarację xml, mam nadzieję, że serwujesz to tylko dla Opery i FF.
5. Galeria na tabelce w dodatu źle zbudowanej - zdjęcie i link nie mają ze sobą żadnego związku w kodzie.
6. Jak wyłączę obrazki nie zobaczę nic w zamian nagłówka.

1. Tak zrobisz to w css przy pomocy nazwa_klasy:hover ale pod IE6 to nie działa wiec pozostaje DHTML. Co więcej DHTML działa pod wszystkimi przeglądarkami.
2. XHTML obsługuje onlick czego najlepszym dowodem jest poprawna validacja kodu. Proponuje douczyć się standardów W3C. Stosowanie zdarzeń inline jest dużo szybsze niż dopinanie ich przez JS
3. Może choć nie koniecznie. Powinno się rozdzielać akapity znacznikami <p>, jak jest ich wiecej niż 1, kontakt po prawej to tylko jeden akapit więc a po co zagniezdzać jeszcze jeden znacznik w tym kontakcie ?
4. Nie, serwuje to pod wszystkie znane przeglądarki (IE6, IE7, Safari, Opera, Firefox) - i strona jest wyświetlana we wszystkich POPRAWNIE.
5. A dlaczego ma nie być na tabelce ? Tabelki służą do tabelarycznego prezentowania danych, w tym przypadku są nimi obrazki. Nie popadaj w skrajność. W dobie CSS i XHTML też korzysta się z tabelek ale nie do budowy layoutu tylko do tego, czego zostały wymyślone. Uwagi z tym, ze linki i zdjęcia nie maja ze sobą związku jakoś nie rozumiem. Możesz bliżej to przybliżyć
6. Jak wyłączysz monitor to nic nie zobaczysz. A jak już komputer wyłączysz to już w ogóle.

Ten post edytował andrew1985 14.01.2008, 14:06:52

[mike]

1. Tak zrobisz to w css przy pomocy nazwa_klasy:hover ale pod IE6 to nie działa wiec pozostaje DHTML. Co więcej DHTML działa pod wszystkimi przeglądarkami.

Tak się składa, że wykonanie to menu jest przykładem jak prostą rzecz można maksymalnie skomplikować.
Akurat w tym ~grzesiek_g ma rację. Dużo mniej kodu, brak JavaScript i efekt ten sam.

Cała strona jest dość ładna. Schludna i przejrzysta.
Dodałbym tylko stronicownaie w galeriach gdzie jest dużo zdjęć.

[andrew1985]

Tak się składa, że wykonanie to menu jest przykładem jak prostą rzecz można maksymalnie skomplikować.
Akurat w tym ~grzesiek_g ma rację. Dużo mniej kodu, brak JavaScript i efekt ten sam.

Oki, zgoda. Da się to zrobić, jest to dużo łatwiejsze i przyjemniejsze ale nie działa pod Internet Explorer 6 który bądź co bądź ale jest jeszcze jedną z najpopularniejszych przeglądarek. Zróbcie hover na divi-e bez JS tak aby to DZIAŁAŁO pod IE6 to zwrócę honor.

[tiraeth]

Oki, zgoda. Da się to zrobić, jest to dużo łatwiejsze i przyjemniejsze ale nie działa pod Internet Explorer 6 który bądź co bądź ale jest jeszcze jedną z najpopularniejszych przeglądarek. Zróbcie hover na divi-e bez JS tak aby to DZIAŁAŁO pod IE6 to zwrócę honor.

Już któryś raz z kolei użyję słowa bzdura. Tagowi a także można nadawać styl. a:hover jest respektowany przez IE6. Po prostu napisz, że nie wiesz jak to zrobić i nie gadaj, że trzeba DIVA hoverować. Baaa, menu to się w ul/li albo dt powinno robić A styluje się sam link, wtedy można uzyskać potrzebny efekt.

[mike]

Oki, zgoda. Da się to zrobić, jest to dużo łatwiejsze i przyjemniejsze ale nie działa pod Internet Explorer 6 który bądź co bądź ale jest jeszcze jedną z najpopularniejszych przeglądarek. Zróbcie hover na divi-e bez JS tak aby to DZIAŁAŁO pod IE6 to zwrócę honor.

A co tak się czepiłeś tych divów. To menu powinno wyglądać tak:

[HTML] pobierz, plaintext 
<ul>
  <li><a/></li>
  <li><a/></li>
  <li><a/></li>
  <li><a/></li>
</ul>
[HTML] pobierz, plaintext 

i będzie wyglądąło i działało identycznie jak Twoje, również pod każdą przeglądarką.

[Cezar708]

Stronka wg mnie bardzo ładna. I mnie osobiście zachęciłaby do współpracy z Wami (jak będę miał dom to zrobicie mi ogród)

Jeśli chodzi o menu, również muszę zgodzić się z przedmówcami. Bo Twoje rozwiązanie jest niepotrzebnie za ciężkie. Proponuję abyś zaadoptował techniki z tego menu. Tam jest dość schludnie pokazane jak używać css do wykonania menu.

[mike]

P.S. Nie pisz ze bzdura bo nie podałeś rozwiązania jak zrobić działający hover na divie pod IE6 tylko obeszłeś problem omijając go. Klient chce mieć takie przyciski to trzeba mu je zrobić a nie proponować łatwiejsze, zupełnie inne rozwiązanie.

Czytasz to co się do Ciebie pisze?
Twoje menu jest błędnie skonstruowane ponieważ jest oparte o <div> a powinno byc listą <ul> z elementami <li> a nich osadzone <a>. Koniec! Trzy znaczniki, gdzie :hover jest dla <a>. Wszystko będzie działać identycznie jak To co masz w tej chwili.
Przykłady: cssplay.co.uk :: menus - setki różnych rozwiązań.

[andrew1985]

A co tak się czepiłeś tych divów. To menu powinno wyglądać tak:

[HTML] pobierz, plaintext 
<ul>
  <li><a/></li>
  <li><a/></li>
  <li><a/></li>
  <li><a/></li>
</ul>
[HTML] pobierz, plaintext 

i będzie wyglądąło i działało identycznie jak Twoje, również pod każdą przeglądarką.

Jesteś pewien Na moje twój kod w przeglądarce będzie wyglądał tak:

• link
• link
• link
• link
• link

Czy to wygląda i działa tak samo ? Nie sądze. Po pierwsze jak nie klikne w linka nie otworzy mi sie strona, po drugie jak nie najade myszka na linka to nie zmieni mi sie jego styl, po trzecie jak najade myszka na linka i obok niego to nie zmieni mi sie tło na okreslonym obsarze wokół linka.

Za chwile ktoś napisze ze to tego podanego w przykładzie html trzeba dopisać css. No właśnie ale go autor przykładu nie napisał. Wiec wygląda to tak jak podałem w przykładzie wyżej, czyli wypunktowana lista.

[Cezar708]

Jesteś pewien Na moje twój kod w przeglądarce będzie wyglądał tak:

• link
• link
• link
• link
• link

Czy to wygląda i działa tak samo ?

echh.. przeczytaj linka który Ci wcześniej podałeś. Za pomocą CSS możesz zmienić styl <lu><li>...

PS: Radzę nie podawać na stronie maila. Lepiej stwórz formatkę z możliwością wysłania do Ciebie maila. Roboty-spamery znajdą w końcu Twojego maila i będą Ci słali chłam na pocztę.

[andrew1985]

Przykłady: cssplay.co.uk :: menus - setki różnych rozwiązań.

Dzięki za linka. Podpatrze te rozwiązania.
Co do <ul><li> to wykorzystam to przy okazju budowania kolejnej strony.

Ten post edytował andrew1985 14.01.2008, 14:45:26

[grzesiek_g]

1. Tak zrobisz to w css przy pomocy nazwa_klasy:hover ale pod IE6 to nie działa wiec pozostaje DHTML. Co więcej DHTML działa pod wszystkimi przeglądarkami.

Działa, ja nigdy nie miałem trudności z tym, by menu było poprawne, bez js i do tego obszar klikalny znacznika a był większy niż sam tekst, masa przykładów:http://www.cssplay.co.uk/menus/

2. XHTML obsługuje onlick czego najlepszym dowodem jest poprawna validacja kodu. Proponuje douczyć się standardów W3C. Stosowanie zdarzeń inline jest dużo szybsze niż dopinanie ich przez JS

I walidator jest wyznacznikiem standardów? To nie jest jakaś tam wyrocznia tylko proste, mało inteligentne narzędzie które sprawdza poprawność kodu pod względem składniowym, powiedz mi, jeśli stronę zbudujesz jedynie na samych div to czy się zwaliduje? Proponuję nie cieszenie się tak z powodu, że strona przechodzi walidację.

5. A dlaczego ma nie być na tabelce ? Tabelki służą do tabelarycznego prezentowania danych, w tym przypadku są nimi obrazki. Nie popadaj w skrajność. W dobie CSS i XHTML też korzysta się z tabelek ale nie do budowy layoutu tylko do tego, czego zostały wymyślone. Uwagi z tym, ze linki i zdjęcia nie maja ze sobą związku jakoś nie rozumiem. Możesz bliżej to przybliżyć

Chociażby dlatego, że cierpi na tym dostępność, weźmy na to osobę słabo widzącą która korzysta ze screenreadera.

6. Jak wyłączysz monitor to nic nie zobaczysz. A jak już komputer wyłączysz to już w ogóle.

Proponuję połączyć się z netem przez modem komórki, ja łącze się normalnie, ale jakbym tak robił to po pierwsze wyłączyłbym obrazki, i włączał je tylko w razie potrzeby.

Edit: nie zauważyłem że mike podałeś ten sam link do przykładów menu co ja:)

Ten post edytował grzesiek_g 14.01.2008, 14:48:19

[andrew1985]

Co do menu to mnie przekonaliście.
Ale co do onlick to nie zmienie zdania bo przy okazji robienia innego projektu, początkowo dołanczanie wszystkich akcji odbywało się za pomocą JS. W XHTML nie było żadnego onlick, onmouseout itp. Trochę tych podpięć było. Po zmianie na wszystkich akcji na inline czyli DHTML-wym sposobem strona ładowała się średnio o 0,5-1 sekundy szybciej
Dopinanie akcji przez JS może i jest eleganckie ale nie jest za szybkie. A osoby o słabym procku szczególnie to zauważą.

[grzesiek_g]

A osoby o słabym procku szczególnie to zauważą.

Więc proponuję dodać do 100 elementów onclick. Jak dużo czasu stracisz, jak dużo kodu będziesz musiał dodatkowo wysłać?

[andrew1985]

Więc proponuję dodać do 100 elementów onclick. Jak dużo czasu stracisz, jak dużo kodu będziesz musiał dodatkowo wysłać?

Właśnie przy 100 elegantach zaczyna się zauważać wyrazna różnicę. Ba wystarczy juz 20 a strona po załadowaniu naprawdę muli. Szczególnie pod FF i IE gdzie szybkość JS pozostawia wiele do życzenia. Dodasz 100 razy onlick do kodu i na pewno te kilka klio szybciej sie załaduję niż JS zdąży przelecieć cały kod i podpinać akcje. Pisze to z doświadczenia bo jak pisałem wcześniej, przy okazji innego większego projektu, na początku wszystko ładnie było dopinane przez JS ale po zmianie na DHTML strona naprawdę zyskała na wydajności.

Co nie ukrywa faktu ze chciało by sie pisać to elegancko za pomocą JS.

P.S. Jak się robi strony generowane dynamicznie to onlick pisze tylko raz. 100 razy powtorzy mi to parser danego jezyka za pomocą pętli.

Ten post edytował andrew1985 14.01.2008, 15:22:01

[grzesiek_g]

OK. Kończę tą dyskusję bo widzę, że nie ma ona żadnego skutku. DHTML, kiedy to już było?

[tiraeth]

Co do menu to mnie przekonaliście.

Więc? Kto pisze bzdury?

Te obrazki w tabelkach to już draka na maksa. Gdybyś ładnie wyfloatował divy, mógłbyś otrzymać taki sam efekt i mniej kodu do wysłania, A jak ktoś wyłączy styl CSS to zdecydowanie łatwiej będzie mu przeglądać to na komórce, palmtopie czy gdziekolwiek indziej.

Ostatnia sprawa. Używasz prototype (tak wynika z tego, że ładujesz do go strony). Czemu ograniczasz go tylko do Lightboxa? Po co takie wygibasy jak getElementsByTagName?

Wyłaczyłem CSS przy oglądaniu tej strony i muszę powiedzieć, że gdybyś odpowiednio używał znaczników i odpowiednio rozmieszczał elementy, to w rezultacie powinienem dostać czysty XHTML, z samym tekstem - gdzieniegdzie z jakimiś ikonkami. Pomijam już fakt sztywnego ustawiania kolorów dla tego menu.

(...) ale po zmianie na DHTML strona naprawdę zyskała na wydajności.

Masz wyniki benchmark?

[.radex]

ehh...

Kod

#header li{
 display: inline;    
}
#header li a{
 display: block;
 float: left;

/* .... */
}