Ocena kobiecego kodowania, design + kodowanie do oceny Opcje

[Natalka]

Witam

W temacie poniżej pytałam co sądzicie o moim "start-upie", postanowiłam zmienić design i chciałabym prosić w chwili obecnej o ocenę zarówno
wyglądu jak i kodowania.

Do cięcia poprzedniej grafiki się nie przyłożyłam i trochę olałam sprawę, tutaj mam nadzieję że trochę się zrewanżowałam i co nieco nadrobiłam.

Wszelkie porady, co zmienić są mile widziane.

Waga strony: 143kb i to ma bardzo duże znaczenie dla mnie bo strona będzie miała dużą ilość odsłon, dlatego też oszczędzałam na grafice i
starałam się zastąpić na wszelkie możliwe sposoby grafikę w CSS'ie.


Link do strony: http://www.szablonallegro.pl/new/index.html


A tutaj kolejne podstrony nie zakodowane jeszcze:

Strona z widokiem na szablon

Kontakt

Pomoc

Dodatki

logowanie + w górnym prawym rogu widok po zalogowaniu



Z góry dziękuje wszystkim za pomoc

Stronę sprawdzałam tylko w Mozilli i IE7, więc jak ktoś sprawdzi i wszystko będzie w porządku lub nie to proszę o informacje.

Ten post edytował Natalka 15.02.2010, 03:46:32

[r4xz]

Opera 10 - działa poprawnie

IE6 - jak zawsze - źle wyświetla

przechodzi przez walidator bez błędów, źródło strony wygląda schludnie - dobra robota! 

[lukasz91]

Ogólnie ładny lay. Jednak ja bym poprawił dwa elementy
- "nazwa" i "cena" są wg mnie za ciemne na tym niebieskim tle
- odcień szarego w środkowej części jest za ciemny jak dla mnie

Ten post edytował lukasz91 15.02.2010, 09:49:46

[Gryf]

ładny lay do tego co już zostało wcześniej napisane
miłe dla oka było by gdyby cena oraz nazwa szablonu były wyrównane ;]

[r4xz]

 jeszcze mała pierdółka rzuciła mi się w oczy, a dokładniej to: http://www.szablonallegro.pl/new/images/strzalka.jpg

czemu ma inne tło niż samo pole z kategoriami (jasnoszary)?

Ten post edytował r4xz 15.02.2010, 10:27:35

[Kildyt]

Design średniej jakości, nie zaskakuje, ale również nie robi obciachu.

Kod

background-color:#E1E1E1; background-image: url(images/bg.jpg); background-repeat: repeat-x;

wszystko do background.

H1 kichę warte. Pusty link dla google ma bardzo niską jakość.
Linki do rejestracji i logowania na ul.
Title w linku to rozwinięcie anchora, a nie powtarzanie co jest zupełnie bezsensu.

[HTML] pobierz, plaintext 
<p class="online">Aktualnie online: <span>15</span></p> 
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<p class="nawigacja">Tutaj jesteś: <a href="#" title="Strona główna">Strona główna</a></p> 
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<p>Nazwa: <a href="#" title="Szablon kosmetyczny">Szablon kosmetyczny</a></p> 
<p>Cena: <span>30,00 pln</span></p>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<p class="copyright">Copyright ˆ 2010 <a href="#" title="Szablon allegro">SzablonAllegro.pl</a></p>
[HTML] pobierz, plaintext 

To nie jest paragraf.

[HTML] pobierz, plaintext 
<p class="wyszukiwarka">Wyszukiwarka szablonów:</p> <form action="#" method="post"><input type="text" name="wyszukiwarka" id="wyszukiwarka" /> <input type="submit" name="wyszukaj" id="szukaj" value="Szukaj" /></form>
[HTML] pobierz, plaintext 

"Wyszukiwarka szablonów" powinien być labelem. Dodaj fieldset i strict'a masz z głowy.
Angielskie nazewnictwo to oznaka profesjonalizmu i użyteczności.

[HTML] pobierz, plaintext 
<a href="#" class="konsultant" title="Konsultant"></a> 
[HTML] pobierz, plaintext 

Tyle samo wart co w h1.
Komentarze dot. budowy thema w dobrze napisanym kodzie są zbędne.
Definiujesz język angielski strony.
Aby uzyskać większą przejrzystość kodu radziłbym zastosować tzw. nazewnictwo wielbłądzie. Dla przykładu: "szablonboxyellow" to "szablonboxYellow".

Następnym razem nie zaznaczaj, że kodowanie jest "kobiece" bo co niektórzy mogą patrzeć na ciebie łagodniejszym okiem, a to niewskazane.

[Natalka]

IE6 - jak zawsze - źle wyświetla

Na poprzedniej stronie tego typu był niewielki odsetek ludzi, którzy wchodzili z IE6, więc nie będę specjalnie przystosowywać. Liczę się z tym, że stracę tych kilku klientów, ale z IE6 jest więcej problemów niż pożytku.

