Basic HTML structure for three columns of articles
HTML is what's known as a markup language, which means the actual meaning of the elements (whether you choose div or sections) is up to the code to interpret.

Browsers have their own CSS files they apply to every page, so which tag you choose to use for an element doesn't really matter. Except for types like img and video that have special purpose in the browser

That said, using tag names that better suit the purpose increases the readability of your code and improves maintainability for future development.

Standards like HTML5 add more style rules for elements (as well adding more special purpose types like img and a bunch more stuff).

There's not an optimization tradeoff as the CSS engine doesn't treat rules on div different than rules on sections.


  Should I have a header tag inside each article?


Yeah, that's exactly what it's for! Mozilla Developer Network says that the header element is for representing heading elements, specifically even quoting usage designed for a wrapped section's header.


  I heard this is best practice but I feel like this would make the code harder to read 


While code readability is arguably a personal thing, I always felt that this kind of layout:

&lt;div class='section'&gt;
  &lt;h1 class='header'&gt;Item&lt;/h1&gt;
  &lt;div class='content'&gt;
    &lt;div class='photo'&gt;
      &lt;img src="logo.png" /&gt;
    &lt;/div&gt;
    &lt;div class='description'&gt;
      &lt;p&gt;Text&lt;/p&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;


Was a lot harder to understand than something like:

&lt;section&gt;
  &lt;header&gt;Item&lt;/header&gt;
  &lt;content&gt;
    &lt;photo&gt;
      &lt;img src="logo.png" /&gt;
    &lt;/photo&gt;
    &lt;description&gt;
      &lt;p&gt;Text&lt;/p&gt;
    &lt;/description&gt;
  &lt;/content&gt;
&lt;/section&gt;


Especially seeing as you can now easily see which closing tag is which.


  Should I keep a line break between different items like sections?


Again, code readability is up to you, do whatever is easier for you to understand.


  in a big HTML file you could have like 200 empty lines making the code way bigger than it has to be. What do people usually do about this?


If you've got that many elements, it might time to use a library (like jQuery, Ember, Angular or React) to manage your data and make the HTML layouts for you.

However for just a normal HTML file, line breaks aren't necessarily bad. Extra lines don't bloat the files, so you don't need to worry too much about the files being bloated.

Like I said before, code readability is an intensely personal thing. While I (and any other reviewers) can take a look at code at tell you how readable it is, you're the one developing it, and it's your creation.