diff -u b/core/modules/locale/lib/Drupal/locale/Tests/LocaleContentTest.php b/core/modules/locale/lib/Drupal/locale/Tests/LocaleContentTest.php
--- b/core/modules/locale/lib/Drupal/locale/Tests/LocaleContentTest.php
+++ b/core/modules/locale/lib/Drupal/locale/Tests/LocaleContentTest.php
@@ -182,25 +182,25 @@
 
     // Check if English node does not have lang tag.
     $this->drupalGet('node/' . $nodes['en']->id());
-    $pattern = '|class="[^"]*node[^"]*"[^<>]*lang="en"|';
+    $pattern = '|class="[^"]*node--' . $nodes['en']->id() . '[^"]*"[^<>]*lang="en"|';
     $this->assertNoPattern($pattern, 'The lang tag has not been assigned to the English node.');
 
     // Check if English node does not have dir tag.
-    $pattern = '|class="[^"]*node[^"]*"[^<>]*dir="ltr"|';
+    $pattern = '|class="[^"]*node--' . $nodes['en']->id() . '[^"]*"[^<>]*dir="ltr"|';
     $this->assertNoPattern($pattern, 'The dir tag has not been assigned to the English node.');
 
     // Check if Arabic node has lang="ar" & dir="rtl" tags.
     $this->drupalGet('node/' . $nodes['ar']->id());
-    $pattern = '|class="[^"]*node[^"]*"[^<>]*lang="ar" dir="rtl"|';
+    $pattern = '|class="[^"]*node--' . $nodes['ar']->id() . '[^"]*"[^<>]*lang="ar" dir="rtl"|';
     $this->assertPattern($pattern, 'The lang and dir tags have been assigned correctly to the Arabic node.');
 
     // Check if Spanish node has lang="es" tag.
     $this->drupalGet('node/' . $nodes['es']->id());
-    $pattern = '|class="[^"]*node[^"]*"[^<>]*lang="es"|';
+    $pattern = '|class="[^"]*node--' . $nodes['es']->id() . '[^"]*"[^<>]*lang="es"|';
     $this->assertPattern($pattern, 'The lang tag has been assigned correctly to the Spanish node.');
 
     // Check if Spanish node does not have dir="ltr" tag.
-    $pattern = '|class="[^"]*node[^"]*"[^<>]*lang="es" dir="ltr"|';
+    $pattern = '|class="[^"]*node--' . $nodes['es']->id() . '[^"]*"[^<>]*lang="es" dir="ltr"|';
     $this->assertNoPattern($pattern, 'The dir tag has not been assigned to the Spanish node.');
   }
 
diff -u b/core/modules/node/lib/Drupal/node/Tests/NodeTitleTest.php b/core/modules/node/lib/Drupal/node/Tests/NodeTitleTest.php
--- b/core/modules/node/lib/Drupal/node/Tests/NodeTitleTest.php
+++ b/core/modules/node/lib/Drupal/node/Tests/NodeTitleTest.php
@@ -61,7 +61,7 @@
     $this->assertEqual(current($this->xpath($xpath)), $node->label(), 'Node breadcrumb is equal to node title.', 'Node');
 
     // Test node title in comment preview.
-    $this->assertEqual(current($this->xpath('//article[contains(concat(" ", normalize-space(@class), " "), :node-class)]/h2/a/span', array(':node-class' => 'node--type-' . $node->bundle() . ' '))), $node->label(), 'Node preview title is equal to node title.', 'Node');
+    $this->assertEqual(current($this->xpath('//article[contains(concat(" ", normalize-space(@class), " "), :node-class)]/h2/a/span', array(':node-class' => 'node--' . $node->id() . ' '))), $node->label(), 'Node preview title is equal to node title.', 'Node');
 
     // Test node title is clickable on teaser list (/node).
     $this->drupalGet('node');
diff -u b/core/modules/node/node.module b/core/modules/node/node.module
--- b/core/modules/node/node.module
+++ b/core/modules/node/node.module
@@ -685,22 +685,23 @@
 
   // Gather node classes.
   $variables['attributes']['class'][] = 'node';