- "nazwa" i "cena" są wg mnie za ciemne na tym niebieskim tle
- odcień szarego w środkowej części jest za ciemny jak dla mnie tongue.gif

Nazwa i Cena mają się wyróżniać więc ustawiony został ciemniejszy kolor.
Jaśniejszy szary zlewałby całą stronę, bo wszystko byłoby zbyt jasne.

miłe dla oka było by gdyby cena oraz nazwa szablonu były wyrównane ;]

Naprawione.

jeszcze mała pierdółka rzuciła mi się w oczy, a dokładniej to: http://www.szablonallegro.pl/new/images/strzalka.jpg

czemu ma inne tło niż samo pole z kategoriami (jasnoszary)?

To był mały leń, ale już zostało poprawione.

Kod

background-color:#E1E1E1; background-image: url(images/bg.jpg); background-repeat: repeat-x;

wszystko do background.

Naprawione.

H1 kichę warte. Pusty link dla google ma bardzo niską jakość.
Linki do rejestracji i logowania na ul.
Title w linku to rozwinięcie anchora, a nie powtarzanie co jest zupełnie bezsensu.

Do H1 troszkę się nie zgodzę, moim zdaniem brak anchora nie jest całkowicie bez jakości, ustawiony zostanie Title dla linku i alt dla obrazka. Moim zdaniem to pomaga i ja się tego akurat trzymam.
Linki do rejestracji i logowania, to już tylko lenistwo.
Title w linku będzie zmienione wszędzie, jest to sam szablon strony, do całości dojdzie jeszcze zaprogramowanie i większość będzie wczytywana z bazy z różnymi title.

Kod

<p class="online">Aktualnie online: <span>15</span></p>

Kod

<p class="nawigacja">Tutaj jesteś: <a href="#" title="Strona główna">Strona główna</a></p>

Kod

<p>Nazwa: <a href="#" title="Szablon kosmetyczny">Szablon kosmetyczny</a></p>

Kod

<p>Cena: <span>30,00 pln</span></p>

Kod

<p class="copyright">Copyright � 2010 <a href="#" title="Szablon allegro">SzablonAllegro.pl</a></p>

To nie jest paragraf.

Niestety nie znam innego sposobu na zastosowanie tutaj, co prawda można tutaj rozdzielić i może to jest w obecnej formie nie poprawne ale już w taki sposób nauczyłam się "kodować" i jest to dla mnie wygodne rozwiązanie.

Komentarze dot. budowy thema w dobrze napisanym kodzie są zbędne.
Definiujesz język angielski strony.
Aby uzyskać większą przejrzystość kodu radziłbym zastosować tzw. nazewnictwo wielbłądzie. Dla przykładu: "szablonboxyellow" to "szablonboxYellow".

Tutaj niestety się nie zgodzę, komentarze użyte są tylko przy wyświetlaniu boksów z szablonami. Jest ich tutaj 9 ! muszę wiedzieć kiedy się kończy a kiedy zaczyna. Gdybym miała
za każdym razem szukać końca to kilka sekund by mi to zajęło, a tak to czysta wygoda. Dla mnie kod jest dobrze napisany i skoro sama go stworzyłam potrafię się w nim odnaleźć
więc dodatkowe komentarze są tutaj zbędne.
Co do języka strony i nazewnicta, każdy stosuje takie z jakim mu wygodnie. W moim kodzie nikt inny grzebać nie będzie więc nie zwracam uwagi na to czy dla kogoś "wielbłądzie" pismo
jest wygodniejsze lub nie. Dla mnie wygodne są nazwy takie jakie mam obecnie jak i forma zapisu.


Bardzo dziękuje wszystkim za odpowiedzi, postaram się dopieścić ten szablon do jak najlepszej formy.

Ps. Miałam nadzieje, że opinię będą bardziej wyrozumiałe, starałam się a niestety nikt nie docenił mojej pracy

[bl4ck_b0x]

...myślisz, że jesteś kobietą to będą ulgowo Cię traktować? Wytykają Ci błędy żebyś wiedziała czego unikać w przyszłości a wybiegając już całkiem w przyszłość... w prawdziwej pracy nikt nie będzie się nad Tobą użalał

[SHiP]

Ja Cię pochwalę, bo moim zdaniem jest bardzo dobrze ale nie byłbym sobą gdybym nie miał kilku uwag.

Na pierwszy rzut oka ja bym się przyczepił do kilku rzeczy:
a) raz polskie, raz angielskie nazwy, a czasem hybrydy. Tak się nie robi =) albo wszystko po polsku albo wszystko po angielsku
Czsami jest za dużo znaczników np: <div id="menu"><ul> możesz zamienić na <ul id="menu"> (no żechyba są tam jakieś tła i w IE to nie działa poprawnie)
c) czasami uzywasz klas dla elementów unikalnych np: online, darmowe, wyszukiwarka, nawigacja, kolsuntant. Powinno być id
d) Kolega pisał ale trochę niepoprawnie "Wyszukiwarka szablonów" powinna być legendem a formularz powinien być umieszczony w fieldset.
e) Nie zostawia się pustych linków. Sprawdz czy po wyłączeniu CSS i obrazków dalej da się poruszać po stronie - u Ciebie link kolsuntant będzie niewidoczny
f) Zmieniłbym DOCTYPE na strict a jezyk na polski

