Jak zrobić prostą stronę HTML?

01.06.2020
Artykuły i więcej… 'Jak zrobić prostą stronę HTML?
0 9 мин.


HTML lub Hipertekstowy język znaczników jest, jak sama nazwa wskazuje, językiem znaczników. Nie jest uważany za język programowania w tradycyjnym znaczeniu. Jest to język, w którym twórca może tworzyć dokumenty i oznaczać różne części za pomocą tagów HTML. HTML został zainspirowany przez SGML, a jego pierwsza wersja pojawiła się w 1990 roku w CERN.

HTML został pierwotnie zaprojektowany dla prostych dokumentów statycznych, w czasach, gdy WWW uważano za system pobierania dokumentów. Obecnie prawie każda strona internetowa korzysta z HTML, który stał się językiem sieci. Ostatnia iteracja to HTML5, który jest obsługiwany przez wszystkie główne przeglądarki i stanowi ulepszenie HTML 4, który został „znormalizowany” w 1997 roku.

W tym artykule zostanie wskazane podstawy tworzenia prostej strony HTML, coś, czego każdy może się nauczyć, niezależnie od wybranego zawodu.

Dlaczego warto uczyć się HTML?

Można argumentować, że dzięki dzisiejszej technologii każdy może stworzyć szybką i ładnie wyglądającą stronę internetową bez potrzeby kodowania pojedynczego wiersza HTML, i chociaż jest to z pewnością prawda, zawsze można się przydać, aby wiedzieć, jak ją trochę ulepszyć.

Często ludzie dodają wtyczki / moduły / rozszerzenia do CMS, takich jak WordPress, Drupal, Joomla itp., Aby rozszerzyć go o prostą funkcję, którą można osiągnąć za pomocą kilku linii HTML. Chociaż wtyczka może być prostsza, może wydłużyć czas ładowania strony, a jest to kolejna rzecz, o którą należy się martwić pod względem bezpieczeństwa i aktualizacji.

Nauka HTML jest dość łatwa i może być świetną zabawą, ponieważ natychmiast widzisz wyniki, w przeciwieństwie do języka programowania, w którym musisz skompilować napisany kod. Masz już wszystkie narzędzia potrzebne do rozpoczęcia nauki HTML, masz przeglądarkę internetową i na pewno masz prosty edytor tekstu, taki jak notatnik. Aplikacje takie jak Microsoft Word tego nie zrobią, potrzebujesz podstawowego edytora zwykłego tekstu: notatnik, notatnik ++. Istnieją tak zwane IDE (zintegrowane środowisko programistyczne), które pomogą Ci pisać HTML z funkcjami takimi jak podświetlanie składni lub automatyczne uzupełnianie.

Witaj świecie!

Możesz pobrać darmowy edytor tekstu, taki jak Notepad ++ lub Sublime Text Editor, i uruchomić go. Zapisz pusty plik na pulpicie jako „hello.html”. Spowoduje to zmianę edytora w trybie HTML, dzięki czemu będziesz mógł korzystać z zalet IDE. Teraz idź dalej i wpisz w nim następujący tekst:

Witaj świecie!

Witaj świecie!

Zapisz plik, a następnie otwórz go za pomocą przeglądarki internetowej. To wcale nie było takie trudne, prawda? Możesz modyfikować plik, zapisać go i odświeżyć stronę w przeglądarce, a zobaczysz wszystkie dokonane zmiany. Nie musisz się bać, nie ma sposobu, aby wpłynąć na swój system operacyjny. Nie można usuwać plików ani rzeczy tego rodzaju. I nie bój się porażek, jak mówi przysłowie „Mistrz zawiódł więcej razy, niż początkujący nawet próbował”.

Podstawy HTML i 101

Podstawy HTML 101

