Reklama

HTML5 to najnowsze i najlepsze Co to jest HTML5 i jak zmienia sposób przeglądania? [MakeUseOf wyjaśnia]W ciągu ostatnich kilku lat słowo HTML5 mogło być słyszane co jakiś czas. Niezależnie od tego, czy wiesz coś na temat tworzenia stron internetowych, czy nie, koncepcja może być nieco mglista i myląca. Oczywiście,... Czytaj więcej wersja najczęściej używanego języka znaczników w Internecie. Są pewne duże zmiany w stosunku do ostatniej wersji języka, a jeśli ich nie używasz, brakuje Ci naprawdę fajnej funkcjonalności.

Nie mamy miejsca na pokrycie każdego nowego elementu w piątej wersji HTML, ale te dziewięć jest jednymi z najważniejszych. Aby uzyskać więcej informacji o nowych elementach i interfejsach API w HTML5, koniecznie sprawdź W3Schools.

Wprowadzenie do elementów semantycznych

Podobnie jak większość Internetu, HTML5 przesunął się na semantykę. Teraz zamiast tagów używanych do formatowania, są one również używane do informowania przeglądarek i wyszukiwarki Top 7 semantycznych wyszukiwarek jako alternatywa dla Google Czytaj więcej znaczenie tego, co otaczają.

instagram viewer

Na przykład,

po prostu informuje przeglądarkę, że zawiera akapit.

, które omówimy za chwilę, informuje przeglądarkę, że zawiera główną treść strony.

Sieć semantyczna wciąż się rozwija, a my dopiero zaczęliśmy zarysowywać to, co potrafi. HTML5 pomaga przynieść znacznik semantyczny Co to jest znacznik semantyczny i jak zmieni Internet na zawsze [technologia wyjaśniona] Czytaj więcej do znacznie większej części Internetu, a to może być dobre tylko na przyszłość przetwarzania semantycznego.

1.

The

tag definiuje „niezależne, niezależne treści”. Najłatwiejszym przykładem jest oczywiście artykuł. W tym konkretnym artykule otwieramy tag przed wprowadzeniem i zamykamy go po zakończeniu.

Cały tekst w niezależnej sekcji.

Ale są też inne sposoby, aby z niego skorzystać. Na przykład wiele blogów kulinarnych zawiera osobiste historie o tym, jak powstał przepis lub dlaczego jest on ważny dla pisarza. Następnie następuje sam przepis. Można argumentować, że każdy z tych elementów może być samodzielny.

Na forum każdy post lub wątek można uznać za samodzielny i każdy może być oznaczony własnym

etykietka. W przeważającej części będzie on używany w głównej treści strony. Pamiętaj jednak, że możesz także używać go bardziej twórczo.

2.

Blisko związany z

jest
. Definiuje to „tematyczne grupowanie treści, zazwyczaj z nagłówkiem”. Więc
będzie w środku
… dobrze?

Niekoniecznie. W3 wskazuje, że zależy to od struktury twojej witryny. Możesz mieć niezależną treść w różnych sekcjach swojej strony (na przykład na pierwszej stronie witryny z wiadomościami). Możesz mieć sekcje w tym artykule.

Dlaczego potrzebujesz DAC

Wszystko brzmi lepiej.

Jak skonfigurować DAC

Oto, co musisz zrobić.. .

Możesz nawet mieć sekcje w sekcjach, jeśli pasują one do Twojej strony. Pamiętaj, że sekcja to po prostu „tematyczna grupa treści”, a znajdziesz wiele miejsc, w których możesz z niej korzystać.

3.

Ten element „powinien być używany jako pojemnik na treści wprowadzające”. Krótko mówiąc, jest to część strony, która pomaga ludziom zrozumieć, co zamierzają przeczytać.

Ale nie daj się zwieść - możesz użyć tego kontenera więcej niż raz. Możesz na przykład użyć go do zidentyfikowania tytułu strony i akapitu wprowadzającego do swojego posta na blogu. Ale możesz także użyć go do oznaczenia treści wprowadzających dla każdej sekcji.

Wszystko, co musisz wiedzieć o przetwornikach DAC

Oto przydatne wprowadzenie do przetworników DAC ...

Reszta twojego artykułu jest tutaj.

Sekcje nagłówka zwykle zawierają co najmniej jeden tag nagłówka - H1, H2 itd. Nie muszą, ale ogólnie rzecz biorąc, jeśli używasz tagu nagłówka, istnieje duża zaleta, że ​​dołączasz treść nagłówka.

4.

W3 twierdzi, że znaczniki stopki zwykle zawierają „autora dokumentu, informacje o prawach autorskich, linki do warunków użytkowania, dane kontaktowe itp.” Możesz myśleć o tym jak o „sprzątaniu”.

