Ocena pierwszej strony

pytanie zadane 24 października 2016 w HTML i CSS przez Pesio Użytkownik (760 p.)

Hej, jakiś czas temu zacząłem się uczyć html/css/js, teraz mam trochę mniej czasu bo zaczął się kolejny semestr na studiach, ale w międzyczasie staram się coś tam robić.

Prosiłbym o ocenę mojej pierwszej samodzielnie wykonanej strony, starałem się zaczerpnąć trochę sugestii z innych ocen, ale na pewno coś pomieszałem. Nie brałem pod uwagę jeszcze responsywności, dodam ją później, albo zawrę ją w kolejnym projekcie. Nie chcę na razie używać bootstrapa. Funkcja na slider wzięta z kursu MZ, nic przy niej za bardzo nie kombinowałem poza przepisaniem. Logo strony ma przypominać szyld na sklepie, docelowo pewnie zrobię je w formie obrazka.

Strona stworzona dla rodzinnej cukierni.

adres: pesio.ayz.pl

komentarz 24 października 2016 przez Pietrak Pasjonat (18,850 p.)

Cały js tragiczny i do wyrzucenia. Mieszasz warstwę html z js.

2 odpowiedzi

odpowiedź 24 października 2016 przez radek024 Szeryf (77,160 p.)

Super, że starasz się coś robić. Zobacz jednak na różne strony internetowe - czy to jest ten sam styl, co na Twojej stronie? Pamiętaj, że witryna nie ma się podobać Tobie, tylko klientowi. Brak RWD to taki grzech ciężki, warto by zainwestować czas w jego naukę, ponieważ bez niego nie ma sensu rozwijać innych umiejętności. W sumie strona jest przyjazna z wyglądu na poziomie PC - postaraj się, aby tak też było na mobilnych.

Co do kodu:

czemu całość jest w main? Przecież cała strona to nie najważniejsza zawartość. Pasek z wszelkie prawa zastrzeżone jak najbardziej nadaje się na footer, a element z logo - na header. Nawigacja też mogła by być oddzielnym elementem strony.
jeszcze do UX - zapomniałeś o wymianie grafik w slajderze, wyświetlają się z numerami,
brak właściwego outline strony - to częsty bład
<article class="rightdescription"> - nie nazywaj tak klas, ponieważ w dobie RWD coś przy mniejszej rozdzielczości nie musi być koniecznie po prawej stronie, a np.: na środku
Fajnie, że tabela przy cenach,
<div class="marginbar"></div> - to możesz załatwić za pomocą border-bottom,

<link href="https://fonts.googleapis.com/css?family=Bree+Serif|Mate+SC|Pinyon+Script&subset=latin-ext" rel="stylesheet">

<link rel="stylesheet" href="style.css"/>

<link rel="stylesheet" href="css/fontello.css"/>

style.css zawsze na końcu!
brak atrybutu lang dla html

	margin-left: auto;
	margin-right: auto;

szybszy zapis: margin: 0 auto;

.button
{
	float: left;
	margin: 10px;
	text-align: center;
	background-color: #910f0f;
	color: #f2c9c9;
	width: 220px;
	height: 50px;
	border-radius: 5%;
	font-size: 30px;
	text-align: center;
}

powtarzasz style
podpinaj skrypt js do wszystkich plików - kto wie, czy nie będziesz ich tam kiedyś potrzebował
sam JS rzeczywiście trochę średnio napisany.

Powodzenia dalej :)

komentarz 26 października 2016 przez Pesio Użytkownik (760 p.)

Dzięki za konstruktywną krytykę. Odpisuje tak późno, bo chciałem pokazać już poprawioną stronę. Ale chyba napiszę ją od zera.... RWD na pewno się zainteresuje, ale nie wszystko na raz ;). Co do JSa to przyznam się, że zupełnie go nie znam, bazowałem na tym co było w odcinku MZ na ten temat. Jestem jednak już uzbrojony w odpowiednią książkę.