Ocena mojego portfolio Opcje

[demolka666]

Witam,

Jestem początkującym webmasterem (mam na koncie dopiero 5 wykonanych stron). Bardzo proszę powiedzcie co sądzicie o projekcie mojego portfolio
link: citydesign.art.pl
Uwaga! Strona działa w tej chwili pod Operą, FF i IE 8. Pod innymi nowymi przeglądarkami też powinna. Nie będzie działać poprawnie z IE6 (dopiero napiszę osobny arkusz stylów dla IE6) i nie testowałam jej pod IE7.
Wszystkie uwagi mile widziane, nawet te najbardziej krytyczne

Ten post edytował demolka666 12.08.2010, 09:44:35

[frytek92]

Jeżeli prosta strona nie działa pod IE6 to znaczy ze jest zle napisana, zamiast <center> wyśrodkowanie zrób w CSS - margin-left: auto; margin-right: auto; .
Kwestia PNG to myślę ze jeżeli nie masz zamiaru zmieniać tła to użyj JPG, jeżeli masz zamiar to użyj PNG FIX to chyba na tyle jezeli chodzi o IE7 to nie widze większych problemów, ale myślę ze dobrze jest jeżeli strona chodzi we wszystkich przeglądarkach.

Pozdrawiam

[Pawel_W]

nie ma za bardzo czego oceniać, wypełnił może najpierw jakąś treścią, chociażby nawet "Lorem ipsum"

kod też na 36 linijek

taki kod:

[HTML] pobierz, plaintext 
<div class="top-left"></div><div class="top"></div><div class="top-right"></div> 
			<div class="middle">bla bla bla</div> 
			<div class="bottom-left"></div><div class="bottom"></div><div class="bottom-right"></div> 
[HTML] pobierz, plaintext 

to jednym słowem PORAŻKA, od robienia tego typu zaokrągleń jest CSS 3, ew. gotowe tło, ale nie podzielone na rogi, tylko góra i dół jak już

typografia też nie specjalnie mi leży

Kwestia PNG to myślę ze jeżeli nie masz zamiaru zmieniać tła to użyj JPG, jeżeli masz zamiar to użyj PNG FIX to chyba na tyle jezeli chodzi o IE7 to nie widze większych problemów, ale myślę ze dobrze jest jeżeli strona chodzi we wszystkich przeglądarkach.

PNG FIX nie działa dla teł

[erix]

To wystarczy to PNG wyświetlić jako filter.

[demolka666]

@frytek92
Problem z IE 6 polega na dwóch rzeczach: 1. brak obsługi PNG (nie mogę zastąpić GIFEM bo potrzebuję częściowej przeźroczystości!) 2. IE 6 nie interpretuje min-width, max-width, min-height, min-width. Dlatego napiszę osobny arkusz stylów dla IE6.
Dzięki za radę z wyśrodkowaniem, poprawię to jak najszybciej

@Pawel_W
nie jestem pewna, ale chyba nie wszystkie przeglądarki obsługują już CSS 3. Jeżeli tak jest to poszukam na ten temat i przepiszę ten fragment

@erix, dzięki, poszukam dziś wieczór o tym filter .

Jakbyście mogli jeszcze napisać wrażenia artystyczne - czy nie ma jakiś niepasujących graficznie elementów, jak się prezentuje nagłówek, box wewnętrzny itp.

[Pawel_W]

IE nie obsługuje, są do tego odpowiednie fixy, a jeżeli koniecznie chcesz zrobić to obrazkiem to tak jak mówiłe, wystarczy samo top i bottom, bez tego left i right

[gigzorr]

grafika ładna , czcionka w menu nie podoba mi się , oraz jakies teksty przykladowe dodaj czy coś bo nie ma nic.

[thomson89]

Grafika bardzo ładna. Kolory także. Jednakże to menu mi tam nie pasuje.

Przydałaby się jeszcze jakaś treść, bo teraz jest tam pusto i nie można ocenić np. typografii.

Zobacz.

[kreciko]

Czcionkę w menu zmień na bezszeryfową. Taką jak np. jest w googlach w menu, albo tutaj na forum w nawigacji.

[r4xz]

szczerze mówiąc nie przekonałaby mnie ta strona ona do skorzystania z twoich usług. zalatuje mi tu coś latami 90. ...
preferuje coś prostego oraz kreatywnego na portfolio np.
http://stripes-design.pl/
http://www.wooyek.pl/portfolio-webdesign.html

[dg2001]

[HTML] pobierz, plaintext 
<div id="footer"><a href="">Designed & Coded by Katarzyna Biernat</a>&nbsp;&nbsp;&nbsp;</div>
[HTML] pobierz, plaintext 

Takie coś mi się rzuciło w oczy, zamiast twardych spacji, nie lepiej użyć padding-right: 5px; ? albo margin-right ?

Co do wyglądu, nie jest źle, ale mi np nie pasuje coś ten książyc jakoś mi się tak rzuca w oczy i tan facet i tak kobieta, jakoś tak mi nie pasują może troche mniejsze, albo np niech jest tylko z 1 strony grupkach biznesowa Czcionka też mi się nie podoba dałbym jakąś zwykła

Pozdrawiam

[demolka666]

Strona jest już dostępna pod krótszym adresem:

link: citydesign.art.pl

Dokonałam kilka poprawek:
- zmieniłam czcionkę w Menu na Verdanę
- usunęłam to center (to była pozostałość po kodowaniu, po wstawieniu kolejnych elementów zapomniałam usunąć)
- zaokrąglone rogi uzyskałam przez CSS, dla IE użyłam skryptu js (w przypadkach rzadkich, jak stare, nieaktualizowane firefoxy czy opery wyświetli się box kwadratowy, co nie zaburzy za bardzo designu)
- dodałam przykładową treść.

