title: Icon link without text eslint error
body: <p>I have a React project that shows a bunch of social media links that are just icons to their respective sites.  I use icomoon fonts and whatnot to provide the icon-* classes to show the social media icons.</p>
  
  <p>The error I get, understandably, is:</p>
  
  <p><code>Anchors must have content and the content must be accessible by a screen reader</code></p>
  
  <p>What should I do in this scenario where I don't want anything but the icon and no text?  I'm not sure how to properly do this so everyone's happy.</p>
  
  <p><em>Edit</em></p>
  
  <p>I didn't think code was necessary since it doesn't pertain to anything really.</p>
  
  <p>Here's the mapping that spits out the links.  As you can see, no text.  Just font-icons for whatever social media site is being linked to:</p>
  
  <pre><code>{this.props.siteInfo.social.map(function(item, i){
      return &lt;a key={i} className={`nav_item icon-${item.social_media_type}-square`} href={item.url} target="_blank" rel="noopener noreferrer"&gt;&lt;/a&gt;
  })}
  </code></pre>
  
  <p>Which results in:</p>
  
  <p><code>&lt;a key="0" class="nav_item icon-facebook-square" href="facebook.com/someprofile" target="_blank" rel="noopener noreferrer"&gt;&lt;/a&gt;</code></p>