How to organize by BEM or independent blocks.?

Question

css

<Список продуктов>
     <Заголовок списка продуктов>  </Заголовок списка продуктов>
          <Продукт в списке>
               <Картинка продукта> </Картинка продукта>
               <Название продукта> </Название продукта>
          </Продукт в списке>
</Список продуктов>

How to properly organize by BEM or independent blocks.
That's right?

<div class="product-list">
    <h2 class="product-list__title"></h2>
    <div class="product-list__item">
        <div class="product-list__img"></div>
        <div class="product-list__title"></div>
    </div>
</div>

Answer 1

item here it is more convenient to make a block, not an element

<div class="product-list">
    <h2 class="product-list__title"></h2>
    <div class="product-item">
        <div class="product-item__img"></div>
        <div class="product-item__title"></div>
    </div>
</div>