Dokumentacja stwierdza również, że na swojej stronie możesz mieć więcej niż jedną sekcję stopki. Prawdopodobnie dobrym pomysłem jest jednak przechowywanie wszystkich tych informacji w jednym miejscu.

5.

Ten tag zawiera łącza nawigacyjne dla danej strony. Pamiętaj, że tylko sekcja nawigacji otrzymuje ten tag, a nie wszystkie linki na Twojej stronie. Dotyczy pasków nawigacyjnych i podobnych narzędzi.

To naprawdę prosty tag - to wszystko. Użyj go, aby zdefiniować sekcję nawigacji i nie używaj go ponownie na swojej stronie.

6.

Jednym z najciekawszych nowych elementów HTML5 jest bok. W3 nadaje jej nieco nieprzydatną definicję „niektóre treści oprócz treści, w których są umieszczone”.

Krótko mówiąc, na bok jest wszystko, co jest związane (ale nie jest) z otaczającymi informacjami. Może to być pasek boczny, który dodaje szczegółów do treści. Gdy jest używany w zestawie

tagi, zawiera dodatkowe informacje, które nie są konieczne do zrozumienia głównej treści.

Na przykład, gdybyśmy w tym artykule umieścili pasek boczny zawierający informacje o historii HTML5, byłoby to na marginesie.

Ale

Główny artykuł znajduje się tutaj. Artykuł jest kontynuowany tutaj.

Ponieważ ten znacznik ma wiele zastosowań, może być mylący. Jeśli pamiętasz, że jest to „treść wtórna” i że nie zawsze musi to być pasek boczny, lepiej zrozumiesz, jak z niej korzystać.

7.

Wiele stron internetowych zawiera informacje, które muszą być wyświetlane, ale nie w widocznym miejscu. Może są to informacje o prawach autorskich do zdjęcia. Lub drobny druk na konkursie. Tego rodzaju informacje są dokładnie tym, do czego służy tag details.

Korzystając ze znacznika szczegółów, tworzysz ukryty tekst, który można łatwo wyświetlić. Oto przykład:

Kliknij tutaj, aby zobaczyć informacje.

Oto bardziej szczegółowe informacje, których nie potrzebujesz od razu.

Wystarczy kliknąć strzałkę, aby uzyskać szczegółowe informacje. Prosty. Stworzenie go jest równie łatwe. Oto kod użyty w powyższym przykładzie:

Kliknij tutaj, aby zobaczyć informacje. Oto bardziej szczegółowe informacje, których nie potrzebujesz od razu.

The

Tag określa zdanie, które będzie wyświetlane, podczas gdy inne treści są ukryte. Pamiętaj, że możesz używać innych tagów w sekcji szczegółów: nagłówków, sekcji i tak dalej.

Są inne fajne rzeczy, które możesz zrobić z HTML 8 fajnych efektów HTML, które każdy może dodać do swojej witrynyNie musisz znać CSS ani PHP, aby zbudować fantazyjną stronę. Użyj tych fajnych sztuczek HTML, aby wygenerować niesamowite efekty. Czytaj więcej , nawet jeśli nie znasz dużo CSS lub JSON.

8-9.
i

Nie martw się tag, którego używasz od lat, nie zniknie.

omija znacznik obrazu i informuje przeglądarkę, że jest to samodzielny obraz, schemat, lista kodów lub inna postać.

Usunięcie rysunku ze strony nie wpłynie na przepływ treści.

wchodzi w znacznik postaci i określa podpis obrazu. Może to wyglądać mniej więcej tak:

To jest nasze logo!

Daje to wbudowany sposób dodawania podpisu do zdjęć. Nie musisz już przechodzić przez CMS.

Wykorzystaj moc HTML5

Nowe elementy w HTML5 dodają dużo mocy, zwłaszcza do celów semantycznych. Istnieją dodatkowe elementy dotyczące formatowania, pomiarów skalarnych, postępu zadań i innych. Możesz zobaczyć wszystkie nowe elementy w W3Schools.

Ale jeśli opanujesz te dziewięć, będziesz na dobrej drodze do dobrego wykorzystania HTML5. A jeśli dopiero zaczynasz korzystać z HTML, koniecznie sprawdź te przykłady kodu 17 prostych przykładów kodu HTML, których możesz się nauczyć w 10 minutChcesz stworzyć podstawową stronę internetową? Naucz się tych przykładów HTML i wypróbuj je w edytorze tekstu, aby zobaczyć, jak wyglądają w przeglądarce. Czytaj więcej !

Czy zacząłeś używać HTML5? Jakie nowe elementy są najbardziej przydatne? Podziel się swoimi przemyśleniami w komentarzach poniżej!

Dann jest konsultantem ds. Strategii i marketingu treści, który pomaga firmom generować popyt i potencjalnych klientów. Bloguje także na temat strategii i content marketingu na dannalbright.com.