Strona Główna » Porady » HTML umieszczanie gifów na stronie/blogu

HTML umieszczanie gifów na stronie/blogu

HTML umieszczanie gifów na stronie/blogu
5 (100%) 7 oceny

Wiele osób wysyła mi pytania odnośnie umieszczania animowanej grafiki w postaci gifów na swojej stronie internetowej bądź blogu. Do umieszczenia animowanego obrazka w swoim serwisie będzie potrzebny bezpośredni dostęp do plików strony www. Jeżeli strona posiada jakiś system CMS ( system zarządzania treścią ) to wystarczy przełączyć edytor w tryb HTML i rozpocząć wyszukiwanie obrazka animowanego, który chcemy zamieścić.

Jak umieścić gifa na mojej stronie ?

Z tym pytaniem zmaga się wiele osób. Załóżmy, że wybraliśmy już gifa, który nas interesuje i chcemy żeby to on był umieszczony na naszej stronie bądź też blogu. Aby obrazek się wyświetlał musimy kliknąć na niego prawym przyciskiem myszki i wybrać opcję KOPIUJ ADRES OBRAZKA. Link do naszego obrazka jest teraz przechowywany w schowku systemowym. Powinien on posiadać rozszerzenie .gif jeżeli jest gifem, jesli natomiast jest zwykłym obrazkiem będzie on miał rozszerzenie .jpg, .png, .jpeg itd.

Pobrałam przykładowy adres gifa –> http://gifyagusi.pl/wp-content/uploads/2014/01/fred.gif

Żeby mógł on się wyświetlać musimy go umieścić w specjalnym kodzie HTML. Kod wygląda następująco :

<img src="adres_obrazka.gif" alt="Opis obrazka" height="100" width="100">

Kod składa się z czterech elementów:

  • src=”” – adres obrazka
  • alt=”” – opis obrazka (dobrze opisywać obrazki ze względu na SEO)
  • height=”” – wysokość obrazka
  • width=”” – szerokość obrazka

Jeżeli usuniemy w naszym kodzie parametry height oraz width nasz obrazek automatycznie przyjmie rozmiary obrazka z parametru src. Wiedząc już co nieco o kodzie HTML do umieszczenia obrazka możemy przystąpić do stworzenia kodu z naszą grafiką.

<img src="http://gifyagusi.pl/wp-content/uploads/2014/01/fred.gif" alt="Fred Flinston" height="223" width="96" />

Powyższy kod generuje taki obrazek.

Fred Flinston

Mam nadzieję, ze chodź trochę udało mi się rozjaśnić budowę kodu HTML do umieszczenia obrazka animowanego albo gifa na Waszych stronkach lub blogach.

O mnie Agnieszka Kwiatowa

Drogi czytelniku gifyagusi.pl, sprawdź moje pozostałe wpisy i artykuły na tej stronie. Dołącz do czytelników najważniejszych informacji już teraz. Obserwuj moje najnowsze wpisy na stronie poprzez portale społecznościowe. Podziel się interesującym wpisem ze swoimi znajomymi już teraz. Oprócz pięknych animowanych gifów umieszczam tutaj także poradniki i publikacje, które z pewnością Cię zaciekawią.
Zapraszam Cię do przeczytania moich innych artykułów na tej stronie, znajdziesz tutaj recenzje, porady, śmieszne filmiki, gify oraz wiele innych. Sprawdź moje kategorie lub skorzystaj z wyszukiwarki w serwisie.

Zostaw odpowiedź

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

*