This is a great example of bad markup. Each header should be simple text with CSS font styling for shadows and CSS background images based on media queries. All semanticity is lost in IBMs way of writing markup.

bad-markup-semanticity

<!-- LEADSPACE_BEGIN -->
<div class="ibm-container" id="ibm-leadspace-head">
  <div class="ibm-container-body" id="ibm-leadspace-body">
    <div class="ibm-columns ibm-alternate" id="ibm-lead-1">
      <div class="ibm-col-1-1">
        <h1>
          <a href="http://www.ibm.com/mobilefirstforios?lnk=ushpls1">
            <img alt="IBM and Apple partnership" height="297" width="578" src="/images/portal/R745639D06637H07/4_07152014_text.png" class="ibm-no-mobile"/>
            <img class="ibm-mobile" alt="IBM and Apple partnership" height="98" width="318" src="/images/portal/R745639D06637H07/4_07152014_mobile.png"/>
          </a>
        </h1>
        <p class="ibm-access"><em>Transform the way work is done</em></p>
      </div>
    </div>
    <div class="ibm-columns ibm-alternate" id="ibm-lead-2">
      <div class="ibm-col-1-1">
        <h2>
          <a href="http://www.ibm.com/services/us/gbs/thoughtleadership/2014analytics/?lnk=ushpls2">
            <img alt="30 questions. 15 minutes. Big payoff." height="297" width="578" src="/images/portal/I033638H22526I12/07142014hp_ibv_survey_text.png" class="ibm-no-mobile"/>
            <img class="ibm-mobile" alt="30 questions. 15 minutes. Big payoff." height="98" width="318" src="/images/portal/I033638H22526I12/07142014hp_ibv_survey_mobile.png"/>
          </a>
        </h2>
        <p class="ibm-access"><em>Take the Analytics Survey, get the results early. Learn more.</em></p>
      </div>
    </div>
    <div class="ibm-columns" id="ibm-lead-3">
      <div class="ibm-col-1-1">
        <h2>
          <a href="http://www.ibm.com/ibm/ideasfromibm/us/ibm_fellows/2014/saska_mojsilovic.html?lnk=ushpls3#content">
            <img alt="A predilection for prediction" height="297" width="578" src="/images/portal/H611323X94048P04/07142014_fellow_saska_mojsilovic_text.png" class="ibm-no-mobile"/>
            <img class="ibm-mobile" alt="A predilection for prediction" height="98" width="318" src="/images/portal/H611323X94048P04/07142014_fellow_saska_mojsilovic_csm.png"/>
          </a>
        </h2>
        <p class="ibm-access"><em>Meet Saska Mojsilovic: analytics pioneer and new IBM Fellow</em></p>
      </div>
    </div>
  </div>
</div>
<!-- LEADSPACE_END -->

Should look more like this…

<h1>
  <a>Apple and IBM announce a landmark partnership to transform the way work is done.</a>
</h1>

This achieves semanticity and enables intelligent consumption of data by machines (search engines, WAI-ARIA, APIs,…)

h1 {
  text-shadow: 2px 2px white;
  background: url('path/to/image.png') center center no-repeat;
}