• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Ocena prostej strony

Object Storage Arubacloud
0 głosów
248 wizyt
pytanie zadane 29 września 2018 w HTML i CSS przez Zuber Nowicjusz (230 p.)
zmienione kategorie 29 września 2018 przez draghan
Cześć chciałbym żebyście rzucili okiem na stronkę którą napisałem :). Pomysł wziąłem z facebookowej grupy Weekly Dev Challange lecz potraktowałem ją jako proste ćwiczenie, a nie projekt który trzeba odwzorować jeden do jednego.

Kod:
https://github.com/RafalStan/Weekly-dev-challenge-1

Demo
https://rafalstan.github.io/Weekly-dev-challenge-1/?SendEmailName=&SendEmail-Email=&userMessage=
1
komentarz 29 września 2018 przez Tomek Sochacki Ekspert (227,510 p.)
Ale co dokładnie chcesz abyśmy ocenili? Bo tak na prawdę to tu nie ma co do oceniania, użyłeś po prostu gotowej libki PrefixFree co nie jest złe, bo korzystania z libek też trzeba się nauczyć ale napisz czego dokładniej od nas oczekujesz.
komentarz 29 września 2018 przez Zuber Nowicjusz (230 p.)
Przyznaje że nie do końca doprecyzowałem :) Chodziło o sprawdzenie poprawności kodu, co można usprawnić oraz co zostało zupełnie zepsute. Liczę po prostu na porady od bardziej doświadczonych osób które wytkną mi błędy, złe nawyki czy dadzą jakieś protipy :)
1
komentarz 29 września 2018 przez Tomek Sochacki Ekspert (227,510 p.)
oki, w takim razie dałem parę kwestii do przemyślenia jako odpowiedź :)

1 odpowiedź

+1 głos
odpowiedź 29 września 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 29 września 2018 przez Zuber
 
Najlepsza

Oki, to parę takich drobnych kwestii do rozważenia:

  1. dlaczego 1.jpg nie znajduje się w folderze img?
  2. dlaczego w folderze img masz różne standardy nazewnictwa plików, raz z podkreśleniami, za chwilę myślniki, a jeszcze potem spacje... jeśli przy tak małym projekcie nie panujesz nad tym to przy dużym na pewno się rozłożysz :) Nie chodzi tu stricte o obrazki bo akurat to może najmniej trafny przykład, ale np. już w plikach js, css itp. nazewnictwo jest bardzo ważne, co więcej niektóre frameworki wręcz wymagają pewnych konwencji. Warto zawsze myśleć o strukturze plików nawet jeśli to mikro projekt, chodzi o nawyki.
  3. dlaczego nazwaleś plik body-bg.jpg? Pytanie podchwytliwe :) Teraz oki, jest to tło bodziaka i wsio pasuje. Ale co jeśli apka by się rozwinęła to z czasem ten sam plik zacząłbyś używać jako tło nie wiem, buttona czy czegokolwiek? Nie chodzi mi, że jest to błąd, chcę Ci tylko zaznaczyć, że zawsze warto myśleć perspektywicznie o nazwach plików, funkcji, zmiennych itp. Kiedyś może zechcesz zmienić tło na inne, podmienisz więc ten plik i bum... nagle zmieniło się tło jakiegoś diva, czego nie otestowałeś bo zapomniałeś, i sugerowałeś się nazwą pliku :)
  4. Dlaczego wszystkich elementom nadajesz padding i margin zerowy? Nie jest to błąd, ale jest to pewne stare myślenie w kategoriach strony jako całości. Kiedyś nawet nagminnie stosowało się tzw. resety css (sam tego kiedyś używałem), ale znacznie lepiej jest myśleć o stronach jak o zestawach małych, reużywalnych komponentów i gdy wejdziesz w to myślenie to nagle żadne style globalne nie są potrzebne. To taka rada na przyszłość, z czasem sam się przekonasz.
  5. .visually-hidden { 
        left: -999em; 
        position: absolute;
    }

    hmm, a dlaczego nie po prostu display: none? Być może jest jakiś sens w tych Twoich stylach, ale czy za pół roku na pewno będziesz wiedział o co kaman? Może błąd tkwi gdzieś w założeniach, przemyśl to.

  6. Jeśli pracujesz na globalnych stylach dla całej apki to unikałbym styli typu .form > div itp. Jest to zbyt ryzykowne pod kątem przyszłych zmian, modyfikacji, rozbudowy itp. Wyjątkiem od tej zasady jest stylowanie komponentów, gdzie mamy pełną enkapsulację, w takich przypadkach pozwalam sobie na stylowanie nawet po tagach ale generalnie nie jest to dość częste i zależy np. od stopnia rozbudowania danego komponentu.

  7. .form .username-input, .form .password-input, .form .confirm-password-input, .form .email-input, .form .location-input, .form .phone-input{
    

    a dlaczego nie stworzyłeś po prostu osobnej klasy z tymi stylami, i nie przypisałeś jej do tych wszystkich elementów?

  8. input[type=text], input[type=email], input[type=password], input[type=tel], input[type=number]

    j.w.

  9. o html się nie wypowiem bo tu nie jestem mistrzem i niechętnie wchodzę w pliki .html :)

