Odstępy między elementami

pytanie zadane 21 września 2019 w HTML i CSS przez Marcin759 Nowicjusz (200 p.)

Zastanawiam się czy powinienem robić jednoliniowe odstępy między elementami. Czy to powinno wyglądać tak:

<!DOCTYPE html>

<html>
	<head>
		<meta charset = "utf-8">
	<head>
	
    <body>
		<h1>To jest nagłówek pierwszego poziomu</h1>
		
		<p>Ten tekst może stanowić wprowadzenie do dalszej części strony.</p>			
		
		<h2>To jest nagłówek drugiego poziomu</h2>		
		
		<p>Wiele długich artykułów zawiera nagłówki niższych poziomów</p>			
		
		<h2>Kolejny nagłówek drugiego poziomu</h2>
		
		<p>A oto przykłada drugiego nagłówka</p>
	</body>
</html>

? Czy może tak:

<!DOCTYPE html>
<html>
	<head>
		<meta charset = "utf-8">
	<head>
	<body>
		<h1>To jest nagłówek pierwszego poziomu</h1>		
		<p>Ten tekst może stanowić wprowadzenie do dalszej części strony.</p>	
		<h2>To jest nagłówek drugiego poziomu</h2>		
		<p>Wiele długich artykułów zawiera nagłówki niższych poziomów.</p>			
		<h2>Kolejny nagłówek drugiego poziomu</h2>
		<p>A oto przykłada drugiego nagłówka</p>
	</body>
</html>

? Intuicja podpowiada mi ten pierwszy sposób, ale w książce, którą mam przykłady są podane bez tych odstępów.

2 odpowiedzi

odpowiedź 21 września 2019 przez Krzysztof Korpas Obywatel (1,560 p.)

Witam,

Pierwszy zapis jest jak najbardziej dobry w trakcie tworzenia, zapewnia większą przejrzystość kodu.

Jednak gdy kończysz już pracę nad projektem i chcesz go "wydać" lepszym kodem będzie ten drugi.

Bardzo często w wersjach końcowych rezygnuje się ze wszystkich białych spacji, z reguły przy użyciu specjalnych optymalizatorów.

komentarz 23 września 2019 przez Marcin759 Nowicjusz (200 p.)

dzięki

odpowiedź 21 września 2019 przez Tomek Sochacki Ekspert (227,510 p.)

Rób sobie odstępy w taki sposób, aby wyróżnić konkretne elementy na stronie, aby Tobie i innym łatwiej się to czytało i pracowało z kodem. Docelowy build produkcyjny i tak powinien być przepuszczony przez minifikator, ale to Cię nie interesuje, od tego są narzędzia. Tak samo jak w JS.