Изображения

Изображенията - картинки, фотографии и др., анимирани или статични - са важна част от почти всеки сайт в мрежата.

Добре подбрани и разположени, те могат да "освежат" HTML-страницата ви, но претрупването на една страница с изображения може да постигне и обратния ефект, като я направи непривлекателна. 

Формати на файловете за изображения:

  • gif формат , който се използва предимно за картинки, илюстрации и надписи, които не са оцветени в богата цветова гама и не съдържат "сложни" оттенъци и светлосенки. Файловете с разширение gif имат две важни предимства пред другия основен формат: могат да съдържат "прозрачен" елемент в себе си - това например може да е фона на буквите от някакъв надпис, който ще прозира и под него ще се вижда фона на страницата. Тогава този файл ще "пасва" на страници с различно оцветен фон. Могат да бъде анимирани - да съдържат движеща се картинка.
  • jpeg или jpg формат (и двете разширения са валидни и равностойни), който се използва предимно за висококачествени фотографии. Възможностите на този формат за показване на цветове и оттенъци са по-богати от тези на gif формата, но за сметка на това jpg файла не може да бъде анимиран, нито да съдържа прозрачни елементи.

Търсене и сваляне на изображения от WEB

Безплатни изображения може да намерите като търсите по ключови думи, например free images, free animated gifs, free pictures, free graphics, free clip art, free buttons, free backgrounds, free interfaces и т.н.

Записване на изображение с командата "Save Picture As".

Преди да вземете някое изображение и да го използвате в страницата си е нужно да се уверите, че то не е обект на авторското право и че е безплатно!!!

Показване на изображения в HTML -документа

  • Използва се тага <img src=" myimage.gif " /> 

  • По подразбиране изображението се появява в лявата част на страницата.

  • Ако желаем да разположим изоброжението вдясно или в средата на страницата трябва да използваме тага <div> и атрибута му align със съответните стойности - left (което е и по подразбиране), right и center.
    • Например
      <div align="center"> 
      <img src="Example.gif" /> 
      </div>

Атрибути на тага за изображение:

  • Атрибутите width и height задават съответно ширина и височина на изображението в пиксели.

  • Атрибута alt задава алтернативно название на изображението (текст, който се показва, в случай, че браузъра не може да зареди изображението).

    <img src="Example.gif" width="163" height="73" alt="Моята картинка " />

  • Атрибута align – подравняване на изображението спрямо текста
    <img src="Example.gif" width="163" height="73" align=“ top/bottom/middle и др." />

  • Атрибута hspace задава свободно пространство отляво и отдясно на изображението, а атрибута vspace - отгоре и отдолу. Стойностите са в пиксели.