Ostatnia aktualizacja 22 marca, 2023
Chcesz rozpocząć pracę w IT i widzisz się we frontendzie? Na początku drogi web developera będziesz się uczyć m.in., jak zrobić stronę – HTML to podstawa. Aby ruszyć dalej, musisz opanować podstawową strukturę znaczników. W poniższym tekście przeczytasz, jak się za to zabrać.
Sprawdź: Umiejętności do CV
Jak zrobić stronę – HTML krok po kroku
Stworzenie najbardziej podstawowej strony internetowej w HTML-u jest bardzo proste. Oczywiście nie będzie ona wyglądać akceptowanie dla dzisiejszych standardów tworzenia witryn, jednak jest to już pierwszy krok do pogłębiania wiedzy w zakresu web developmentu.
Aby stworzyć stronę internetową w HTML-u, należy wykonać kilka kroków:
- Wybierz edytor kodu:
Możesz wybrać dowolny edytor kodu, który pozwoli Ci na tworzenie plików HTML. Dobre edytory kodu dla początkujących to między innymi: Notepad++, Sublime Text lub Visual Studio Code. Każdy z nich zawiera kolorową składnię i jest darmowy.
- Stwórz plik HTML:
Utwórz nowy plik w edytorze kodu i zapisz go jako plik HTML z rozszerzeniem .html. Jest to to podstawowy element strony internetowej, który jest interpretowany przez przeglądarkę internetową.
- Zdefiniuj strukturę strony:
W pliku HTML możesz zdefiniować strukturę strony, używając tagów HTML, takich jak <html>, <head> i <body>. Tag <html> definiuje początek i koniec dokumentu HTML, a tagi <head> i <body> definiują nagłówek i treść strony. Podstawowy kod będzie wyglądał następująco:
<!DOCTYPE html>
<html>
<head>
<title>Tytuł twojej strony</title>
</head>
<body>
</body>
</html>Dalsza edycja strony internetowej – treść i style
- Dodaj treść do strony:
Możesz dodać treść do strony, używając różnych tagów HTML, takich jak <h1> dla nagłówka, <p> dla tekstu, <img> dla obrazów, <a> dla linków itp.
- Użyj styli CSS:
Aby nadać stronie atrakcyjny wygląd, możesz użyć styli CSS. CSS pozwala na zmianę koloru, czcionki, marginesów, tła itp. Style umieszcza się w sekcji nagłówka <head> lub w zewnętrznym pliku CSS, który jest odwoływany do pliku HTML.
- Zapisz plik i wyświetl stronę:
Po ukończeniu tworzenia strony, zapisz plik HTML i otwórz go w przeglądarce internetowej, aby zobaczyć, jak wygląda Twoja strona. Możesz też opublikować stronę na serwerze, aby była dostępna dla innych użytkowników internetu.
Zobacz: Jak zostać informatykiem?
Przykładowy kod HTML strony internetowej
Bardzo podstawowa strona internetowa nie będzie wyglądać tak, jak współczesne witryny w sieci. To dopiero punkt wyjścia do stworzenia bardziej złożonego projektu. Jak może wyglądać podstawowy, działający kod HTML do strony internetowej?
<!DOCTYPE html>
<html>
<head>
<title>Moja strona internetowa</title>
<style>
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
</style>
</head>
<body>
<h1>Witaj na mojej stronie internetowej</h1>
<p>To jest pierwszy paragraf.</p>
<img src="obraz.jpg" alt="Moja fotografia">
<a href="https://enterthecode.pl">Link do Enter The Code</a>
</body>
</html>
