1

Google またはGMetrixで速度テストを実行すると、画像サイズが指定されていないため、より多くの HTTP リクエストが必要になるため、常に F が返されます。しかし、私のasp.net（vb）Webサイトでは、指定されたリンクはリンクボタンであり、CssClass を使用すると次のようになります。

<asp:Image ID="Image9" runat="server" ImageUrl="~/images/flagpt.png" 
CssClass="flagbutton" tooltip="Veja este site em português" 
title="Veja este site em português"/>

これにより、(CssClass を使用して) このhtml 出力が生成されますが、まだ img ディメンションはありません。

<img id="Image9" title="Veja este site em português" 
 class="flagbutton" title="Veja este site em português" 
 src="images/flagpt.png" />

ただし、このようにheight="15" width="26"を配置しただけでは、まだ機能しません。

  <asp:Image ID="Image7" runat="server" ImageUrl="~/images/flagde.png" 
  height="15" width="26" tooltip="View this website in Deutsch" 
  title="View this website in Deutsch"/>

これにより、次のhtml 出力が生成されますが、速度テストでは img のサイズが検出されません。

<img id="Image7" title="View this website in Deutsch" 
   title="View this website in Deutsch" 
   src="images/flagde.png" style="height:15px;width:26px;" />

速度テストでは、寸法を指定していないことが示されています。これで私を助けるための提案は大歓迎です!

4

1 に答える 1

0

まず、画像のサイズを指定しなくても、余分な HTTP リクエストが発生することはありません。画像がダウンロードされると、ブラウザーがドキュメントをリフローしなければならなくなる可能性がありますが、それは別の問題です。

次に、画像のサイズを指定しました。それは出力にあります：

style="height:15px;width:26px;"

widthおよび属性も指定するheight必要はありません。

width出力におよび属性を強制的に含めたい場合はheight、カスタム コントロールまたはコントロール アダプターを使用する必要があります。このような何かがうまくいくはずです：

public class ImageDimensionsAdapter : WebControlAdapter
{
   protected override void Render(HtmlTextWriter writer)
   {
      var image = Control as Image;
      if (image != null)
      {
         Unit size = image.Width;
         if (!size.IsEmpty && size.Type == UnitType.Pixel)
         {
            writer.AddAttribute(HtmlTextWriterAttribute.Width, size.Value.ToString("###0"));
         }

         size = image.Height;
         if (!size.IsEmpty && size.Type == UnitType.Pixel)
         {
            writer.AddAttribute(HtmlTextWriterAttribute.Height, size.Value.ToString("###0"));
         }
      }

      base.Render(writer);
   }
}

これを適用するには、以下を含む.browserファイルをディレクトリに追加します。App_Browsers

<browsers>
   <browser refID="Default">
      <controlAdapters>
         <adapter
            controlType="System.Web.UI.WebControls.Image"
            adapterType="ImageDimensionsAdapter"
         />
      </controlAdapters>
   </browser>
</browsers>
于 2012-10-31T18:19:24.797 に答える