Page 1

Sporo samouczków dotyczących tworzenia stron WWW można znaleźć na stronie http://msdn.microsoft.com/pl-pl/

HTML Internet umożliwia propagowanie różnorakich treści wśród grupy odbiorców. Jedną z wielu technologii, które pomogą nam utworzyć dokument do zastosowań w globalnej sieci, jest język HTML. Jest to jedno z prostszych rozwiązań, które pozwala utworzyć dokument zawierający grafikę, tekst oraz elementy multimedialne jak np. video. Aktualnie rozwijaną wersją jest HTML5. Jednak ze względu na starsze przeglądarki, które nie obsługują tej wersji w samouczku wykorzystamy HTML4. Wersja piąta wzbogacona została o wiele przydatnych funkcji, takich jak np. bezpośrednie osadzanie video. Rozpoczynając pracę na swoim komputerze powinieneś posiadać:   

dowolny edytor tekstowy (np. Notatnik), dostęp do Internetu, Microsoft Visual Web Developer 2010 Express.( można pobrać za darmo tutaj: http://www.microsoft.com/visualstudio/en-us/products/2010-editions/express) Wykonamy prostą stronę internetową, zawierającą krótki akapit tekstu, przy użyciu dwóch różnych programów. Strona została zaprezentowana na Rys. 1.

Rys.1. Naszym zadaniem jest stworzenie strony internetowej zgodnie ze standardami określonymi przez W3C.   

Uruchom prosty edytor tekstu notepad.exe (systemowy notatnik). Utwórz dokument html. W nowo otwartym oknie Notatnika wpisz:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Pierwsza strona internetowa</title>


</head> <body> <h1>Witaj</h1> <p>Witaj świecie! To jest moja pierwsza strona internetowa. Zawierająca tylko tytuł strony, tekst nagłówka oraz akapit z przykładowym tekstem </p> </body> </html>

    

W menu Notatnika wybierz Plik, a następnie Zapisz jako. Wybierz katalog docelowy. W polu nazwa pliku wpisz Start.html. Z listy rozwijanej Kodowanie wybierz UTF-8. Kliknij Zapisz.

Stworzyłeś w ten sposób swoją pierwszą stronę internetową zgodną ze standardami W3C (World Wide Web Consortium) Wyświetlanie strony internetowej w przeglądarce. 

W managerze plików (np. Windows Explorer) kliknij dwukrotnie na utworzony plik o nazwie Start.html, plik ten otworzy się bezpośrednio w przeglądarce.

Teraz tworzymy w Microsoft Visual Web Developer 2010 Express. Utwórz nowy projekt.     

Uruchom program Microsoft Visual Web Developer 2010 Express. Wybierz File–>New Project. Odszukaj i wybierz pozycję ASP.NET Empty Web Application. W polu Name wpisz Projekt1. Kliknij OK (Rys. 2.). W ten sposób utworzyłeś nowy projekt, który pozwala zarówno na utworzenie statycznych jak i dynamicznych stron internetowych.

Rys.2.


Dodaj stronę internetową do projektu.    

Wybierz Project–>Add New Item (Rys. 3.). Odnajdź i wybierz HTML Page. W polu Name wpisz Start.html. Kliknij przycisk Add.

Rys.3. 3.

Zmień dokument html. o Wybierz zakładkę Source, umieszczoną w dolnej części okna oznaczoną na Rys. 4. o Przejdź do znaczników <title></title>, wpisz pomiędzy nimi Pierwsza strona internetowa. o Przejdź do znaczników <body></body> i wpisz< o Z wyświetlonej listy (lista IntelliSense) wybierz znacznik h1 i wciśnij enter. o Pomiędzy utworzone tagi h1 wpisz Witaj o Ustaw kursor na końcu linii i dodaj nową linię o Wpisz:

<p> Witaj świecie! To jest moja pierwsza strona internetowa. Zawierająca tylko tytuł strony, tekst nagłówka oraz akapit z przykładowym tekstem </p>

Zapisz zmiany. 4.

Wyświetlanie strony internetowej w przeglądarce. 

W oknie Solution Explorer kliknij na nazwie Start.html prawym przyciskiem myszy i wybierz View in Browser. Jeśli nie widzisz okna Solution Explorer, to wybierz View->Other Windows-> Solution Explorer.


Rys.4. Widok zakładki Source.

Walidacja strony internetowej Jeżeli chcesz sprawdzić, czy strona internetowa, którą stworzyłeś, jest zgodna ze standardem warto przeprowadzić proces walidacji. Proces ten ujawni niezgodności, które mogą spowodować niejednoznaczną interpretację przez przeglądarki, co skutkować może odmiennym wyświetlaniem zawartości strony. Przeprowadź walidację. 

  

W przeglądarce otwórz stronę internetową http://validator.w3.org (Rys. 5.)

Rys.5. strona walidatora Wybierz zakładkę Validate by Direct Input. Przekopiuj kod źródłowy z któregokolwiek wcześniej stworzonego pliku Start.html (powinny mieć identyczny kod).

Naciśnij przycisk Check. Powinieneś ujrzeć wynik jak na Rys. 6.


Rys.6.

Podsumowanie W tym artykule nauczyliśmy się, w jaki sposób wykorzystać prosty edytor tekstowy oraz Microsoft Visual Web Developer 2010 Express do budowania statycznych stron internetowych. Nauczyliśmy się również, w jaki sposób sprawdzić poprawność naszej witryny pod kątem zgodności ze standardem.

Źródło: http://msdn.microsoft.com/pl-pl/library/kurs-html-css--samouczek--pierwsza-stronainternetowa.aspx

Tomasz Wiench 1ft

Strony www - samouczki w internecie  

zawiera opis tworzenia strony www na podstawie kursu z internetu

Read more
Read more
Similar to
Popular now
Just for you