HTML składa się z tagów i tekstu. Znacznik HTML ma specjalne znaczenie dla przeglądarki, w zasadzie jest to metoda oznaczania dokumentu. Niektóre tagi mogą zawierać inne tagi, jak na przykład nieuporządkowany tag listy

    może zawierać elementy listy

  • w tym. Tag akapitu

    może zawierać nowy znacznik linii
    , tag kotwicy , pogrubienie , italski , tagi itp.

    W naszym przykładzie główny tag HTML zawiera tag head i tag body. W tagu head możemy określić tytuł dokumentu, który będzie wyświetlany w tytule zakładki przeglądarki. W ciele mamy tag H1 lub tag Heading 1.

    Tagi HTML mogą mieć atrybuty, które mogą zmieniać zachowanie znaczników, na przykład możemy dodać atrybut „style” do naszego H1, aby określić jego styl. Jeśli dodamy styl = „kolor: czerwony”, stanie się

    Witaj świecie!

    możemy zmienić jego kolor z domyślnego czarnego na czerwony. Oczywiście na większej stronie stylizacja naszych elementów jeden po drugim może stać się problematyczna i zaśmieci nasz HTML. Lepszą metodą byłoby nadanie elementowi atrybutu klasy lub identyfikatora, a następnie określenie jego stylu przez tę klasę lub identyfikator.

    Jest wiele Samouczki HTML i zasoby w Internecie, możesz oglądać samouczki na YouTube lub The Great Curses Plus lub przeczytać jeden z tysięcy artykułów w Internecie na temat HTML.

    Należy pamiętać, że bez względu na to, ile czytasz lub oglądasz, musisz ubrudzić sobie ręce i zacząć pisać HTML. Jest to jedyny sposób, aby się nauczyć, ponieważ w chwili, gdy zaczniesz pisać, będziesz mieć więcej pytań, a te pytania doprowadzą do jeszcze większej liczby pytań, dopóki nie poczujesz się pewnie i biegle w HTML.

    Stylizacja i skryptowanie

    Czysta strona HTML jest statyczna. Oznacza to, że nie może zawierać dynamicznie zmieniających się części, na przykład „Nasze najnowsze wiadomości”. Jeśli utworzysz witrynę internetową z sekcją wiadomości, która jest stale aktualizowana, po prostu tworzenie artykułów, a następnie aktualizowanie odniesień do niej może stać się dość dużym zadaniem.

    Z drugiej strony, jeśli tworzysz wizytówkę lub typ strony o mnie w HTML, co nie zmienia się tak często, może raz lub dwa razy w miesiącu, to statyczna strona HTML jest idealna. Ponieważ nie ma „ruchomych” części, takich jak baza danych, przetwarzanie po stronie serwera (PHP, Python, Ruby itp.), Jest mniej rzeczy do zrobienia i jest również niesamowicie szybki.

    Możesz uczynić stronę statyczną dynamiczną, dodając JavaScript (Skrypt ECMA a dokładniej), który jest skryptowym językiem programowania. Za pomocą JavaScript możesz reagować na dane wejściowe użytkownika, ukrywając lub pokazując niektóre części HTML, możesz także zmienić wygląd strony internetowej. Z AJAX, możesz poprosić o dodatkowe zasoby ze swojej witryny, takie jak podstrony, formularz kontaktowy lub najnowsze tweety, i możesz włączyć je do swojej witryny.

    Domyślne style HTML są dość nudne, to czarny tekst na białym tle. Możesz zmienić styl dowolnego elementu HTML za pomocą CSS (Cascading Style Sheets). W HTML nie masz kontroli nad tym, jak twój dokument będzie renderowany, jest to funkcja HTML, a nie wada. Dzięki CSS możesz starać się być bardziej precyzyjnym, ale nadal nie będziesz mieć 100% kontroli. Niektóre przeglądarki będą działać nieco inaczej niż inne. Obecna wersja CSS, obsługiwana przez wszystkie główne przeglądarki, to CSS3 i ma wiele przydatnych funkcji, których brakowało w poprzednim standardzie.

    Aby zrozumieć CSS, powinieneś zacząć od modelu pudełkowego, na początku pozwoli ci to zaoszczędzić wiele zamieszania i ważne jest, aby zrozumieć różnicę między ramką, wypełnieniem, marginesami itp. CSS jest dość łatwy do nauczenia się i tak jak w przypadku HTML, natychmiast zobaczysz dokonane zmiany. Jak już wspomniano, możesz dodać element id lub class do dowolnego znacznika HTML i możesz napisać reguły CSS dla tych id i klas. Aby wrócić do naszego przykładu, w sekcji nagłówka, jeśli napiszemy następujący tekst,

    ciało {

    Kolor tła: niebieski;

    }

    zmieni domyślny biały kolor dokumentu na niebieski.

    Jedną z rzeczy, o których należy pamiętać w CSS jest to, że istnieje wiele znaczników specyficznych dla przeglądarki, więc upewnij się, że testujesz swoją witrynę przy użyciu różnych przeglądarek lub przynajmniej Google Chrome, Mozilla Firefox, Internet Explorer 11 i Edge. Szybkie przeglądanie niektórych przeglądarek mobilnych, zwłaszcza Safari IOS, nie zaszkodzi.

    Wniosek

    Nauka HTML i CSS jest łatwiejsza niż większość języków programowania i może być bardzo satysfakcjonującym doświadczeniem. Dzięki HTML będziesz mógł tworzyć strony internetowe dokładnie tak, jak chcesz, bez kompromisów, jak w przypadku CMS. Budowanie stron HTML pozwoli Ci je hostować w dowolnym miejscu, a ich ładowanie będzie niezwykle szybkie i płynne.

    Nawet wraz z pojawieniem się wszystkich typów kreatorów stron typu „przeciągnij i upuść”, HTML nie może być uważany za przestarzały. Stanowi podstawę każdej witryny, a nawet dzięki potężnym narzędziom CMS i narzędziom do tworzenia witryn, które pozwalają zbudować profesjonalnie wyglądającą stronę internetową bez znajomości programowania, możesz wprowadzić pewne poprawki w swojej witrynie, aby uzyskać wszystko tak, jak chcesz chcę, żeby były. Nauka HTML pozwoli ci to zrobić.

    Znajomość podstaw HTML może być przydatną umiejętnością dla każdego, nie tylko dla osób planujących karierę w branży IT. Osoby pracujące z treściami internetowymi, marketingiem online, tłumaczeniami i każdy, kto wymaga obecności online, skorzysta z kursu awaryjnego w języku HTML.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
    Оцените статью
    Понравилась статья?
    Комментарии (0)
    Комментариев нет, будьте первым кто его оставит

    Комментарии закрыты.

    Adblock
    detector