Подскажите, пожалуйста, то что я верстаю это БЭМ? )) Уж как то классы жирные получаются ((
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Some title here</title>
<meta name="description" content="">
<meta name="viewport" content="">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css">
<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">
</head>
<body class='body'>
<!--[if lte IE 8]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
<div id='pagewrap' >
<header class='header'>
</header><!-- End of class header -->
<div class='logo'>
<div class='logo__block1' >
</div> <!-- End of class logo__block1 -->
<div class='logo__block2' >
</div> <!-- End of class logo__block2 -->
</div><!-- End of class logo -->
<nav class='nav'>
</nav><!-- End of class logo -->
</header><!-- End of class header -->
<section class='mainSection'>
<div class='mainSection__block1' >
</div> <!-- End of class mainSection__block1 -->
<div class='mainSection__block2' >
<div class='mainSection__block3' >
</div><!--End of class mainSection__block3-->
<div class='mainSection__block4' >
</div><!--End of class mainSection__block4-->
</div> <!-- End of class mainSection__block2 -->
</section><!-- End of class mainSection -->
<section class='BreackingNewsSection'>
<div class='BreackingNewsSection__header'>
<p class='BreackingNewsSection__header --center'> BREACKING NEWS </p>
</div><!-- End of class BreackingNewsSection__header -->
<div class='BreackingNewsSection__body'>
<div class='BreackingNewsSection__oneNews --marginleft'>
</div><!-- End of class BreackingNewsSection__oneNews -->
<div class='BreackingNewsSection__oneNews'>
</div><!-- End of class BreackingNewsSection__oneNews -->
<div class='BreackingNewsSection__oneNews'>
</div><!-- End of class BreackingNewsSection__oneNews -->
<div class='BreackingNewsSection__oneNews --marginRight'>
</div><!-- End of class BreackingNewsSection__oneNews -->
</div><!-- End of class BreackingNewsSection__body -->
</section><!-- End of class BreackingNewsSection -->
<section class='LatestStoriesSection'>
<div class='LatestStoriesSection__header'>
<p class='LatestStoriesSection__header --center'> LATEST STORIES </p>
</div><!-- End of class LatestStoriesSection__header -->
<div class='LatestStoriesSection__block1'>
<div class='LatestStoriesSection__oneNews'>
<div class='LatestStoriesSection__oneNews__Img' >
</div><!-- End of class LatestStoriesSection__oneNews__Img -->
<div class='LatestStoriesSection__oneNews__text'>
<p class='LatestStoriesSection__oneNews__header'>
Neque porro quisquam est
</p>
<p class='LatestStoriesSection__oneNews__body'>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
</p>
</div><!-- End of class LatestStoriesSection__oneNews__text -->
</div><!-- End of class LatestStoriesSection__oneNews -->
<div class='LatestStoriesSection__oneNews'>
<div class='LatestStoriesSection__oneNews__Img' >
</div><!-- End of class LatestStoriesSection__oneNews__Img -->
<div class='LatestStoriesSection__oneNews__text'>
<p class='LatestStoriesSection__oneNews__header'>
Neque porro quisquam est
</p>
<p class='LatestStoriesSection__oneNews__body'>
Lorem Ipsum has been the industry's standard dummy text
</p>
</div><!-- End of class LatestStoriesSection__oneNews__text -->
</div><!-- End of class LatestStoriesSection__oneNews -->
</div><!-- End of class LatestStoriesSection__block1 -->
<div class='LatestStoriesSection__block2'>
</div><!-- End of class LatestStoriesSection__block2 -->
<div class='LatestStoriesSection__block3'>
<ul class='gorizontalMenu' >
<li class='gorizontalMenu__li' > <a>Previous</a> </li>
<li class='gorizontalMenu__li --chosen' > <a>1</a> </li>
<li class='gorizontalMenu__li' > <a>2</a> </li>
<li class='gorizontalMenu__li' > <a>3</a> </li>
<li class='gorizontalMenu__li' > <a>4</a> </li>
<li class='gorizontalMenu__li' > <a>5</a> </li>
<li class='gorizontalMenu__li' > <a>Next</a> </li>
</ul>
</div>
</section><!-- End of class LatestStoriesSection -->
<article class='article'>
</article> <!-- End of class article -->
<footer class='footer'>
</footer><!-- End of class footer -->
</div> <!-- End of id pagewrap -->
<script src="scripts/app.js"></script>
</body>
</html>
