podstrony - Kurs HTML i CSS
- Widżety HTML / Ramki HTML
...wstawimy to samo menu nawigacyjne na każdej podstronie, możemy mieć w przyszłości sporo pracy, gdy do naszej witryny będziemy chcieli dodać nowe podstrony. Wtedy trzeba będzie mozolnie zmieniać menu w każdym istniejącym dotąd dokumencie, w celu dodania do niego odsyłacza do nowej podstrony. Aby wyeliminować tę niedogodność, a jednocześnie nie utrudniać naszym użytkownikom nawigacji w serwisie, możemy stworzyć jeden wspólny widżet zawierający odnośniki menu, a następnie osadzić go na każdej...
- AutoIFRAME / Dlaczego to nie działa?
...autoiframe.js? Czy odwołanie aby nie zostało wstawione w miejscu innym niż nagłówek dokumentu (<head>...</head>)? Czy w tym samym katalogu co podstrony znajduje się plik autoiframe.js z zawartością skryptu? Czy plik nie został nazwany przypadkiem Autoiframe.JS (wielkość liter ma znaczenie!) itp.? Czy zawartość wszystkich skryptów została skopiowana w trybie prostym? Niektóre edytory razem z kopiowanym kodem wklejają formatowanie tekstu. Aby temu zapobiec, wklej najpierw kod do programu...
- Promocja strony WWW / Pozycjonowanie (SEO)
...najpierw ukazuje się przyjazny tytuł serwisu, a dopiero potem wyrażenia kluczowe, które niekoniecznie muszą go interesować. Natomiast jeśli chodzi o podstrony, coraz częściej spotyka się kolejność odwrotną, tzn.: Tytuł artykułu - Nazwa serwisu lub Tytuł artykułu - Tytuł działu - Nazwa serwisu Odwrócona kolejność w tytułach poza stroną główną jest korzystna, ponieważ tytuł artykułu zwykle lepiej opisuje zawartość danej podstrony niż nazwa serwisu, a słowa kluczowe umieszczone na początku...
- HTML dla zielonych / Wstawienie obrazka HTML <img src alt>
...wielu działów w serwisie oraz dużej ilości plików. Wtedy w katalogu głównym znajduje się zazwyczaj jedynie strona główna index.html, a wszystkie podstrony oraz pliki są umieszczone w katalogach podrzędnych. Poprawnie: ../../katalog2/katalog2a/plik.gif Niepoprawnie: C:\www\katalog2\katalog2a\plik.gif, katalog2/katalog2a/plik.gif, ../katalog2/katalog2a/plik.gif Ten przykład jest już dość zaawansowany. Jeśli go zrozumiesz, możesz powiedzieć, że ścieżki dostępu "masz w małym palcu" 🙂...
- HTML dla zielonych / Odsyłacz do adresu internetowego HTML <a "http, https">
...jest następująca: <a href="adres internetowy">opis odsyłacza</a> Zasady wpisywania "opisu odsyłacza" są takie same jak w przypadku odsyłacza do podstrony. Natomiast jako: "adres internetowy" należy wpisać adres miejsca w Internecie, gdzie chcemy się przenieść (np.: http://www.onet.pl). Adres strony internetowej zawsze musi rozpoczynać się od http:// lub https:// Odsyłacz taki jest przydatny, jeśli chcemy umieścić w swoim serwisie tzw. linki do dowolnych stron w obrębie całego Internetu...
- Aktualizacja / System newsów
...w tym samym skrypcie): Data, tytuł, treść: news(dzień,miesiąc,rok, 'Tytuł','Treść newsa...'); Data, tytuł, treść, adres "Więcej..." (lokalizacja podstrony albo adres internetowy): news(dzień,miesiąc,rok, 'Tytuł','Treść newsa...', 'adres'); Data, tytuł, treść, adres "Więcej...", nazwa ramki (lub '_blank' jeśli chcemy wczytać stronę w nowym oknie): news(dzień,miesiąc,rok, 'Tytuł','Treść newsa...', 'adres','ramka'); Data, tytuł, treść, adres "Więcej...", nazwa ramki, autor...
- Przeglądarka zdjęć
...zdjęć Inicjalizacja Wymagana wiedza Konstruowanie ścieżek dostępu do obrazków Podstawy stylów CSS (m.in. arkusze stylów) Odsyłacze do podstrony Przykład przeglądarki zdjęć Skrypt przeglądarki zdjęć Aby uzyskać powyższy efekt, należy zapisać przedstawiony poniżej kod w dowolnym pliku z rozszerzeniem *.js - np. przegladarka_zdjec.js: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj tego komentarza! (Do NOT remove this comment!)...
- Nagłówek i treść HTML / Autor strony <meta "author", 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 gościnnie, ale prowadzi również własny serwis adres e-mail (rozpoczynający się od mailto:), którym posługuje się autor strony W odróżnieniu od znacznika <meta author> element ten...
- Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki
Spis treści Wymagana wiedza Skrypt indeksu, wyszukiwarki Wieloznacznik (wildcard) Wymagana wiedza Odsyłacze do podstrony Wczytywanie stron do ramki lokalnej Podstawy stylów CSS (m.in. arkusze stylów) Skrypt indeksu, wyszukiwarki Aby wstawić na swoją stronę indeks z dodatkową funkcją wyszukiwarki, postępują według poniższych instrukcji: Utwórz w swoim edytorze HTML nowy dokument. Wklej do niego poniższy kod i zapisz w pliku indeks.js (koniecznie użyj kodowania utf-8)...
- Szablon strony na DIV-ach / Responsywny szablon
...sposób tworzenia serwisów przeznaczonych dla urządzeń mobilnych. Koncepcja pozornie jest bardzo prosta: przygotowujemy drugą wersję każdej podstrony w naszym serwisie, która będzie lepiej przystosowana do urządzeń mobilnych. Do najczęstszych tego typu zabiegów można zaliczyć: Usunięcie elementów strony, które mogą być mało przydatne użytkownikom mobilnym Przesunięcie kolumny menu na początek lub koniec treści bądź umieszczenie jej w otwieranym menu Dopasowanie rozmiaru czcionki...