Logowanie

Ocena strony.

pytanie zadane 22 września 2016 w HTML i CSS przez KariK-02 Mądrala (6,030 p.)

Hej, prosiłbym o ocenę mojej strony: http://cariweb.pl/

Głównie proszę o opinie dotyczące kodu oraz layoutu.

4 odpowiedzi

odpowiedź 22 września 2016 przez jpacanowski VIP (101,940 p.)

<link rel="stylesheet" href="css/style.css" />
        <link rel="stylesheet" href="fontello/css/fontello.css" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

style.css powinno się ładować na samym końcu innych styli, a zwł. po bootstrap.css

<div id="footer">

Używasz <nav>, a nie używasz <footer>?

<div class="form-group">

                                <input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/>

                            </div>

Pola formularza muszą mieć etykiety ---> <label>

<br><br><br>

Od tego jest margin...

1	komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.) Poprawione ;)

komentarz 22 września 2016 przez jpacanowski VIP (101,940 p.)

<label><input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/></label>

Źle ;) Powinno być tak:

<label id="n" class="sr-only">Imię i nazwisko</label>
<input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/>

komentarz 22 września 2016 przez jpacanowski VIP (101,940 p.)

- połączyłem <label> poprawnie z konkretnym <input>’em poprzez [id]
- dodałem treść etykiety w ramach Accessibility, i ukryłem klasą .sr-only

komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.)

Może teraz jest ok ?

komentarz 22 września 2016 przez jpacanowski VIP (101,940 p.)

<label>Imię i nazwisko:</label>
<input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/>

Jest źle. Czytaj wyżej. Nie powiązałeś etykiet z konkretnymi <input>'ami.

komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.)

Chodzi o id ?

komentarz 22 września 2016 przez jpacanowski VIP (101,940 p.)

No tak, pisałem o id i nie tylko o tym. Etykiety musisz jeszcze ukryć klasą .sr-only jeśli nie chcesz żeby się wyświetlały. Wyświetlą się tylko na czytnikach.

komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.)

A co daje dodanie <label> ?

komentarz 22 września 2016 przez jpacanowski VIP (101,940 p.)

Chodzi o Accessibility, o Dostępność witryn. Gdyby nie byłoby <label>, osoby korzystające z czytników internetowych nie widziałyby co w dane pole formularza wpisać.

komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.)

Ok :)

komentarz 24 września 2016 przez jpacanowski VIP (101,940 p.)

<label id="n" class="sr-only">Imię i nazwisko</label>
<input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/>

Mój błąd... za szybko pisałem... powinno być:

<label for="n" class="sr-only">Imię i nazwisko</label>
<input type="text" class="form-control" name="name" id="n" placeholder="Imię i nazwisko" required/>

Czyli podaje się atrybut [for] dla <label> i jako wartość tego atrybutu podaje się wartość atrybutu [id] pola formularza - po to aby połączyć pole formularza z etykietą.

komentarz 24 września 2016 przez KariK-02 Mądrala (6,030 p.)

oki

odpowiedź 22 września 2016 przez CzlowiekSkrypt Nałogowiec (26,340 p.)

No po kilku poprzednich "stronach" do oceny tu wreszcie jest coś na co da się patrzeć :) inna sprawa że na stronce prawie nic nie ma :D

komentarz 22 września 2016 przez KariK-02 Mądrala (6,030 p.)

Dzięki :)

odpowiedź 22 września 2016 przez radek024 Szeryf (77,160 p.)

Layout: Fajnie że Roboto, kolory nie gryzą itd - ale co można z tej strony wyciągnąć? Nie sądzę, aby te treści, które podałeś, interesowały kogokolwiek :<

Kod:

fajnie że jest lang
niefajnie, że title ma taką samą treść co url, i że jest przed ustaleniem charsetu
skrypty na koniec body, coby ładowały się szybciej pozostałe elementy,
niefajnie, że brak semantyki,
a gdzie jest h1? Czemu logotyp nie ma zastępczej nazwy?
.socials powinno być listą,
br to nie znacznik to tworzenia pustej przestrzeni.

I chyba tyle - ludzie, twórzcie te strony bogatsze :<

odpowiedź 23 września 2016 przez Eimens Maniak (69,240 p.)

Footer jest a gdzie header, main ? Semantyka leży!

w <title> Nie musisz wpisywać ".pl"

Bardziej ocenię sam wygląd strony niż jej kod, bo to już ci napisali.

Plusy (+)

kolory elementu nav,
Dobre zdjęcie,
Czcionka

Minusy (-)

wielkość czcionki w menu,
kolor <body> <-- zmieniłbym na #eee i ciemna czcionka,
Ikony fb i tw w elemencie <footer>,
grubości czcionek (tyczy się całej strony)

Jak na standardy tego forum to nie jest źle!

Podobne pytania

+1 głos

5 odpowiedzi 647 wizyt

Ocena strony

pytanie zadane 25 grudnia 2016 w HTML i CSS przez Mistrz0000000 Bywalec (2,780 p.)

0 głosów

2 odpowiedzi 314 wizyt

Ocena strony

pytanie zadane 25 września 2016 w HTML i CSS przez zgrybus Pasjonat (24,860 p.)

+3 głosów

10 odpowiedzi 834 wizyt

Ocena strony ,,Wizytówka"

pytanie zadane 26 sierpnia 2016 w HTML i CSS przez Snejker Nowicjusz (160 p.)

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...