使用圖片和對象的HTML IMG標籤
HTML IMG標籤管理圖片和其他靜態圖形對像在網頁中的插入。 這個通用標籤支持多種強制性和可選屬性，為您設計一個引人注目，以圖像為焦點的網站增添了豐富的內容。
一個完整的HTML IMG標籤的例子如下所示：
必需的IMG標記屬性
SRC。 您需要使圖像顯示在網頁上的唯一屬性是SRC屬性。 該屬性標識要顯示的圖像文件的名稱和位置。
ALT。 要編寫有效的XHTML和HTML4，還需要ALT屬性。 該屬性用於為非可視瀏覽器提供描述圖像的文本。 瀏覽器以不同的方式顯示替代文本。 有些將鼠標放在圖像上時將其顯示為彈出窗口，其他人則在右鍵單擊圖像時將其顯示在屬性中，有些則根本不顯示。
使用替代文本提供有關圖像的其他細節，這些細節與網頁文本不相關或重要。 但請記住，在屏幕閱讀器和其他純文本瀏覽器中，文本將與網頁上的其他文本一起內嵌閱讀。 為了避免混淆，請使用描述性替代文字，例如，“關於網頁設計和HTML”，而不是“徽標”。
在HTML5中，ALT屬性並不總是必需的，因為您可以使用標題向其添加更多描述。 您還可以使用屬性ARIA-DESCRIBEDBY來指示包含完整描述的ID。
如果圖像純粹是裝飾性的，例如網頁頂部的圖形或圖標，則替代文字也不是必需的。 但如果您不確定，請包括替代文字以防萬一。
推薦的IMG屬性
寬度和高度 。 你應該養成總是使用WIDTH和HEIGHT屬性的習慣。 而且您應該始終使用真實尺寸，而不是使用瀏覽器調整圖像大小。
這些屬性加快了頁面的渲染速度，因為瀏覽器可以在設計中為圖像分配空間，然後繼續下載其餘內容，而不是等待整個圖像下載。
其他有用的IMG屬性
TITLE 。 該屬性是一個全局屬性，可以應用於任何HTML元素 。 而且，TITLE屬性允許您添加有關圖像的額外信息。
大多數瀏覽器都支持TITLE屬性，但它們以不同的方式進行。 當用戶右鍵單擊圖像時，有些將文本顯示為彈出式窗口，而其他則將其顯示在信息屏幕中。 您可以使用TITLE屬性來編寫關於圖像的其他信息，但不要指望這些信息是隱藏的或可見的。 你絕對不應該使用它來隱藏搜索引擎的關鍵字。 這種做法現在受到大多數搜索引擎的懲罰。
USEMAP和ISMAP 。 這兩個屬性將客戶端（）和服務器端（ISMAP） 映像映射設置為您的映像。
LONGDESC 。 該屬性支持URL以更長的圖像描述。 此功能使您的圖像更易於訪問。
已棄用和已淘汰的IMG屬性
現在HTML5中已經過時了一些屬性，或者在HTML4中棄用了這些屬性。 為了獲得最好的HTML，您應該找到其他解決方案而不是使用這些屬性。
邊界 。 該屬性定義了圖像周圍任何邊框的寬度（以像素為單位）。 它在HTML4中已被棄用，而在HTML5中已過時。
ALIGN 。 該屬性允許您在文本中放置圖像，並使文本在其周圍流動。 您可以將圖像向右或向左對齊。 它已被棄用，以支持HTML4中的float CSS屬性，並在HTML5中被廢棄。
HSPACE和VSPACE 。 HSPACE VSPACE屬性水平添加空白（HSPACE）和垂直（VSPACE）。 白色空間將被添加到圖形的兩側（頂部和底部或左側和右側），所以如果您只需要一邊空間，就應該使用CSS。 這些屬性在HTML4中已被棄用，以支持CSS屬性，並且它們在HTML5中已過時。
LOWSRC 。 LOWSRC屬性提供了一個替代圖像，當您的圖像源太大而下載速度非常慢時。 例如，你可能有一個500KB的圖像，你想在你的網頁上顯示，但是500KB需要很長時間才能下載。 因此，您可以創建一個小得多的圖像副本，可能是黑白或只是非常優化的，並將其放入LOWSRC屬性中。 較小的圖像將先下載並顯示，然後當較大的圖像出現時，它將取代低源圖像。
LOWSRC屬性被添加到Netscape Navigator 2.0到IMG標籤中。 它是DOM級別1的一部分，但隨後從DOM級別2中刪除。雖然許多網站聲稱它受所有現代瀏覽器支持，但瀏覽器對此屬性的支持一直很粗糙。 它不會在HTML4中被棄用，也不會在HTML5中被廢棄，因為它從來都不是這兩個規範的官方組成部分。
避免使用此屬性，而是優化圖像以便快速加載。 頁面加載的速度是良好網頁設計的關鍵部分，而大型圖像極大地降低了頁面的速度 - 即使您使用LOWSRC屬性。