wady i zalety wcięć w kodzie html/css

Question

cześć! mam mętlik w głowie xd

bo, jakiś czas temu, tak przypadkowo tylko zerknąłem, nie pamiętam gdzie przeczytałem/odoglądnąłem że wcięcia w kodzie w sensie "białe znaki"

<div>
<!-- o tutaj -->
    <p>lorem ipsum dolor</p>
<!-- o tutaj -->
    <div>
<!-- o tutaj -->
        <h1>lorem ipsum dolor</h1>
<!-- o tutaj -->
    </div>
<!-- o tutaj -->    
</div>

żeby tak nie robić z jakiegoś powodu (no i właśnie też nie pamiętam dlaczego)

ale te wcięcia, nie wiem jak wam ale dla mnie kod jest bardziej czytelny i w ogóle, dlatego mam ten mętlik

więc co dają nam te wcięcia bądź ich brak?

Answer 1

Przy publikacji minimalizuje się pliki (html, css ,js) - czyli usuwa białe znaki w celu zmniejszenia rozmiaru plików pobieranych przez użytkownika. Ale to się robi przy pomocy automatycznych narzędzi, przy pisaniu kodu wcięcia są jak najbardziej pożądane - zwiększają czytelność.

Answer 2

Wcięcia w kodzie robisz właśnie po to, aby kod był czytelniejszy, czyli widać było poziomy zagnieżdżenia instrukcji czy elementów strony. Porównaj (twój przykład) kod bez wcięć, z którego bez dłuższego zastanawiania się nie "zobaczysz" struktury strony:

<div>
<p>lorem ipsum dolor</p>
<div>
<h1>lorem ipsum dolor</h1>
</div>
</div>

z kodem zawierającym wcięcia - w tym przypadku od razu widzisz, co w czym siedzi.

<div>
    <p>lorem ipsum dolor</p>
    <div>
        <h1>lorem ipsum dolor</h1>
    </div>
</div>

Ale nie traktuj tego jako dogmat - w programowaniu i tworzeniu stron nie ma dogmatów, są tylko dobre praktyki, które powstały na podstawie doświadczeń niezliczonych programistów. Pisz jak ci wygodnie, ale jeżeli chcesz opublikować kod, musisz się również liczyć ze zdaniem i przyzwyczajeniami innych.