strony link - Kurs HTML i CSS
Nagłówek i treść HTML / Język strony <html lang, link hreflang>...it - włoski, es - hiszpański i inne [zobacz: Skróty nazw jezyków]. Nie należy również zapominać o zadeklarowaniu odpowiedniej dla wybranego języka strony kodowej. Zwracam uwagę, że w dokumencie HTML może się znajdować tylko jeden element <html>. Dlatego powyższy atrybut lang="..." należy przypisać do już istniejącego znacznika, a nie dodawać kolejnego. Inne wersje językowe <link hreflang> <head> <link rel="alternate" hreflang="język" href="adres"> </head> gdzie jako "język" należy podać...
- Nagłówek i treść HTML / Ikona strony <link "shortcut icon">
...się plik ikony - np.: favicon.ico Polecenie to pozwala dodać ikonkę (favicon.ico), która będzie widoczna w przeglądarce przy adresie naszej strony. Typowy rozmiar ikony to 16x16 pikseli. W systemie Windows jest dodatkowa możliwość umieszczenia skrótu na pulpicie - wtedy przydatna może być ikona o rozmiarach 32x32. Format *.ico pozwala zapisać dwie wersje rozmiaru w jednym pliku. Przeglądarki pozwalają również używać innych formatów graficznych, takich jak np. PNG. Możemy również...
- Nagłówek i treść HTML / Autor strony <meta "author", link "author">
...</head> Polecenie to należy wstawić między znacznikami: <head> oraz </head>. Pozwala ono podać informację o fizycznej osobie będącej autorem strony. Strona autora <link "author"> <head> <link rel="author" href="lokalizacja"> </head> gdzie jako lokalizacja należy podać jedną z następujących wartości: ścieżka dostępu do podstrony w obrębie tego samego serwisu adres zewnętrznej strony (rozpoczynający się od http:// lub https://) w innym serwisie - np. jeśli autor publikuje tutaj...
Aktualizacja / System newsów...font-weight: bold; } Wszystkie ważniejsze linijki zostały opisane. Oczywiście powyższe deklaracje można dołączyć do istniejącego arkusza stylów strony. Dalej wykonujemy analogiczną czynność z kodem przedstawionym poniżej, jednak tym razem zapisujemy go w pliku z rozszerzeniem *.js - np. news.js: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj tego komentarza! (Do NOT remove this comment!) */ function News(days) { this.config...
- Widżety HTML / Szablon strony bez ramek
...Na każdej podstronie trzeba będzie wstawić jakieś powtarzające się elementy, jak np. nagłówek, menu nawigacyjne, stopka itd. W każdym pliku podstrony trzeba za każdym razem powtórzyć te elementy. Wyobraź sobie teraz, że chcesz dodać do menu nowy link. Aby to zrobić, musisz otworzyć osobno każdy dokument i ręcznie dodać tam link. Oczywiście jest to ogromnie niewygodne, do tego stopnia, że po jakimś czasie można się wręcz zniechęcić do robienia jakichkolwiek aktualizacji serwisu ...
Wstawianie stylów CSS / Zewnętrzny arkusz stylów <link "stylesheet"> @charset...jest zewnętrznym arkuszem stylów. Natomiast znaki (...) oznaczają inne polecenia, które zwykle pojawiają się w nagłówku dokumentu, np. deklaracja strony kodowej. Możliwość wstawiania zewnętrznego arkusza jest chyba jedną z największych zalet stosowania stylów. Pozwala nam to zdefiniować takie samo formatowanie określonych elementów na wielu stronach jednocześnie. Dzięki temu, za pomocą tego jednego arkusza, wszystkie nasze strony w obrębie całego serwisu mogą mieć pewne wspólne cechy...
- Skórki
...na pierwszy rzut oka operacja zmiany wyglądu wydaje się być dość skomplikowana, tak naprawdę absolutnie nie ma potrzeby budowania drugiej wersji strony dla każdej kolejnej skórki. Z pomocą przychodzą style CSS, które wręcz idealnie do tego się nadają. Do przygotowania nowej skórki wystarczy po prostu zaprojektować osobny arkusz stylów (plik *.css) i go podmienić za pomocą specjalnego skryptu. Aby możliwa była jak najbardziej efektowna zmiana wyglądu, konieczne jest, aby serwis został...
- Dobre praktyki / Przykazania webmastera
...elementów ani atrybutów zdeprecjonowanych Unikaj stosowania ramek - zarówno tradycyjnych jak i lokalnych Nie stosuj tabelek do budowania układu strony Nawigacja musi być intuicyjna i wygodna Unikaj używania atrybutu target="..." dla odsyłaczy Nie używaj znaczników img do wstawiania grafiki tworzącej oprawę graficzną strony Zawsze wypełniaj atrybut alt="..." dla ilustracji Zapisuj ilustracje we właściwych formatach graficznych Stosuj fizycznie pomniejszone miniatury zdjęć Strona...
- Nagłówek i treść HTML / Nawigacja <link "prev, next, help, search">
...Pomoc <link "help"> Szukaj <link "search"> Wstęp (interpretuje: Opera 12-) Niektóre przeglądarki pozwalają określić bezpośrednio z poziomu strony WWW dodatkowe punkty nawigacyjne w serwisie. Mogą one być wyświetlane na specjalnym pasku narzędzi (najczęściej Nawigacja) w postaci linków do wskazanych stron. Część z tego typu punktów nawigacyjnych może być również wykorzystywana przez roboty wyszukiwarek internetowych (np. Google). We wszystkich przypadkach poniżej odpowiednie wpisy...
- Nagłówek i treść HTML / Dokumenty prawne <link "license, privacy-policy, terms-of-service">
...z licencją opisującą warunki korzystania z materiałów znajdujących się na stronie. Licencja na zdjęcia Może się zdarzyć, że niektóre elementy strony, jak np. zdjęcia wstawione w dokumencie, mogą być chronione odrębnymi licencjami. W takiej sytuacji przy każdym takim elemencie powinniśmy osobno wskazać właściciela praw autorskich i licencję. Na przykład: <figure> <img src="zdjecie.jpg" alt="Tatry"> <figcaption>Tatry<br><small>© Jan Kowalski (<a rel="license...