…Chociaż składnia języka HTML jest stosunkowo prosta do nauczenia,… nadal istnieje wiele elementów, atrybutów i… innych koncepcji, których będziesz musiał się nauczyć i które śledzić.…Chociaż ten kurs ma na celu wprowadzenie podstaw HTML, nie jest on… tak naprawdę zaprojektowany, aby nauczyć Cię każdego dostępnego elementu i atrybutu.… Mając to na uwadze, chcę udostępnić Ci kilka internetowych zasobów HTML… które mogą naprawdę Ci pomóc zaczynasz uczyć się języka HTML i… możesz później służyć jako cenne odniesienia, tworząc własne strony.…Teraz zaczniemy od samych specyfikacji.…
I to jest coś, dwa dokumenty, które zdecydowanie powinniście dodać do zakładek.… A więc to jest wersja HTML5 dla W3C.… Widać, że mają najnowszą wersję dla wydawcy.… Możesz zobaczyć wersję roboczą redaktora… jeśli chcesz zobacz, co leci w dół, rurą.…I to jest dość duże.…Jeśli przewinę w dół, możesz zobacz, to tylko spis treści.…I nawet nie będę ich wszystkich przewijać.…
Wznów automatyczne przewijanie transkrypcji
HTML to język programowania, który daje władzę sieć. I jak w przypadku każdego języka, gdy go opanujesz, możesz zacząć tworzyć własne treści, niezależnie od tego, czy będą to proste strony internetowe, czy złożone aplikacje internetowe. Ten kurs zapewnia dogłębne spojrzenie na najważniejsze kwestie: składnię HTML i najlepsze praktyki dotyczące pisanie i edytowanie kodu, starszy autor James Williamson, przegląda strukturę typowego dokumentu HTML i pokazuje, jak dzielić strony i formatować treść za pomocą HTML Plus, uczy się, jak tworzyć łącza i listy oraz dowiaduje się, jak działa HTML. CSS i JavaScript, aby tworzyć bogate, wciągające doświadczenia użytkownika. Otwórz więc edytor tekstu, obejrzyj te filmy i zacznij uczyć się tworzyć kod HTML we właściwy sposób.
Tematy obejmują:
Doktorat Lavlinsky N. E., dyrektor techniczny Method Lab LLC
Niedawno opublikowane nowy standard do technologii Preload (link). Głównym celem tej specyfikacji było umożliwienie programiście dostrojenia logiki ładowania zasobów strony.
Pomysł zarządzania obciążeniem nie jest nowy. Opracowano wcześniej kilka opcji tagów połączyć z atrybutami podzasób, wstępne renderowanie I pobierz z wyprzedzeniem. Działały jednak nieco inaczej: za ich pomocą można załadować elementy strony lub całe strony, które mogą być potrzebne do dalszej nawigacji po serwisie. Oznacza to, że przeglądarka wysyłała takie żądania z niskim priorytetem i jako ostatnie. Jeśli konieczne jest zwiększenie priorytetu, nie było rozwiązań.
Co zapewnia nowa specyfikacja? Po pierwsze, ładowanie odbywa się teraz z wyjaśnieniem, co jest ładowane. Na podstawie określony typ zasób, przeglądarka ustawia priorytet ładowania. Na przykład:
link rel = "wstępne ładowanie" href = "/js/script.js" as = "skrypt" >Po drugie, typ zasobu ( Jak) umożliwia przeglądarce wysyłanie prawidłowych nagłówków, za pomocą których serwer może wysyłać treść najlepsza opcja kompresja (na przykład wysyłanie obrazów WebP, jeśli przeglądarka je obsługuje).
W drugim przykładzie ładujemy plik czcionki i określony jest konkretny format (WOFF2), który nie jest obsługiwany przez wszystkie przeglądarki. Jednak dopóki obsługa mechanizmu wstępnego ładowania jest zgodna z obsługą tego formatu, nie ma żadnych problemów. Można zobaczyć aktualne wsparcie dla mechanizmu.
Przykładem przyspieszenia witryny internetowej za pomocą wstępnego ładowania jest ładowanie głęboko ukrytych zasobów, takich jak czcionki. W normalnym procesie pobierania przeglądarka musi najpierw pobrać plik CSS wskazujący czcionkę, przeanalizować plik, a następnie umieścić w kolejce żądanie pobrania pliku czcionki.
Jeśli w kodzie strony HTML określimy wstępne ładowanie tej czcionki, przeglądarka wyśle żądanie natychmiast po przeanalizowaniu dokumentu HTML, co może nastąpić kilka sekund wcześniej niż w normalnym przypadku. A wiemy, że czcionki wtykowe blokują elementy i opóźniają renderowanie czcionki na stronie, dlatego muszą zostać załadowane tak szybko, jak to możliwe. Problem ten jest szczególnie dotkliwy w przypadku korzystania z protokołu HTTP/2, gdy przeglądarka wysyła do serwera wiele żądań na raz, w wyniku czego niektóre obrazy mogą zapełnić pasek klienta, a ładowanie ważnych zasobów zostanie opóźnione.
Pliki CSS zawsze blokują renderowanie strony, więc wszystkie zasoby CSS, które można odłożyć, można załadować jako zwykłe pliki i dynamicznie dołączyć do strony.
Odbywa się to w następujący sposób:
link rel = "preload" as="style" href = "async_style.css" onload = "this.rel="stylesheet"" >Przydatne może być również wstępne załadowanie kodu skryptu w JS, aby móc go później wykonać.
Można to zrobić za pomocą następującego kodu:
link rel = „wstępne ładowanie” as = „skrypt” href = „async_script.js”ładowanie = "var skrypt = document.createElement("skrypt"); skrypt.src = this.href; document.body.appendChild(skrypt);">Przyjrzeliśmy się głównym sposobom wykorzystania mechanizmu wstępnego ładowania, ale na tym możliwości się nie kończą – przeprowadź własne eksperymenty!
Klasa ResourceBundle.Control posiada zestaw metod zewnętrznych, które są wywoływane przez metodę ResourceBundle.getBundle() podczas wyszukiwania i ładowania pakietów. Tworząc klasę Control, możesz zmienić domyślne zachowanie ładowania i buforowania.
W w tym przypadku musisz stworzyć implementację dwóch metod klasy Control: getFormats() i newBundle() . Za obsługę odpowiada metoda getFormats(). formacie XML, a newBundle() działa z pakietem zasobów. W klasie bazowej Control znajdują się metody pomocnicze umożliwiające konwersję podstawowych nazw zestawów na rzeczywiste nazwy zasobów.
Ta implementacja klasy ResourceBundle.Control zawiera podklasę XMLResourceBundle. Ta podklasa służy do ładowania danych z Plik XML i użycie ich w metodzie ResourceBundle.
Poniżej znajduje się opis klasy Control oraz implementacja metody ResourceBundle:
importuj java.io.*;
importuj java.net.*;
importuj java.util.*;
Klasa publiczna XMLResourceBundleControl rozszerza ResourceBundle.Control (
prywatny statyczny ciąg XML = "xml";
Lista publiczna getFormats(String baseName) (
return Kolekcje.singletonList(XML);
}
Pakiet zasobów publicznych nowy pakiet ( String baseName, ustawienia regionalne,
Format ciągu znaków, moduł ładujący ClassLoader, przeładowanie wartości logicznej)
rzuca IllegalAccessException, InstantiationException, IOException{
if ((nazwabazowa == null ) || (locale == null ) || (format == null )
|| (program ładujący == null )) (
rzuć nowy wyjątek NullPointerException () ;
}
Pakiet ResourceBundle = null ;
if (format. równa się (XML)) (
Ciąg NazwaPakietu =NazwaPakietu(nazwa bazowa, ustawienia regionalne) ;
Ciąg nazwa_zasobu = nazwa_zasobu(nazwa pakietu, format) ;
Adres URL= moduł ładujący.getResource(nazwa zasobu);
if (url != null ) (
Połączenie URLConnection = url.openConnection()
;
if (połączenie != null ) (
jeśli (przeładuj) (
połączenie.setUseCaches(false);
}
Strumień wejściowy = połączenie.getInputStream()
;
if (strumień != null ) (
BufferedInputStream bis = nowy BufferedInputStream (
strumień);
pakiet = nowy pakiet XMLResourceBundle(bis);
bis.zamknij();
}
}
}
}
pakiet zwrotny;
}
Prywatna klasa statyczna XMLResourceBundle rozszerza ResourceBundle (
rekwizyty dotyczące właściwości prywatnych;
XMLResourceBundle (strumień wejściowy) zgłasza wyjątek IOException (
props = nowe właściwości();
props.loadFromXML(strumień);
}
Obiekt chroniony handleGetObject(klawisz ciągu) (
zwróć props.getProperty(key);
}
Wyliczenie publiczne getKeys() (
Ustaw handleKeys = props.stringPropertyNames()
;
return Kolekcje.wyliczenie(handleKeys);
}
}
Publiczna statyczna pustka główna (argumenty ciągu) (
(„Test2”,
nowa kontrola pakietu XMLResourceBundle()) ;
Ciąg ciąg = pakiet.getString(„Klucz pomocy”);
System.out.println („HelpKey: „ + string ) ;
}
}
Ta implementacja obejmuje program testowy składający się z trzech linii:
Pakiet ResourceBundle = ResourceBundle.getBundle(„Test2”, nowa kontrola XMLResourceBundleControl()) ;
Ciąg ciąg = pakiet.getString(„Klucz pomocy”);
System.out.println („HelpKey: „ + string ) ;
Najbardziej interesująca jest tutaj pierwsza linijka. Musisz przekazać swoją kontrolę do metody getBundle(). Następnie możesz używać zestawu jak w każdym innym przypadku.
Poniżej przetłumaczone Przykład XML-a Plik Test2.xml:
http://java.sun.com/dtd/properties.dtd"
>
Wynikiem wykonania programu XMLResourceBundleControl będzie:
> Java XMLResourceBundleControl HelpKey: Pomoc
Powyższa implementacja nie korzysta z metod getTimeToLive() i needReload():
publiczny długi getTimeToLive( Ciąg znaków baseName, ustawienia regionalne)
Publiczna wartość logiczna NeedReload( Nazwa bazowa ciągu,
Lokalne, lokalne,
Format ciągu
Program ładujący ClassLoader
Pakiet ResourceBundle
długi czas ładowania)
Metoda getTimeToLive() zwraca czas życia pakietów zasobów utworzonych za pomocą ResourceBundle.Control . Zestawy zasobów są przechowywane w pamięci podręcznej, aby przyspieszyć proces ponownego ładowania. Tym samym, gdy zestaw zostanie pobrany ponownie, będzie on znajdował się w pamięci podręcznej. Dodatnia wartość czasu życia określa w milisekundach, jak długo zestaw pozostanie w pamięci podręcznej bez ponownego sprawdzania. Domyślna wartość zwracana przez metodę getTimeToLive() to TTL_NO_EXPIRATION_Control, która wyłącza sprawdzanie ważności pamięci podręcznej. Jeśli nie chcesz buforować zestawu, zwróć wartość TTL_DONT_CACHE . Jeśli zwrócone zostanie 0, pakiet jest buforowany, ale jest sprawdzany przy każdym wywołaniu metody getBundle(). Aby wyczyścić pamięć podręczną, wywołaj statyczną metodę clearCache() klasy ResourceBundle. Posiada opcjonalny argument ClassLoader, który umożliwia wyczyszczenie pamięci podręcznej utworzonej przez określony moduł ładujący.
Metoda needReload() określa, czy zestaw buforowany powinien zostać ponownie załadowany. PRAWDA oznacza, że zestaw wymaga ponownego załadowania, a wartość false oznacza, że nie trzeba go ponownie ładować. Możesz kontrolować, czy zestaw zasobów wymaga ponownego załadowania, przeciążając metodę needReload(). Na przykład, jeśli chcesz, aby zestaw zasobów był zawsze ładowany ponownie, metoda needReload() powinna zawsze zwracać wartość true . W takim przypadku metoda getTimeToLive() musi zawsze zwracać wartość 0. W przeciwnym razie zbiór będzie przechowywany dłużej niż oczekiwano.
Aby otrzymać dodatkowe informacje Informacje na temat ulepszeń związanych z procesami internacjonalizacji w Mustangu można znaleźć na blogu Johna Oconera, programisty w firmie Sun, pod adresem
Postanowiłem to kontynuować aktualny temat. Zrobiłem listę najlepsze zasoby do nauki HTML i CSS, aby pomóc tym, którzy chcą studiować te zagadnienia. Pamiętam, że kiedy zaczynałem jako webmaster, bardzo brakowało mi takiego wyboru wysokiej jakości i przydatnych zasobów.
Najpierw kilka definicji:
Html (z angielskiego „HyperText Markup Language” - hipertekstowy język znaczników) to standardowy język znaczników dla stron internetowych.
CSS (z angielskiego „Cascading Style Sheets” – kaskadowe arkusze stylów) to technologia opisu wygląd strony internetowe.
Bez znajomości HTML i CSS prowadzenie Twojej witryny będzie bardzo problematyczne - nie będziesz mógł nawet zainstalować licznika statystyk, ani nawet banera. Czy nie powinniśmy zwrócić się o pomoc do specjalistów lub tworzyć temat za tematem na forach? Trzeba to po prostu wziąć i się tego nauczyć.
Z własnego doświadczenia mogę powiedzieć, że HTML i CSS można nauczyć się w 1 miesiąc. Nie mówię oczywiście o wysokościach zawodowych – jeśli chcesz, możesz je osiągnąć samodzielnie.
Moim zdaniem, najlepszy sposób nauka HTML, CSS i innych zagadnień, w tym promocji stron internetowych, oznacza posiadanie własnej strony internetowej i ćwiczenie na niej. Swoją drogą, możecie zobaczyć pierwszą stronę internetową, którą stworzyłem dla map do gry Counter-Strike, stworzeniem której wtedy bardzo mi zależało. Oto mapy i ich zrzuty ekranu, stworzone przez staruszka Globatora w czasach, gdy nie wiedział jeszcze, czym jest top 10, TCI i PR i beztrosko bawił się w słońcu tworząc trójwymiarowe mapy :) Stronę tę stworzyłem w miesiąc, ucząc się w praktyce html i css.
Aby nauczyć się HTML i CSS, nie musisz tego robić specjalista techniczny. Na przykład ogólnie jestem humanistą i z matematyki najczęściej dostawałem „2” :) Więc każdy może nauczyć się HTML i CSS. Zasoby, które wymieniłem, są również odpowiednie, abyś w każdej chwili mógł z nich skorzystać, aby znaleźć dowolny interesujący Cię punkt dotyczący HTML i CSS.
Strony internetowe do nauki HTML i CSS
Wybór przydatnych zasobów do nauki HTML i CSS zacznę od strony, z której sam korzystałem. To są lekcje Wild HTML napisane przez Valentinę Akhmetzyanovą alias Dikarka. Wszystkie niezbędne punkty opisała tak wesoło i ciekawie, że nauka HTML i CSS przy pomocy jej lekcji zamienia się w pasjonujące zajęcie. Nawiasem mówiąc, możesz przeczytać witrynę bloga. Dzikie lekcje wystarczą, aby nauczyć się HTML i CSS na poziomie niezbędnym do pracy jako webmaster.
Czy możesz sobie wyobrazić, kim bym był, gdybym rozwinął temat Photoshopa? Byłbym prawdziwym potworem! Ale zaangażowałam się w SEO i wegetuję tutaj, pisząc te listy z palcami drżącymi od zimna :) Żartuję, u nas też jest ciepło i jedzenie jest dobre :)
Wszystko Linki HTML dzielą się na zewnętrzne i wewnętrzne. Linki zewnętrzne to linki prowadzące z jednej witryny do innej witryny lub pliku znajdującego się w innej witrynie. Linki wewnętrzne - są to linki prowadzące z jednej strony witryny do innej strony tej samej witryny lub do sekcji tej samej strony.
Wszystko linki zewnętrzne w atrybucie href tagu zawierają bezwzględną ścieżkę do dokumentu, do którego się odnoszą. Linki wewnętrzne z kolei mogą zawierać zarówno ścieżki bezwzględne, jak i względne (w tym przypadku zależy to od Twoich osobistych preferencji).
Wszystkie linki można również podzielić na względne i bezwzględne. Linki względne- są to linki HTML zawierające ścieżki względne, które mogą mieć charakter wyłącznie wewnętrzny; Absolutne linki- są to linki zawierające ścieżki absolutne, które mogą być zewnętrzne lub wewnętrzne;
Ścieżka względna oznacza, że ścieżka do żądanego pliku lub strony Twojej witryny rozpoczyna się względem katalogu, w którym znajduje się strona z linkiem, lub względem katalogu głównego witryny. Przyjrzyjmy się częściom, z których może składać się ścieżka względna:
| Części ścieżki | Opis | Przykładowe wartości |
|---|---|---|
| nazwa pliku | Jeśli jako wartość atrybutu podasz tylko nazwę pliku, oznacza to, że żądany plik znajduje się w tym samym folderze, co strona z linkiem. | "strona.html" |
| katalog/ | Jeśli plik, do którego musimy podać ścieżkę, znajduje się w katalogu podrzędnym w stosunku do pliku z linkiem, oznacza to, że musimy zejść o jeden poziom niżej (do folderu podrzędnego bieżącego katalogu), w tym przypadku ścieżka zaczyna się od nazwy katalogu podrzędnego, po której następuje nazwa oznaczona ukośnikiem „/”, służy ona do oddzielenia części ścieżki, po której następuje nazwa potrzebnego nam pliku. Uwaga: możesz przeglądać dokładnie tyle folderów, ile je utworzyłeś. Na przykład, jeśli utworzyłeś folder 10 poziomów poniżej katalogu głównego, możesz określić ścieżkę, która poprowadzi Cię w dół 10 folderów. Jeśli jednak masz tak wiele poziomów, najprawdopodobniej oznacza to, że organizacja Twojej witryny jest niepotrzebnie niewygodna. |
" katalog/strona.html " " katalog1/katalog2/strona.html " |
| ../ | Jeśli chcesz wskazać, że plik, do którego linkujesz, znajduje się w folderze nadrzędnym, użyj symboli .. (dwie kropki), które oznaczają przejście o jeden poziom wyżej (do folderu nadrzędnego bieżącego katalogu). Następnie podajemy ukośnik „/”, aby oddzielić części ścieżki i wpisujemy nazwę naszego pliku. Uwaga: symboli .. można używać dowolną liczbę razy z rzędu, za każdym razem przesuną Cię o jeden folder w górę. Możesz jednak iść w górę, aż dotrzesz do folderu głównego swojej witryny. Nie możesz przejść wyżej niż ten folder. |
" ../strona.html " " ../../strona.html " " ../../../cat1/cat2/page.html " - przechodzimy z bieżącego folderu trzy katalogi wyżej i stamtąd schodzimy dwa poziomy niżej do żądanego pliku |
| / | Ścieżka względna nie zawsze musi zaczynać się w odniesieniu do bieżącej lokalizacji strony zawierającej link; może również rozpoczynać się w odniesieniu do katalogu głównego witryny. Na przykład, jeśli żądany plik znajduje się w katalogu głównym, ścieżka może zaczynać się od symbolu „/”, po czym wystarczy podać nazwę żądany plik, który znajduje się w katalogu głównym. Uwaga: Gdy znak „/” pojawia się jako pierwszy, oznacza to, że ścieżka zaczyna się od katalogu głównego. | „/strona.html” " /cat1/cat2/car.png " |
Ścieżka bezwzględna jest zwykle używana do określenia ścieżki do pliku, który znajduje się w innym zasób sieciowy. Jest to pełny adres URL pliku lub strony. Przede wszystkim adres wskazuje używany protokół, a następnie nazwę domeny (nazwę witryny). Na przykład: http://www.primer.ru - tak wygląda bezwzględna ścieżka do konkretnej witryny. http:// to protokół przesyłania danych, a www.primer.ru to nazwa strony (domeny).
Możesz także użyć ścieżki bezwzględnej we własnej witrynie. Jednak w witrynie zaleca się stosowanie ścieżki względnej jako wartości linków.
Teraz spójrzmy, co to jest Adres URL-adres. Każda strona internetowa w Internecie ma swój własny, unikalny adres, zwany adresem URL. Skrót Adres URL oznacza U mundur Rźródło L Ocator (jednolity adres zasobu), mówiąc najprościej, adres URL to identyfikator lokalizacji zasobu. Ta metoda wpisywania adresu jest ujednolicona w Internecie.