I tutaj mam taki dylemat, bo nie mam pomysłu na kolory dla znaczników h1, h2. Jakieś to takie mdłe się robi. Macie jakąś koncepcję jakby ożywić projekt?

Poza tym:
Wersja dla IE6 dalej nie gotowa
@dg2001 - zaraz będę wprowadzać poprawki zasugerowane przez Ciebie ^^
@r4xz - przykłady które podałeś są fantastyczne. Ja niestety nie jestem grafikiem, a już artysta ze mnie żaden. Bardziej mnie bawi kodowanie czy programowanie PHP (+ uczę się JS) więc wygląd do dla mnie zło konieczne . Grafikę wykonuję taką bardziej podstawową - jak na tej stronie . Ale może kiedyś coś lepszego stworzę .

edit:
@dg2001 poprawiłam footer. Księżyc raczej zostawię, nad postaciami się jeszcze raz zastanowię . W którym miejscu dokładnie czcionka nie ta? W nagłówku, menu (już poprawiłam) czy treści?

Ten post edytował demolka666 12.08.2010, 09:44:54

[kreciko]

I tutaj mam taki dylemat, bo nie mam pomysłu na kolory dla znaczników h1, h2. Jakieś to takie mdłe się robi. Macie jakąś koncepcję jakby ożywić projekt?

Jak chcesz ożywić projekt, to daj oczojebny kolorek, albo zmień czcionkę na jakąś inną. Dla mnie kolor h1 i h2 jest ok, ale jestem tylko mężczyzną i się nie znam na kolorach. Zobacz jak wygląda z białą czcionką, albo taką szarą(bardziej białą niż czarną) - taki np.: #DBDBDB

[demolka666]

IE 6 juz działa, dalej myślę nad kolorami ^^

[SHiP]

Jeżeli prosta strona nie działa pod IE6 to znaczy ze jest zle napisana

Nie zgadzam się. Każdy wie, że to z IE jest coś nie tak. Poza tym IE6 to trup i nie ma sensu go wskrzeszać. Nikt na zachodzie już się nie przejmuje tą przeglądarką więc i ja bym to sobie darował tym bardziej, że statystyki IE6 spadają(a ma on teraz zaledwie 4% - http://ranking.pl/pl/rankings/web-browsers.html - i co miesiąc spada o jakieś 0.2%.).

Używasz HTML 4.01 ja jednak pokusiłbym się o użycie HTML5. Mimo, że to wciąż nie jest standard i pewnie coś się zmieni, będzie to wyglądało bardziej profesjonalnie, a strona w ogóle nie ucierpi. Wystarczy kilka rzeczy zmienić:

doctype na <!DOCTYPE html>
<div id="header"> na <header>
<div id="menu"> na <nav>
<div id="cont"> na <article>
<div id="footer"> <footer>

Przykład mojej strony w html5: http://srodek.info/music/

Ogólnie jest to bardzo prosta witryna i nie ma za wiele rzeczy do oceniania. Ja przyczepiłbym się do typografi a dokładniej szerokości lini. Jest za szeroko.
Czekam na więcej treści .

PS:
Jeśli nie przekonam cię do html5 to usuń zbędny znacznik <div> w menu. Powinno być.

[HTML] pobierz, plaintext 
<ul id="menu">
(...)
</ul>
[HTML] pobierz, plaintext 

[kreciko]

Przykład mojej strony w html5: http://srodek.info/music/

Podoba mi się ten efekt z gitarą. Gdzieś już to widziałem.

[demolka666]

@SHiP
Efekt z gitarą jest świetny. Ogólnie z tego co udało mi się w różnych miejscach wyczytać, HTML5 i CSS3 są świetne (co do tego drugiego już się zdążyłam przekonać), ale nie mają wsparcia niektórych przeglądarek (zwłaszcza IE ). Specyfika mojej strony jest taka, że musi być dostępna dla każdego, zwłaszcza ludzi, którzy o technologiach nie mają pojęcia i używają IE6 tylko dlatego że akurat był on zainstalowany 5 lat temu na ich przestarzałym, nieaktualizowanym systemie.

Ale, zamierzam na pewno poczytać więcej na ten temat

Treść wrzucę już za niedługo, jak tylko coś sensownego wymyślę. Mam już nawet pewną koncepcję.

[erix]

HTML5, to generalnie inny zestaw znaczników - reszta rewolucji, to CSS i obiekty w JS.

Z tego, co czytałem, to da się zmusić tagi z HTML5 do normalnego parsowania w IE, wystarczy bodajże linijka expression w CSS. Ale to nie zmienia faktu, że nie ma co się jeszcze podniecać "nowym" językiem, który - de facto - ma zmiany wyłącznie w semantyce (zaznaczam, że mówię wyłącznie o części SGML, a nie o towarzyszących mu technologiach).

Podoba mi się ten efekt z gitarą. Gdzieś już to widziałem.

O ile pamiętam, to na SmashingMagazine był kiedyś przegląd takich rozwiązań.

[SHiP]

Aby tagi z HTML5 działały pod IE i innymi starszymi przeglądarkami wystarczy je "włączyć" tj.

[CSS] pobierz, plaintext 
article, nav, header, aside, footer, section, address{
display:block;
}
[CSS] pobierz, plaintext 

Domyślnie wszystkie nieznane znaczniki mają display:none; Dlatego ich nie widać.

Pozdrawiam .

PS: można też skryptu JS użyć - jest na tej mojej stronie w źródle...

Ten post edytował SHiP 12.08.2010, 15:00:53

[thomson89]

Ten efekt gitarki się wiesza u mnie. Mam rolkę którą bardzo szybko mogę wszystko przewinąć