diff --git a/docs/app/Examples/elements/Image/Groups/ImageGroupSizeExample.js b/docs/app/Examples/elements/Image/Groups/ImageExampleGroupSize.js
similarity index 86%
rename from docs/app/Examples/elements/Image/Groups/ImageGroupSizeExample.js
rename to docs/app/Examples/elements/Image/Groups/ImageExampleGroupSize.js
index 1fa16cae4f..03f2ce8e87 100644
--- a/docs/app/Examples/elements/Image/Groups/ImageGroupSizeExample.js
+++ b/docs/app/Examples/elements/Image/Groups/ImageExampleGroupSize.js
@@ -3,7 +3,7 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageImageExample = () => (
+const ImageExampleGroupSize = () => (
   <div>
     <Image.Group size='tiny'>
       <Image src={src} />
@@ -21,4 +21,4 @@ const ImageImageExample = () => (
   </div>
 )
 
-export default ImageImageExample
+export default ImageExampleGroupSize
diff --git a/docs/app/Examples/elements/Image/Groups/index.js b/docs/app/Examples/elements/Image/Groups/index.js
index 52f4cc520a..7cfa804b29 100644
--- a/docs/app/Examples/elements/Image/Groups/index.js
+++ b/docs/app/Examples/elements/Image/Groups/index.js
@@ -6,8 +6,8 @@ const ImageTypesExamples = () => (
   <ExampleSection title='Groups'>
     <ComponentExample
       title='Size'
-      description='A group of images can be formatted to have the same size'
-      examplePath='elements/Image/Groups/ImageGroupSizeExample'
+      description='A group of images can be formatted to have the same size.'
+      examplePath='elements/Image/Groups/ImageExampleGroupSize'
     />
   </ExampleSection>
 )
diff --git a/docs/app/Examples/elements/Image/States/ImageDisabledExample.js b/docs/app/Examples/elements/Image/States/ImageExampleDisabled.js
similarity index 71%
rename from docs/app/Examples/elements/Image/States/ImageDisabledExample.js
rename to docs/app/Examples/elements/Image/States/ImageExampleDisabled.js
index 5a07572eef..8def8ad8b6 100644
--- a/docs/app/Examples/elements/Image/States/ImageDisabledExample.js
+++ b/docs/app/Examples/elements/Image/States/ImageExampleDisabled.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageDisabledExample = () => (
+const ImageExampleDisabled = () => (
   <Image src={src} size='small' disabled />
 )
 
-export default ImageDisabledExample
+export default ImageExampleDisabled
diff --git a/docs/app/Examples/elements/Image/States/ImageHiddenExample.js b/docs/app/Examples/elements/Image/States/ImageExampleHidden.js
similarity index 72%
rename from docs/app/Examples/elements/Image/States/ImageHiddenExample.js
rename to docs/app/Examples/elements/Image/States/ImageExampleHidden.js
index 5ac256a06c..67685bcb27 100644
--- a/docs/app/Examples/elements/Image/States/ImageHiddenExample.js
+++ b/docs/app/Examples/elements/Image/States/ImageExampleHidden.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageHiddenExample = () => (
+const ImageExampleHidden = () => (
   <Image src={src} size='small' hidden />
 )
 
-export default ImageHiddenExample
+export default ImageExampleHidden
diff --git a/docs/app/Examples/elements/Image/States/index.js b/docs/app/Examples/elements/Image/States/index.js
index 27789b42d6..f555ec55df 100644
--- a/docs/app/Examples/elements/Image/States/index.js
+++ b/docs/app/Examples/elements/Image/States/index.js
@@ -6,13 +6,13 @@ const ImageStatesExamples = () => (
   <ExampleSection title='States'>
     <ComponentExample
       title='Hidden'
-      description='An image can be hidden'
-      examplePath='elements/Image/States/ImageHiddenExample'
+      description='An image can be hidden.'
+      examplePath='elements/Image/States/ImageExampleHidden'
     />
     <ComponentExample
       title='Disabled'
-      description='An image can show that it is disabled and cannot be selected'
-      examplePath='elements/Image/States/ImageDisabledExample'
+      description='An image can show that it is disabled and cannot be selected.'
+      examplePath='elements/Image/States/ImageExampleDisabled'
     />
   </ExampleSection>
 )
diff --git a/docs/app/Examples/elements/Image/Types/ImageHrefExample.js b/docs/app/Examples/elements/Image/Types/ImageExampleHref.js
similarity index 77%
rename from docs/app/Examples/elements/Image/Types/ImageHrefExample.js
rename to docs/app/Examples/elements/Image/Types/ImageExampleHref.js
index d62cebc375..5541466c84 100644
--- a/docs/app/Examples/elements/Image/Types/ImageHrefExample.js
+++ b/docs/app/Examples/elements/Image/Types/ImageExampleHref.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image-text.png'
 
-const ImageHrefExample = () => (
+const ImageExampleHref = () => (
   <Image src={src} size='small' href='http://google.com' target='_blank' />
 )
 
-export default ImageHrefExample
+export default ImageExampleHref
diff --git a/docs/app/Examples/elements/Image/Types/ImageImageExample.js b/docs/app/Examples/elements/Image/Types/ImageExampleImage.js
similarity index 71%
rename from docs/app/Examples/elements/Image/Types/ImageImageExample.js
rename to docs/app/Examples/elements/Image/Types/ImageExampleImage.js
index 8577e33a6f..651e25e412 100644
--- a/docs/app/Examples/elements/Image/Types/ImageImageExample.js
+++ b/docs/app/Examples/elements/Image/Types/ImageExampleImage.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageImageExample = () => (
+const ImageExampleImage = () => (
   <Image src={src} size='small' />
 )
 
-export default ImageImageExample
+export default ImageExampleImage
diff --git a/docs/app/Examples/elements/Image/Types/ImageWrappedExample.js b/docs/app/Examples/elements/Image/Types/ImageExampleWrapped.js
similarity index 71%
rename from docs/app/Examples/elements/Image/Types/ImageWrappedExample.js
rename to docs/app/Examples/elements/Image/Types/ImageExampleWrapped.js
index 08c53e1d18..b3c3d5347e 100644
--- a/docs/app/Examples/elements/Image/Types/ImageWrappedExample.js
+++ b/docs/app/Examples/elements/Image/Types/ImageExampleWrapped.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageImageExample = () => (
+const ImageExampleWrapped = () => (
   <Image src={src} size='small' wrapped />
 )
 
-export default ImageImageExample
+export default ImageExampleWrapped
diff --git a/docs/app/Examples/elements/Image/Types/index.js b/docs/app/Examples/elements/Image/Types/index.js
index f675208f5f..f3c086d705 100644
--- a/docs/app/Examples/elements/Image/Types/index.js
+++ b/docs/app/Examples/elements/Image/Types/index.js
@@ -1,15 +1,14 @@
 import React from 'react'
 import ComponentExample from 'docs/app/Components/ComponentDoc/ComponentExample'
 import ExampleSection from 'docs/app/Components/ComponentDoc/ExampleSection'
-
 import { Message } from 'semantic-ui-react'
 
 const ImageTypesExamples = () => (
   <ExampleSection title='Types'>
     <ComponentExample
       title='Image'
-      description='A standard image'
-      examplePath='elements/Image/Types/ImageImageExample'
+      description='A standard image.'
+      examplePath='elements/Image/Types/ImageExampleImage'
     >
       <Message>
         Unless a size is specified,
@@ -17,16 +16,16 @@ const ImageTypesExamples = () => (
       </Message>
     </ComponentExample>
     <ComponentExample
-      description='An image can render wrapped in a div.ui.image as alternative HTML markup'
-      examplePath='elements/Image/Types/ImageWrappedExample'
+      description='An image can render wrapped in a div.ui.image as alternative HTML markup.'
+      examplePath='elements/Image/Types/ImageExampleWrapped'
     />
     <ComponentExample
       title='Link'
-      description='An image can be formatted to link to other content'
-      examplePath='elements/Image/Types/ImageHrefExample'
+      description='An image can be formatted to link to other content.'
+      examplePath='elements/Image/Types/ImageExampleHref'
     >
       <Message info>
-        An Image automatically renders as a <code>{'<a />'}</code> if it has an <code>href</code>
+        An Image automatically renders as a <code>{'<a />'}</code> if it has an <code>href</code>.
       </Message>
     </ComponentExample>
   </ExampleSection>
diff --git a/docs/app/Examples/elements/Image/Variations/ImageAvatarExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleAvatar.js
similarity index 75%
rename from docs/app/Examples/elements/Image/Variations/ImageAvatarExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleAvatar.js
index d1d5ed5c9c..1d9dcb6441 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageAvatarExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleAvatar.js
@@ -3,11 +3,11 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/square-image.png'
 
-const ImageAvatarExample = () => (
+const ImageExampleAvatar = () => (
   <div>
     <Image src={src} avatar />
     <span>Username</span>
   </div>
 )
 
-export default ImageAvatarExample
+export default ImageExampleAvatar
diff --git a/docs/app/Examples/elements/Image/Variations/ImageBorderedExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleBordered.js
similarity index 72%
rename from docs/app/Examples/elements/Image/Variations/ImageBorderedExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleBordered.js
index 84c682265e..b6c479ce52 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageBorderedExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleBordered.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/white-image.png'
 
-const ImageBorderedExample = () => (
+const ImageExampleBordered = () => (
   <Image src={src} size='medium' bordered />
 )
 
-export default ImageBorderedExample
+export default ImageExampleBordered
diff --git a/docs/app/Examples/elements/Image/Variations/ImageCenteredExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleCentered.js
similarity index 94%
rename from docs/app/Examples/elements/Image/Variations/ImageCenteredExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleCentered.js
index 23997db102..dfa0dee363 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageCenteredExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleCentered.js
@@ -4,7 +4,7 @@ import { Segment, Image } from 'semantic-ui-react'
 const src1 = 'http://semantic-ui.com/images/wireframe/image.png'
 const src2 = 'http://semantic-ui.com/images/wireframe/image-text.png'
 
-const ImageCenteredExample = () => (
+const ImageExampleCentered = () => (
   <Segment>
     <Image src={src1} size='medium' centered />
     <p>
@@ -26,4 +26,4 @@ const ImageCenteredExample = () => (
   </Segment>
 )
 
-export default ImageCenteredExample
+export default ImageExampleCentered
diff --git a/docs/app/Examples/elements/Image/Variations/ImageCircularExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleCircular.js
similarity index 72%
rename from docs/app/Examples/elements/Image/Variations/ImageCircularExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleCircular.js
index bbb811068f..ef916bf0ce 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageCircularExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleCircular.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/square-image.png'
 
-const ImageCircularExample = () => (
+const ImageExampleCircular = () => (
   <Image src={src} size='medium' shape='circular' />
 )
 
-export default ImageCircularExample
+export default ImageExampleCircular
diff --git a/docs/app/Examples/elements/Image/Variations/ImageFloatedExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleFloated.js
similarity index 94%
rename from docs/app/Examples/elements/Image/Variations/ImageFloatedExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleFloated.js
index f8f0740b11..3935f43e27 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageFloatedExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleFloated.js
@@ -3,7 +3,7 @@ import { Segment, Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image-text.png'
 
-const ImageFloatedExample = () => (
+const ImageExampleFloated = () => (
   <Segment>
     <Image src={src} size='small' floated='left' />
     <p>
@@ -25,4 +25,4 @@ const ImageFloatedExample = () => (
   </Segment>
 )
 
-export default ImageFloatedExample
+export default ImageExampleFloated
diff --git a/docs/app/Examples/elements/Image/Variations/ImageFluidExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleFluid.js
similarity index 71%
rename from docs/app/Examples/elements/Image/Variations/ImageFluidExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleFluid.js
index ee70774de5..31470aeeec 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageFluidExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleFluid.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageFluidExample = () => (
+const ImageExampleFluid = () => (
   <Image src={src} fluid />
 )
 
-export default ImageFluidExample
+export default ImageExampleFluid
diff --git a/docs/app/Examples/elements/Image/Variations/ImageRoundedExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleRounded.js
similarity index 73%
rename from docs/app/Examples/elements/Image/Variations/ImageRoundedExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleRounded.js
index dea08eec1e..eb80cf178a 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageRoundedExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleRounded.js
@@ -3,8 +3,8 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/square-image.png'
 
-const ImageRoudedExample = () => (
+const ImageExampleRounded = () => (
   <Image src={src} size='medium' shape='rounded' />
 )
 
-export default ImageRoudedExample
+export default ImageExampleRounded
diff --git a/docs/app/Examples/elements/Image/Variations/ImageSizeExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleSize.js
similarity index 88%
rename from docs/app/Examples/elements/Image/Variations/ImageSizeExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleSize.js
index a3882f1c4e..90c7bffc77 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageSizeExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleSize.js
@@ -3,7 +3,7 @@ import { Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageSizeExample = () => (
+const ImageExampleSize = () => (
   <div>
     <Image src={src} size='mini' />
     <br />
@@ -23,4 +23,4 @@ const ImageSizeExample = () => (
   </div>
 )
 
-export default ImageSizeExample
+export default ImageExampleSize
diff --git a/docs/app/Examples/elements/Image/Variations/ImageSpacedExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleSpaced.js
similarity index 95%
rename from docs/app/Examples/elements/Image/Variations/ImageSpacedExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleSpaced.js
index d7b5c597c8..9f346a41c1 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageSpacedExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleSpaced.js
@@ -3,7 +3,7 @@ import { Segment, Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageSpacedExample = () => (
+const ImageExampleSpaced = () => (
   <div>
     <Segment>
       <p>
@@ -27,4 +27,4 @@ const ImageSpacedExample = () => (
   </div>
 )
 
-export default ImageSpacedExample
+export default ImageExampleSpaced
diff --git a/docs/app/Examples/elements/Image/Variations/ImageVerticallyAlignedExample.js b/docs/app/Examples/elements/Image/Variations/ImageExampleVerticallyAligned.js
similarity index 83%
rename from docs/app/Examples/elements/Image/Variations/ImageVerticallyAlignedExample.js
rename to docs/app/Examples/elements/Image/Variations/ImageExampleVerticallyAligned.js
index 223be3e293..4b106960a3 100644
--- a/docs/app/Examples/elements/Image/Variations/ImageVerticallyAlignedExample.js
+++ b/docs/app/Examples/elements/Image/Variations/ImageExampleVerticallyAligned.js
@@ -3,7 +3,7 @@ import { Divider, Image } from 'semantic-ui-react'
 
 const src = 'http://semantic-ui.com/images/wireframe/image.png'
 
-const ImageVerticallyAlignedExample = () => (
+const ImageExampleVerticallyAligned = () => (
   <div>
     <Image src={src} size='tiny' verticalAlign='top' /> <span>Top Aligned</span>
 
@@ -17,4 +17,4 @@ const ImageVerticallyAlignedExample = () => (
   </div>
 )
 
-export default ImageVerticallyAlignedExample
+export default ImageExampleVerticallyAligned
diff --git a/docs/app/Examples/elements/Image/Variations/index.js b/docs/app/Examples/elements/Image/Variations/index.js
index 612e56e762..27a6984c95 100644
--- a/docs/app/Examples/elements/Image/Variations/index.js
+++ b/docs/app/Examples/elements/Image/Variations/index.js
@@ -7,53 +7,53 @@ const ImageVariationsExamples = () => (
   <ExampleSection title='Variations'>
     <ComponentExample
       title='Avatar'
-      description='An image can appear as an Avatar'
-      examplePath='elements/Image/Variations/ImageAvatarExample'
+      description='An image can appear as an Avatar.'
+      examplePath='elements/Image/Variations/ImageExampleAvatar'
     />
     <ComponentExample
       title='Bordered'
-      description='An image can be bordered'
-      examplePath='elements/Image/Variations/ImageBorderedExample'
+      description='An image can be bordered.'
+      examplePath='elements/Image/Variations/ImageExampleBordered'
     />
     <ComponentExample
       title='Fluid'
-      description='A fluid image has no maximum width'
-      examplePath='elements/Image/Variations/ImageFluidExample'
+      description='A fluid image has no maximum width.'
+      examplePath='elements/Image/Variations/ImageExampleFluid'
     />
     <ComponentExample
       title='Shapes'
-      description='An image can have different shapes'
-      examplePath='elements/Image/Variations/ImageRoundedExample'
+      description='An image can have different shapes.'
+      examplePath='elements/Image/Variations/ImageExampleRounded'
     />
-    <ComponentExample examplePath='elements/Image/Variations/ImageCircularExample'>
+    <ComponentExample examplePath='elements/Image/Variations/ImageExampleCircular'>
       <Message warning>
         Perfectly circular images require a perfectly square image file.
       </Message>
     </ComponentExample>
     <ComponentExample
       title='Vertically Aligned'
-      description='An image can specify its vertical alignment'
-      examplePath='elements/Image/Variations/ImageVerticallyAlignedExample'
+      description='An image can specify its vertical alignment.'
+      examplePath='elements/Image/Variations/ImageExampleVerticallyAligned'
     />
     <ComponentExample
       title='Centered'
-      description='An image can be centrally aligned'
-      examplePath='elements/Image/Variations/ImageCenteredExample'
+      description='An image can be centrally aligned.'
+      examplePath='elements/Image/Variations/ImageExampleCentered'
     />
     <ComponentExample
       title='Spaced'
-      description='An image can specify that it needs an additional spacing to separate it from nearby content'
-      examplePath='elements/Image/Variations/ImageSpacedExample'
+      description='An image can specify that it needs an additional spacing to separate it from nearby content.'
+      examplePath='elements/Image/Variations/ImageExampleSpaced'
     />
     <ComponentExample
       title='Floated'
       description='An image can appear to the left or right of other content.'
-      examplePath='elements/Image/Variations/ImageFloatedExample'
+      examplePath='elements/Image/Variations/ImageExampleFloated'
     />
     <ComponentExample
       title='Size'
-      description='An image may appear at different sizes'
-      examplePath='elements/Image/Variations/ImageSizeExample'
+      description='An image may appear at different sizes.'
+      examplePath='elements/Image/Variations/ImageExampleSize'
     />
   </ExampleSection>
 )