Na pewno też popełniłem trochę błedów i niektóre rzeczy dało się zrobić prościej i ładniej, prosze o porady dla świeżaka :D
Taki zapis
<a href="...">
<button>
...
</button>
</a>
jest błędny pod kątem accessibility.
Zasada jest taka, żeby nie zagnieżdżać elementu klikalnego wewnątrz drugiego elementu, który także można kliknąć, czyli odpadają nam wszystkie kombinacje tego typu
<a href="...">
<button>
...
</button>
</a>
<button>
<a href="...">
...
</a>
</button>
<a href="...">
<input ...>
</a>
<button>
<textarea></textarea>
</button>
itd
Jeśli chcesz żeby link wyglądał jak przycisk to powinieneś dostosować sam wygląd znacznika <a>
.
Zdjęcia powinny mieć atrybut alt
, bo także jest to błąd związany z accessibility :p, oraz dobrze jakby posiadały atrybuty width i height, bo poprawia to sposób ładowania zdjęć.
Jeśli nie można dobrać odpowiedniego opisu alt
przykladowo przy zdjęciach czysto dekoracyjnych to można zostawić pustą wartość
<img src="..." alt="">
Do znajdywania tego typu błędów możesz skorzystać np z walidatora W3C (https://validator.w3.org/#validate_by_uri)
Starałem się tworzyć tak, żeby strona była responsywna, ale dla jakich wielkości ustalać kiedy kończy się telefon a zaczyna monitor? (tablet omijam)
Warto tutaj przejrzeć kilka frameworków css i sprawdzić jakie breakpointy obsługują nawet jak nie planujesz i nie chcesz z nich korzystać w aplikacji. Wtedy na ich podstawie możesz sobie w prosty sposób ustalić samemu odpowiednie wartości
Mam problem z ustawieniem obiektow w stopce, nie potrafilem ich w jakis ludzki sposob wycentrowac, tak żeby znajdowały się na środku jeśli chodzi o wysokość. (z szerokością mi się udało) I ustawiałem używając margin-top.
Musiałbyś pokombinować z właściwością align-items
, oraz justify-content
z flexboxa.
.footer {
display: flex;
align-items: center;
justify-content: center;
}