Dziwne robisz wcięcia w css . Pierwszy raz sie z czymś takim spotykam ale skoro Tobie jest wygodnie .

Swoją drogą nie rozumiem dlaczego stopka nie może być paragrafem?

[ave]

przejrzyście i czytelnie.
kod strony to dla mnie sprawa 2-rzędna, strona ma zarabiać a nie wyglądać.
95% twoich klientów nawet nie zaglądnie w kod...

chodź zawsze znajdą się maniakopedanci..

[r4xz]

przejrzyście i czytelnie.
kod strony to dla mnie sprawa 2-rzędna, strona ma zarabiać a nie wyglądać.
95% twoich klientów nawet nie zaglądnie w kod...

chodź zawsze znajdą się maniakopedanci..

ale ci co zaglądają w kod raczej nie będą kupować szablonów, bo umieją je robić samodzielnie. czyli ogólnie strona spełnia swoje zadania idealnie - prosta, czytelna, czego chcieć więcej?

[Kildyt]

d) Kolega pisał ale trochę niepoprawnie "Wyszukiwarka szablonów" powinna być legendem a formularz powinien być umieszczony w fieldset.

Masz rację. Zastosowanie legenda jest bardziej zgodne ze standardami i postrzeganiem tego kodu. Label za to daje użyteczność (aktywowanie inputa po naciśnięciu na tytuł). W tym wypadku zastosowałbym labela w legendzie.

Swoją drogą nie rozumiem dlaczego stopka nie może być paragrafem?

W tym wypadku stopka jest tekstem jednoliniowym, więc bardziej nadawał by się span, ale to już raczej czepianie się z mojej strony.

[Natalka]

Witam serdecznie ponownie,

Chciałabym poprosić o ocenę i test mojego "skryptu" z podstroną z dodatkami :

Strona z Dodatkami

Całość zawiera:

Pobieranie linków do statusów Gadu-Gadu
Pobieranie linków do statusów Skype
Pobieranie linków do profilu Allegro (profil, komentarze, wysyłanie wiadomości, strona o mnie, ID użytkownika) - dzięki usłudze WebApi Allegro
Loga kurierów pocztowych
Loga Banków

Moje zabezpiecznia :

Brak możliwości wpisania liter w numerze gadu-gadu
Jeżeli login w serwisie allegro nie istnieje wysyłany jest odpowiedni komunikat z błędem


Jest to pierwsza wersja skryptu, którą stworzyłam w 2,5godziny dlatego też mogą być błędy i proszę o pomoc.

Do całości dojdą jeszcze Bannery dla użytkowników w stylu "kupuj u sprawdzonego sprzedawcy".

Linki będą zmienione na bardziej "przyjazne".


Szablon po lewej stronie można podglądnąć przyciskiem "podgląd". Do tego efektu wykorzystałam plugin Jquery.


Ps. Linki z inputów z logami kurierów i banków w obecnej chwili są nie aktywne.
Ps2. Macie jakieś propozycję nowych dodatków jakie mogą przydać się dla sprzedawców ?



Natalia.

Ten post edytował Natalka 17.02.2010, 16:16:36

[koderrr]

wyglada ok , ale link powinien byc na calym obrazku a nie tylko na linku tekstowym

jak klikasz w obszar obrazka to pojawia sie ramka ale nie mozna przejsc dalej


po wpisaniu zlego numeru gg nie ma zadnego info o tym


Ten post edytował koderrr 17.02.2010, 17:02:32

[Natalka]

Nie po kliknięciu, a po najechaniu jest to :hover.

Troszkę rozjaśniłam boxy z dodatkami, bo zlewały się z tłem.

Ten post edytował Natalka 17.02.2010, 17:42:07

[SHiP]

Huh z zabezpieczeniami słabo. Widać na pierwszy rzut oka podatność na ataki XSS:
http://www.podliski.pl/dodatki.php?statusS...29%3C/script%3E

Filtruj znaki specjalne .

Pozdrawiam

[Natalka]

dodałam htmlspeciachars();

[piotrooo89]

szczerze, jakoś mnie to nie powala. powinno być w inputach jak sie kliknie to od razu cały zostaje zaznaczony.


validator krzyczy.

aha no i słaba obsługa błędów. wpisałem zły nr GG i co zostaje przerzucony na główną stronę i nie wiem co się dzieje tak naprawdę.

Ten post edytował piotrooo89 18.02.2010, 11:18:46