Зміст

• Крок
• Спосіб 1 з 1: Вставка зображень за допомогою HTML
• Поради
• Попередження

Додавання зображень на ваш веб-сайт або в профіль соціальної мережі - чудовий спосіб одягнути вашу веб-сторінку. HTML (мова розмітки HyperText) має безліч функцій для створення веб-сторінок, але, на щастя, код, який потрібно додати зображення, не надто складний.

Крок

Спосіб 1 з 1: Вставка зображень за допомогою HTML

1. Завантажте своє зображення на безкоштовний веб-сайт хостингу, наприклад Photobucket або TinyPic, який дозволяє гаряче посилання. Гарячі посилання дозволяють пряме посилання зображення на сервер веб-сайту; деякі провайдери заборонили це, оскільки гарячі посилання використовують їх пропускну здатність і займають місце на своїх серверах.
   • Якщо у вас є платний обліковий запис хостингу, завантажте зображення безпосередньо на сервер, де розміщений ваш веб-сайт. Це завжди надійніше, ніж безкоштовний сайт, і зовсім не обов’язково має бути дорогим.
2. Відкрийте новий документ у текстовому редакторі (наприклад,, Блокнот / Блокнот) або відкрийте сторінку на своєму веб-сайті / в профілі, де ви можете безпосередньо змінити HTML-код.
3. Почніть з img тег. img тег порожній, тобто закриваючий тег не потрібен. Однак для перевірки XHTML ви все ще можете поставити пробіл і скісну риску перед ним більше ніж знак.
   • img />
4. Доступних атрибутів багато, але необхідний лише один:src. Це місцезнаходження / адреса або також URL-адреса вашого зображення.
   • img src = "URL-адреса зображення" />
5. Далі ти повинен висота додати атрибут. Тут відображається альтернативний текст на випадок, якщо зображення не завантажується. Це також послуга для людей із вадами зору, яка використовує зчитувачі з екрана.
   • Якщо навести курсор на зображення, цей текст також відображатиметься як підказка, але це лише в Internet Explorer. Рішення, яке працює з усіма браузерами (Firefox та ін.) до нього заголовок атрибут для використання на додаток до висота. (Останній можна опустити, якщо ви не хочете, щоб зображення мало підказку.)

Як приклад:img src = "URL-адреса зображення" alt = "Про всяк випадок" title = "Підказка" />

1. Тепер ви можете вказати розмір зображення за допомогою висота і ширина атрибута, а також вказавши пікселі або відсоток. Зверніть увагу, що зміна розміру таким чином змінює лише розмір вигляду, а не розмір самого зображення. Щоб скоротити час завантаження зображення, краще, особливо для великих зображень, заздалегідь зменшити їх за допомогою програмного забезпечення для редагування фотографій або за допомогою онлайн-сервісу, такого як PicResize.com.
   • img src = "URL-адреса зображення" alt = "Про всяк випадок" title = "Підказка" height = "50%" width = "50%" />
   • img src = "URL-адреса зображення" alt = "Про всяк випадок" title = "Підказка" height = "25px" width = "50px" />

Поради

• Значення цих атрибутів подано або в пікселях, або у відсотках, від 1-100%.
• Зображення можна розмістити в будь-якому місці веб-сторінки, використовуючи різні атрибути форматування, такі як верхній, нижній, середній, правий, лівий тощо.
• Атрибут hspace використовується для вставки горизонтального простору ліворуч і праворуч від зображення, тоді як атрибут vspace використовується для звільнення місця у верхній і нижній частині зображень та інших об'єктів.
• Не захоплюйтеся занадто багато зображеннями. Це виглядає безладно і непрофесійно.
• Зображення у форматі GIF чудово підходять для логотипів або мультфільмів, але цей тип файлу менш підходить для фотографій та інших зображень із багатьма кольорами.
  • Зображення у форматі GIF підтримують лише 8-бітові кольори з максимум 256 кольорами для зображення. Тому слід очікувати, що відтворення 16- або 24-бітової кольорової ілюстрації чи фотографії буде не таким хорошим.
  • Зображення GIF також підтримують прозорість. Можливий один біт прозорості, що означає, що один колір можна зробити прозорим.
  • Переплетіння також підтримується зображеннями GIF, що означає, що відвідувач сайту отримає уявлення про те, як виглядатиме зображення до повного завантаження.
  • Формат GIF також підтримує анімацію.
• Переконайтесь, що в URL-адресі вказано формат файлу зображення (.webp .gif тощо).

Попередження

• Не гаряче посилання!