-  $variables['attributes']['class'][] = drupal_html_class('node--type-' . $node->bundle());
+  $variables['attributes']['class'][] = drupal_html_class('node--' . $node->bundle());
   if ($node->isPromoted()) {
-    $variables['attributes']['class'][] = 'node--promoted';
+    $variables['attributes']['class'][] = 'is-promoted';
   }
   if ($node->isSticky()) {
-    $variables['attributes']['class'][] = 'node--sticky';
+    $variables['attributes']['class'][] = 'is-sticky';
   }
   if (!$node->isPublished()) {
-    $variables['attributes']['class'][] = 'node--unpublished';
+    $variables['attributes']['class'][] = 'is-unpublished';
   }
   if ($variables['view_mode']) {
-    $variables['attributes']['class'][] = drupal_html_class('node--view-mode-' . $variables['view_mode']);
+    $variables['attributes']['class'][] = drupal_html_class('view-mode-' . $variables['view_mode']);
   }
   if (isset($variables['preview'])) {
-    $variables['attributes']['class'][] = 'node--preview';
+    $variables['attributes']['class'][] = 'is-preview';
   }
+
 }
 
 /**
diff -u b/core/modules/node/templates/node.html.twig b/core/modules/node/templates/node.html.twig
--- b/core/modules/node/templates/node.html.twig
+++ b/core/modules/node/templates/node.html.twig
@@ -76,7 +76,7 @@
  * @ingroup themeable
  */
 #}
-<article class="{{ attributes.class }}"{{ attributes }}>
+<article class="node--{{ node.id }} {{ attributes.class }}"{{ attributes }}>
 
   {{ title_prefix }}
   {% if not page %}
@@ -86,7 +86,7 @@
   {% endif %}
   {{ title_suffix }}
 
-  {% if display_submitted %}
+  {% if author or display_submitted %}
     <footer class="node__meta">
       {{ author }}
       {{ submitted }}
diff -u b/core/modules/system/css/system.theme.css b/core/modules/system/css/system.theme.css
--- b/core/modules/system/css/system.theme.css
+++ b/core/modules/system/css/system.theme.css
@@ -6,10 +6,10 @@
 /**
  * Publishing status.
  */
-.node--unpublished {
+.is-unpublished {
   background-color: #fff4f4;
 }
-.node--preview {
+.is-preview {
   background-color: #ffffea;
 }
 
diff -u b/core/themes/bartik/css/style.css b/core/themes/bartik/css/style.css
--- b/core/themes/bartik/css/style.css
+++ b/core/themes/bartik/css/style.css
@@ -672,28 +672,28 @@
 .node__content {
   font-size: 1.071em;
 }
-.node--view-mode-teaser .node__content {
+.view-mode-teaser .node__content {
   font-size: 1em;
 }
-.node--view-mode-teaser h2 {
+.view-mode-teaser h2 {
   margin-top: 0;
   padding-top: 0.5em;
 }
-.node--view-mode-teaser h2 a {
+.view-mode-teaser h2 a {
   color: #181818;
 }
-.node--view-mode-teaser {
+.view-mode-teaser {
   border-bottom: 1px solid #d3d7d9;
   margin-bottom: 30px;
   padding-bottom: 15px;
 }
-.node--view-mode-teaser.node--sticky {
+.view-mode-teaser.sticky {
   background: #f9f9f9;
   background: rgba(0, 0, 0, 0.024);
   border: 1px solid #d3d7d9;
   padding: 0 15px 15px;
 }
-.node--view-mode-teaser .node__content {
+.view-mode-teaser .node__content {
   clear: none;
   line-height: 1.6;
 }
@@ -702,11 +702,11 @@
   color: #68696b;
   margin-bottom: -5px;
 }
-.node__meta .field-name-field-user-picture img {
+.node__meta--submitted .field-name-field-user-picture img {
   float: left; /* LTR */
   margin: 1px 20px 0 0; /* LTR */
 }
-[dir="rtl"] .node__meta .field-name-field-user-picture img {
+[dir="rtl"] .node__meta--submitted .field-name-field-user-picture img {
   float: right;
   margin-left: 20px;
   margin-right: 0;
diff -u b/core/themes/bartik/templates/node.html.twig b/core/themes/bartik/templates/node.html.twig
--- b/core/themes/bartik/templates/node.html.twig
+++ b/core/themes/bartik/templates/node.html.twig
@@ -69,7 +69,7 @@
  * @see template_preprocess_node()
  */
 #}
-<article class="{{ attributes.class }} clearfix"{{ attributes }}>
+<article class="node--{{ node.id }} {{ attributes.class }} clearfix"{{ attributes }}>
 
   <header>
     {{ title_prefix }}
@@ -80,8 +80,8 @@
     {% endif %}
     {{ title_suffix }}
 
-    {% if display_submitted %}
-      <div class="node__meta">
+    {% if author or display_submitted %}
+      <div class="node__meta node__meta--submitted">
         {{ author }}
         {{ submitted }}
       </div>