UI:
-Te pytanie z boku to bardzo zły pomysł, praktycznie jest na skraju.
-Sekcja: treść -> nie równe paddinigi.
- Modal -> nie rozciągnięte komponenty na całą długość.
- Podkreślenia - mogą być mylne, typowy użytkownik pomyśli że to link do czegoś (w Modalu)
- Grid -> brak paddingów, zlewa się.
- Grid-> dałbym większy padding od dołu
- Grid -> nie równy padding kontenera
- Scrollu scroluu -> Coś ci wypływa poza kontener.
- fb- button -> lepiej by wyglądao z odstępem
- Modal-contact -> O chryste zmień to ;p
- form-zaloguj -> Logo się rozmazuje, lepiej użyć formatu svg lub znacznika source/picture.
- form->strona główna -> Przycisk się rozleciał.
- form->Lepiej by było jakby się mieściło na 1 ekranie bez scrolla.
- form-button-nie masz => nieklikalny link.
- form-register => to samo co przy form-zaloguj
- Nieresponsywna.
Techniczne:
- Nie stosuj idków.
- wystarczy charset
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- Błędny alt nie mówi faktycznie co to jest oraz jakie ma znaczenie.
<img src="images/logo.png" alt="logo" id="logo">
- Po co taka skomplikowanie, łatwiej flexem,line-height. Relative powoduje za dużo problemów:
position: relative;
padding-right: 100px;
display: block;
outline: none;
float: left;
top: 5px;
- top: 5 px? Skąd taki wynik? Potem logo 7%?
- Lepszy header
<div id="menu">
<a href="index.php"><img src="images/logo.png" alt="logo" id="logo"> </a>
<div id="menu_tekst">
<ul>
<li class="nmob"><a href="index.php">Strona Główna</a></li>
<li class="nmob"><a href="#Xkontenerow">Dyskopatia</a></li>
<li><a href="" class="uruchomO" data-okienkoid="#okienko1">Kontakt</a></li>
<li><a href="logowanie/">Zaloguj</a></li><li><a href="logowanie/rejestracja.php">Zarejestruj się</a></li> </ul>
</div>
</div>
- Nie ładnie jest ukrywać, to nie rozwiązanie !
@media only screen and (max-width: 900px)
style.css:552
#kont_food, .nmob, blockquote {
/* display: none; */
}
- Nawigacja nie jest nawigacją.
- Kiepski 'spinacz', dla containerów lepiej ustawiać elastyczność.
#Spinacz_strony {
width: 1500px;
margin-left: -750px;
position: absolute;
left: 50%;
display: inline;
}
Dlaczego on jest inline?, choć elementy nie są inline. Właściwie nic nie spina.
- Komentarze w HTML. Zalecane na develu :), nie na produkcji :)
- Dobry alt.
<img src="images/pyt.png" alt="dowiedz się więcej" id="pyt">
- Spniacz2 spina treść, ale treść jesst w innym miejscu coś tu nie pykło.
- ZA DUŻO ABSOLUTÓW.
- Lepiej jakby to było artykułem:
<section class="xtresc">
<blockquote>
<h4>Pojęcie obejmujące zmiany w budowie krążka międzykręgowego. Często jest to pierwszy z etapów choroby zwyrodnieniowej kręgosłupa.</h4> </blockquote> <h4>Dyskopatia, staje się kolejną plagą społeczną.<br> Może ona dotyczyć każdego, statystycznie każdy z nas przechodzi przynajmniej raz w życiu incydent bólowy związany z kręgosłupem.</h4>
</section>
- Skąd te h4? Nie widzialem nigdzie struktury nagłówków.
<h4>Pojęcie obejmujące zmiany w budowie krążka międzykręgowego. Często jest to pierwszy z etapów choroby zwyrodnieniowej kręgosłupa.</h4>
- Obok kolejny h4 który nie jest nagłówkiem.
- section jest jak mówi nazwą sekcją, lepiej by było na odwrót, że section to container a nie div który nie ma żadnego znaczenia.
- Tu to samo:
<div id="spinacz3">
<div id="Xkontenerow">
<div id="kontenery_tekst1"> <div class="kont"><h3>Jak dbać o kręgosłup?</h3> <p>Zbyt rzadko się nad tym zastanawiamy, <b>o kręgosłupie trzeba myśleć zanim dojdzie do urazu</b>. Jeżeli zmiany w kręgosłupie nie sprawiają bólu można zmienić swoje przyzwyczajenia, aby zapobiegać kłopotom w przyszłości...</p> <br>
<div class="wrapper">
<a href="podstrony/p1.php" target="_blank" class="button">Czytaj dalej</a>
</div>
</div> </div>
<div id="kontenery_tekst2"> <div class="kont"> <h3>Dyskopatia- co jeśli niezbędna jest operacja?</h3> <p>Dyskopatia dotyka coraz więcej osób, jest to popularna choroba. <b>Czasem jedynym sposobem na poprawę jest operacja</b>. Dowiedz się jakie metody są obecnie stosowane oraz na czym polegają...</p>
<div class="wrapper">
<a href="podstrony/p2.php" target="_blank" class="button">Czytaj dalej</a>
</div></div> </div>
<div id="kontenery_tekst3"> <div class="kont"><h3>Ból kręgosłupa</h3> <p> Jak mieszkańcy Polski oceniają swoje zdrowie, czy dbają o nie i wykonują badania profilaktyczne? Dane z EHIS wskazują <b>bóle kręgosłupa jako główną przyczynę długotrwałych problemów zdrowotnych</b>... </p> <div class="wrapper">
<a href="podstrony/p3.php" target="_blank" class="button">Czytaj dalej</a>
</div></div></div>
<div id="kontenery_tekst4"> <div class="kont2"><h3>Domowe sposoby na ból kręgosłupa</h3> <p>Dolegliwości bólowe kręgosłupa można łagodzić za pomocą zmiant stylu życia. Domowe sposoby na bóle pozwolą rozluźnić mięśnie pleców. <b>Pamiętaj, że na ból pleców pomagaja również aktywność fizyczna</b>... </p>
<div class="wrapper">
<a href="podstrony/p4.php" target="_blank" class="button">Czytaj dalej</a>
</div></div>
</div>
<div id="kontenery_tekst5"> <div class="kont2"> <h3>Prawidłowa pozycja przy komputerze</h3> <p>Z wyników badań opublikowanych przez Ergotest.pl dowiadujemy się, że <b> tylko 1/100 stanowisk jest przystosowane do używania stanowiska komputerowego</b>. Gorzej jest w naszych domach, tam nie pilnujemy swojej postawy...</p>
<div class="wrapper">
<a href="podstrony/p5.php" target="_blank" class="button">Czytaj dalej</a>
</div></div> </div>
<div id="kontenery_tekst6"> <div class="kont2"> <h3> Anatomia kręgosłupa</h3><p> Dolegliwości bólowe kręgosłupa w krajach rozwiniętych przemysłowo określono epidemią. <b>W Polsce śrefnio co trzeci Polak cierpi na bóle kręgosłupa.</b> Większość z nas uważa kręgosłup za odporny na wszelkie przeciążenia, co jest mylne... </p>
<div class="wrapper">
<a href="podstrony/p6.php" target="_blank" class="button">Czytaj dalej</a>
</div></div> </div>
</div>
<div class="clear"> </div>
</div>
- Ustawianie kontenerów na sztywno to zły pomysł
<div id="kontenery_tekst2"> <div class="kont"> <h3>Dyskopatia- co jeśli niezbędna jest operacja?</h3> <p>Dyskopatia dotyka coraz więcej osób, jest to popularna choroba. <b>Czasem jedynym sposobem na poprawę jest operacja</b>. Dowiedz się jakie metody są obecnie stosowane oraz na czym polegają...</p>
<div class="wrapper">
<a href="podstrony/p2.php" target="_blank" class="button">Czytaj dalej</a>
</div></div> </div>
-
DONT DO THIS:
<div class="clear"> </div>
Podsumuwujać: Do poprawki za dużo absolutów.