Nie jest zgodna.
Przykładowy kod zgodny z BEM:
<div class="aboutMe">
<h3 class="aboutMe__headline">Witaj!</h3>
<h2 class="aboutMe__name">Jestem Adam Kowalski,</h2>
<h1 class="aboutMe__role">web developer - freelancer</h1>
<button class="aboutMe__btn">Zobacz moje portfolio</button>
</div>
W bloku (.aboutMe) powinny być poszczególne elementy pełniące konkretne role. Każdy z elementów w Twoim div tak naprawdę pełni inną rolę, więc powinno to mieć odzwierciedlenie w BEM-ie.
Dodanie .aboutMe__title do buttona sugeruje, że jest jakimś tytułem – a nie jest w żaden sposób. Dodanie tutaj .aboutMe__title--btn nie zmienia nic, bo to jedynie oznaczałoby tytuł w przyciskowym wariancie, co nie bardzo ma sens. A tak każdy element ma swoją określoną rolę.
W teorii można zrobić jeszcze inaczej: nagłówki potraktować jako jeden element, .aboutMe__heading, i rozróżniać przy pomocy modyfikatorów:
<div class="aboutMe">
<h3 class="aboutMe__heading aboutMe__heading--headline">Witaj!</h3>
<h2 class="aboutMe__heading aboutMe__heading--name">Jestem Adam Kowalski,</h2>
<h1 class="aboutMe__heading aboutMe__heading--role">web developer - freelancer</h1>
<button class="aboutMe__btn">Zobacz moje portfolio</button>
</div>
Jednak tutaj raczej szedłbym w tę pierwszą wersję. Zwłaszcza, że tak po prawdzie tylko Twoje imię powinno być tutaj nagłówkiem:
<section class="aboutMe">
<p class="aboutMe__headline">Witaj!</p>
<h1 class="aboutMe__name">Jestem Adam Kowalski,</h1>
<p class="aboutMe__role">web developer - freelancer</p>
<button class="aboutMe__btn">Zobacz moje portfolio</button>
</section>