Linki i Zdjęcia - HTML
Powoli oswajamy się z podstawowymi znacznikami HTML, dzisiaj przejdziemy do paru ciekawszych, które budowały całe strony internetowe (i po części dalej to robią).
Linki - znacznik A
Możliwość skakania po stronach internetowych towarzyszy nam od bardzo dawna - to dzięki tagowi "A" możemy przechodzić na kolejne strony artykułów (jeśli jest on podzielony), możemy oglądać inne strony dostępne w portalu (np. z kontaktem) czy przeglądać inne strony (jak np. w Google). Ten tag daje nam naprawdę masę możliwości i dlatego warto i wręcz należy go znać.
Najpierw zróbmy adres bezpośredni. Taki adres wskazuje bezpośrednio na jaką stronę chcemy przejść, dla przykładu Google.pl
<a href="https://www.google.pl">Link do Google</a>
Czyli mamy tak. W znaczniku a mamy href, który wskazuje stronę na jaką chcemy przejść. Poza znacznikiem mamy tekst, który przedstawia pod jaką nazwą ma być nasz link ukryty.
Teraz spróbujmy wygenerować link pośredni. Taki link przydaje się by zaoszczędzić troszkę rozmiaru strony - wskazując bezpośrednio jaki plik (lub adres) ma zostać uruchomiony.
<a href="index.php">Link do index.php</a>
Po naciśnięciu na link (na normalnej stronie hehe :D) zostanie załadowany plik, który znajduje się w tym samym katalogu co uruchomiona strona. Za pomocą znaków specjalnych typu ../ czy / możemy przechodzić do pozostałych katalogów. Zaletą takiego stosowania adresów oprócz zaoszczędzenia trochę bajtów jest to, że przenosząc stronę na inną domenę wszystkie linki działają od razu.
IMG - Obrazy
Strony internetowe to nie tylko tekst, ale często obrazy. Do tego stosujemy znacznik img.
https://cdn.pixabay.com/photo/2013/06/23/15/54/london-140785_960_720.jpg
Jak takie zdjęcie umieścić na stronie?
<img src="https://cdn.pixabay.com/photo/2013/06/23/15/54/london-140785_960_720.jpg">
Czyli w znaczniku img w src (źródło) dajemy adres do zdjęcia. Oczywiście jeśli jest to możliwe to zalecam redukować adres. Wiele firm po prostu przechowuje u siebie dane zdjęcie zmniejszając tak nie tylko link, ale także optymalizując zdjęcie i przechowując je, by w razie awarii głównego serwera - mieć je na zapas.
Na razie to tyle
Nie chciałem tworzyć bardzo rozbudowanego tekstu, szczególnie, że tego trzeba się nauczyć ;) Niech każdy przeczyta i przyswoi wiedzę na spokojnie!
Chic article. I learned a lot of new things. I signed up and voted. I will be glad to mutual subscription))))
Haha! Dlaczego nie natrafiłem na ten materiał dwa lata temu gdy dopiero zaczynałem z HTML
No niestety, chociaż HTML to stara rzecz, nawet są graficzne edytory "WYSIWYG" (What you see is what you get)
Może i stara rzecz, ale przydatna. Mnie pomogła zobrazować, na czym polega programowanie (taka analogia i to WIELKA ANALOGIA). No i zachęciło mnie do zainteresowania się innymi językami programowania. Podobało mi się to, ponieważ od razu widziałem efekty tego, co robie, to było dla mnie jak klocki lego ;D
Dobra robota Fervi. Pierwsza lekcja dla mnie jak zostać budowniczym zaliczona. Pozdrawiam.
Dobry początek. Jeszcze 2 dni temu w ten sposób można było wstawiać zdjęcia do wpisów na steemit - korzystając z czystego html. Teraz to działa w wypadku komentarzy:
... ale w przypadku wpisów już nie :(
Portal wymusza hostowanie zdjęć na ich serwerze: steemitimages.com. Co o tym myślisz?