Não sei se ficou claro o conceito de bloco mas no caso de uma lista como o exemplo abaixo
<section class="secao">
<ul class="secao_lista">
<li class="secao__lista__item"></li>
<li class="secao__lista__item"></li>
<li class="secao__lista__item"></li>
<ul>
<img class="secao__imagem">Onde tenho na lista o item que é filho da lista que é filho da seção, isso estaria certo? ou simplesmente colocaria <li class="secao__item"></li>
Oi, Hiago, tudo bem?
A ideia da metodologia BEM é tornar os blocos mais informativos e fáceis de serem lidos e entendidos.
A forma como você fez ficaria difícil de criar uma manutenção e uma leitura do html, caso dentro das li houvessem outro elementos, por exemplo uma a:
<section class="secao">
<ul class="secao_lista">
<li class="secao__lista__item">
<a class="secao__lista__item__link" > </a>
</li>
<li class="secao__lista__item">
<a class="secao__lista__item__link" > </a>
</li>
<li class="secao__lista__item">
<a class="secao__lista__item__link" > </a>
</li>
<ul>Quando você não adiciona o modificador lista dentro das classes li fica implícito que esse item faz parte de sessão, assim como secao_link faz parte do bloco seção.
Mas no caso de algum item da sua lista de li ter uma determinada aparência ou estado, você pode fazer:
<li class="secao__lista__item">
<a class="secao__lista--ativo" > </a>
</li>Nesse caos o modificador ativo está sinalizando que essa a receberá um estilo diferente dos demais, um estilo de link ativo.
Se ficou alguma dúvida é só falar!
Entendi, no caso de muitos elementos aninhados o ideal seria condensarmos o nome da classe da forma mais enxuta que pudermos, seria isso? No caso secao__lista__item__link seria muita coisa deixando o código um pouco verboso demais sem tanta necessidade já que só temos uma lista, seria isso?