Przejdź do treści
Tworzenie stron WWW

Jak zrobić własną stronę internetową w edytorze graficznym NVU?

Darek Rogowski
Darek Rogowski Expert
12 stycznia 2014 ~5 min czytania
Jak zrobić własną stronę internetową w edytorze graficznym NVU?
Strona internetowa pozwala zaistnieć w sieci WWW. Jej wygląd, zawartość oraz aktualność wpływa na postrzeganie autora webmastera przez użytkowników internetu. Inaczej powinna wyglądać strona firmowa, inaczej prywatna,jeszcze inny charakter powinien mieć blog lub forum. Jak można uzyskać profesjonalne efekty przy niewielkim nakładzie pracy i za darmo?

Kroki

1

Od czego zaczynamy

Budowa strony internetowej przypomina trochę budowę budynku. Każda z podstron to rodzaj pokoju, korytarza lub jakiegoś urządzenia. Wszystkie elementy są powiązane drogami komunikacji oraz różnymi instalacjami, mają swoje oczekiwane położenia w budynku. Tylko od najemcy zależy, czy dany pokój wytapetuje, czy pomaluje na różowo.
Podobnie struktura strony internetowej powiązana jest szeregiem hiperlinków i odnośników, łączących poszczególne elementy składowe strony. Do każdego elementu powinien prowadzić bezpośredni link oraz podstrona powinna posiadać link do strony głównej.
Zanim, więc przystąpimy do tworzenia dokumentu strony, należy zebrać treści, ilustracje, tak jakbyśmy mieli pisać książkę lub podręcznik.
Od czego zaczynamy
2

Program edycyjny

Projekt strony można wykonać na papierze lub metodami graficznymi układając zdjęcia lub szkicując. Kolejnym krokiem jest przeniesienie naszego projektu do programu edycyjnego stron WWW.
Dla początkujących najłatwiejszą metodą jest wykorzystanie programu typu WYSIWYG (What You See Is What You Get - To Co Widzisz Jest Tym Co Otrzymasz).
Jednym z możliwych darmowych do użytku domowego jest program NVU 1.0 firmy Linspire Inc.
Program przypomina znane nam edytory tekstu takie jak Word czy OpenOfice i jest napisany po polsku.
Procedura tworzenia pierwszej strony wygląda następująco:
1. Tworzenie strony rozpoczynamy z menu "Plik-> Nowy" lub ikony NOWY.
2. Dostajemy nową czystą kartę, na której możemy pisać nasz tekst.
3. Tekst formatujemy za pomocą menu stylów "Treść, Nagłówek,etc." dodatkowo możemy go pogrubić przyciskiem "B", pochylić przyciskiem "I" lub podkreślić przyciskiem "U".
4. Tekst możemy uformować w listę numerowaną lub punktowaną, na przykład wtedy, gdy chcemy coś wyliczyć lub wylistować lub ująć w grupę.
5. Menu kolor czcionki pozwala na zmianę koloru tekstu i jego tła.
6. Przygotowany tekst zapisujemy poleceniem Plik->Zapisz. W poleceniu należy podać tytuł bieżącej strony i pojawi się nam okno proszące o podanie miejsca zapisu i nazwy pliku.
Zostanie utworzony we wskazanym katalogu roboczym plik z rozszerzeniem nazwa_strony.html.

Nasz pierwszy dokument WWW jest już gotowy. Żeby go udoskonalać korzystać będziemy z polecenia "Plik->Otwórz" oraz "Plik->Zapisz".
Program edycyjny
3

Strona i podstrony

Tworzenie pierwszej strony możemy zacząć od wprowadzenia naszych tekstów. Teksty informacyjne służą do przekazania zawartości strony i informacji stanowiącej sens jej istnienia. Takie teksty są nieaktywne. Możemy również wprowadzić szereg innych funkcji takich, jak odnośniki na stronie, czyli kotwice przesuwające nas na stronie i odnośniki zewnętrzne, czyli elementy, które przekierują naszą przeglądarkę do innej strony, zarówno stanowiącej podstronę naszej strony, jak i odnośników całkowicie niezależnych innych stron.
Strona, aby wyglądać interesująco musi również posiadać elementy graficzne, tutaj wprowadziliśmy logo naszego programu z pliku zgromadzonego w katalogu strony "wstep.jpg".
Strona i podstrony
4

Obróbka grafiki

Źródłami grafiki na stronie są różnego rodzaju skany, zdjęcia, grafika generowana w programach wektorowych. Jako, że strona będzie wyświetlana w przeglądarce internetowej z ograniczoną rozdzielczością wszelkie elementy graficzne powinniśmy dostosować wielkością do potrzeb naszej strony.
Program WYSIWYG pozwala nam ocenić jakość grafiki i jej wielkość w trakcie tworzenia strony.
Szczególnie pomaga funkcja 'Podgląd', która wyświetla efekty naszej pracy w przeglądarce Internetowej.

Uwaga! W katalogu roboczym strony warto jest utworzyć podkatalog "img" i do niego wprowadzić wszystkie pliki zdjęć i tła z jakich będziemy korzystać podczas tworzenia strony.
Zmianę wielkości i jakości grafiki warto jednak wykonać w programie typu GIMP lub Photoshop przed wstawieniem w strukturę strony.
Obróbka grafiki
5

Potęga stron interentowych - odnośniki

Na jednej stronie możemy przekazać tylko ograniczoną ilość informacji. Do przeniesienia na następną stronę o rozwiniętej zawartości służą odnośniki hiperlinki. Co ciekawe wstawienie odnośnika możemy wykonać za pomocą tekstu lub grafiki, oznacza to że elementami aktywnymi strony mogą być podkreślone fragmenty tekstu lub intrygujące elementy graficzne.
Odnośnik może kierować nas zarówno do kolejnej podstrony naszego dokumentu lub do odnośnika zewnętrznego. Możemy na przykład zebrać listę ulubionych stron w sieci i skierować naszych gości do tej treści bezpośrednio z naszej strony.
Potęga stron interentowych - odnośniki
6

Czy strona będzie wyświetlana poprawnie

Do sprawdzenia i oczyszczenia kodu strony służy funkcja czyszczenie kodu.
Możemy dzięki temu uniknąć problemów z przełamywaniem strony, z pozostawieniem niezamkniętych tabel lub innych fragmentów kodu, co może się zdarzyć podczas wielokrotnej edycji zawartości naszej strony.
Czy strona będzie wyświetlana poprawnie
7

Żródła i materiały jak przenieść na serwer

Gotowy dokument naszej strony musi się znaleźć na serwerze. Aplikacja pozwala na bezpośrednią publikację naszej strony za pomocą usługi FTP. Po wybraniu miejsca lokalizacji naszej strony w Internecie musimy zapewnić parametry połączenia FTP wymagane przez naszego dostawcę usługi.
Teksty, obrazy, ilustracje i źródła strony zostaną przeniesione do miejsca na serwerze za pomocą przycisku "Publikuj". Taka administracja zasobami strony pozwala na sprawną aktualizację zawartości strony i zmiany jej zawartości. Projekt możemy nadal przechowywać w programie na naszym dysku i okresowo kiedy mamy taką potrzebę aktualizować stronę.
Żródła i materiały jak przenieść na serwer

Tagi

Oceń tę poradę

3.0
(2 glosow)
Twoja ocena:

Komentarze

Komentarze (1)

Zaloguj się, aby dodać komentarz.

G
Katarzyna Gromadzka 12 lat temu
fajna porada

Ta strona używa plików cookies

Używamy cookies, aby zapewnić prawidłowe działanie serwisu i analizować ruch na stronie. Polityka prywatności