Parę jeszcze uwag ogólnych:

  1. dlaczego w readme nie ma linku do dema skoro istnieje?
  2. masz na GH też swoje CV, nie przeglądalem go, ale pierwsze co widzę to plik reset.css. Gdybym miał Cię rekrutować to moje pierwsze pytanko po co ten reset, co Ci daje, dlaczego go używasz, jakie są alternatywy bez niego itp. Nie odpowiadaj, to takie pytanko dla Ciebie do przemyślenia tylko :)
  3. Kolejne pytanko, skoro krozystasz z zewnętrznej libki co nie jest złe, ale pytanko - czy umiesz i czy wiesz czy się w ogóle da (dać się da zawsze, ale chodzi o możliwość z poziomu libki bez ingerencji w jej core) np. zmienić ikonki na tych inputach itp.? Chodzi o to, aby sprawdzić, czy faktycznie czytałeś dokumentację libki i sam to robiłeś czy po prostu przekopiowałeś kod z jakiegoś innego miejsca :)
komentarz 29 września 2018 przez Zuber Nowicjusz (230 p.)
Dzięki wielkie za rady :) Rzeczywiście to co napisałeś daje do myślenia, bo robiąc strony jako świeżak często zapomina się o szerszym spojrzeniu na projekt i nie bierze się pod uwagę czegoś takiego jak dalsze użycie kodu. Właśnie dlatego tak cenie sobie taką pomoc, bo pomaga to zmienić cały mindset. Jeśli chodzi o GH to narazie służy mi jako miejsce do przechowywania kodu ale widocznie muszę o niego trochę bardziej zadbać. A jeśli chodzi o font awesome to poniekąd specjalnie dobrałem sobie projekt by trochę się tym pobawić :) Aczkolwiek zauważyłem teraz że jedna ikonka nie do końca działa tak jak powinna. Jeszcze raz wielkie dzięki za poświęcony czas i wiedzę :)

Podobne pytania

0 głosów
4 odpowiedzi 235 wizyt
pytanie zadane 14 stycznia 2020 w Nasze projekty przez kubafila Nowicjusz (120 p.)
0 głosów
5 odpowiedzi 330 wizyt
pytanie zadane 14 kwietnia 2017 w HTML i CSS przez MrRozgunek Użytkownik (810 p.)
+1 głos
0 odpowiedzi 333 wizyt
pytanie zadane 28 marca 2021 w HTML i CSS przez janzw4 Bywalec (2,050 p.)

92,576 zapytań

141,426 odpowiedzi

319,652 komentarzy

61,961 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

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!

...