Użytkownik: Hasło:

Nie masz konta? Zarejestruj się

Zarabianie na stronach www

Na początek

T-www-orzenie

Zarabianie na www

Ocena stron www

Własne forum na www

Różniste

Jak edytować strony www na domowym PC?

Potrzebne programy

DO tego celu potrzebne nam będą 2 programy - edytor html i serwer www, ...no i oczywiście przegladarka internetowa. Polecam "podglądanie" wyników edycji strony na trzech (njaczęściej używanych przez internautów) przeglądarkach - FireFox, IE i Opera. Dlaczego aż trzech? Dlatego, że wygląd strony moze się różnić na każdej z nich. Najwięcej problemów sprawia dostosowanie strony do IE. Nie można jedak zignorować tej przeglądarki, ponieważ w dalszym ciągu korzysta z niej ok. 15% internautów.

Zaczynamy: edycja stron internetowych

1. Odpalamy nasz serwer www .Opis jego instalacji i aktywacji znajdziesz w dziale: Instalacja serwera na PC.
2. Odpalamy też nasz edytor html - polecam kED. Link do jego pobrania znajdziesz w Narzędziowni.

Wszystkie strony przechowujemy w folderze www - w katalogu głównym gdzie mamy zainstalowany serwer Wamp. Domyślna ścieżka do tego folderu to: C:\wamp\www, ale jak już pisałem w innym dziale - zalecam instalację serwera na innej partycji niż systemowa. Właśnie w tym foledze (www) powinny znajdować się nasze wszystkie strony. Jeżeli mamy tylko jedną stronę - można tam wrzucić wszystkie pliki html, php, obrazki itp prosto do foldera www. Po wpisaniu w przeglądarce adresu localhost - przeglądarka znajdzie nasz plik strony głównej (index.html lub index.php) i automatycznie ją odpali.
Ja jednak zalecam umieszanie w folderze www folderu, który zwięźle opisuje nazwę naszej strony (np. automoto), a dopiero w nim umieszczenie wszystkich plików z których składa się ta strona. To pomaga w utrzymaniu porządku w przypadku gdy mamy kilka stron (serwisów) www.

3. W edytorze html - otwieramy plik strony (podstrony), którą chcemy edytować.
Po wprowadzeniu w niej zmianem - zapisujemy plik (Ctrl + S). Nastepnie wyświetlamy go w oknie przeglądarki internetowej. W tym celu wpisujemy w oknie adresu: localhost.
- Jeżeli w folderze .../wamp/www mamy pliki podstron w rozsypce - przeglądarka znajdzie plik strony głównej (index) i od razu wyświetli treść strony.
- Jeżeli zaś pliki te znajdują się w folderze - np. .../wamp/www/automoto - wyświetli się strona startowa serwera Wamp, a na niej zakładka Yuor projects, pod którą wyświetlone są nazwy wszystkich folderów znajdujących się w katalogu .../wamp/www. Klikając na któryś z nich przejdziemy do strony głównej znajdującej się w tym folderze.

Możemy też zamiast wpisywać w przeglądarce adres localhost - posłużyć sie ikonką serwera Wamp w zasobniku systemowym. Klikamy na niej lewym przyciskiem myszy i wybieramy z menu: Localhost. Program automatycznie otworzy domyślną przeglądarkę na stronie localhost.

zakładka localhost - serwer Wamp

Przechodzimy do strony którą edytowaliśmy i widzimy wprowadzone zmiany.

Teraz kiedy mamy już włączony serwer i edytor html - możemy wprowadzać dalsze zmiany. Po ich wprowadzeniu - za każdym razem zapisujemy edytowany plik strony, przełączamy się na przeglądarkę, odświeżamy stronę w przeglądarce i widzimy ją z wprowadzonymi zmianami.


Komentarze do tego artykułu (4)

Paulus (2008-09-27) Komentarz 1

40% korzysta z IE ???? Dobre !
Ja rozumiem że Firefox ma wiele ciekawych narzędzi , że Opera oferuje kilka ciekawych opcji ale do diaska ... produkt Microsoftu to 70-80% rynku ! Być może dane z których korzystaliście pochodzą od liczby pobrań Firefoxa bo z realiami nie mają niczego wspólnego .

Powiem tak : Nie jest trudno dopasować stronę do IE, trudno dopasować stronę stworzoną pod IE (która jest realnym standardem) do FF i Opery . Dzieje się tak za spawą futurystycznych pomysłów ludzi z W3C którzy niestety bujają w obłokach. XHTML miał być standardem ? Okazało się że został odrzucony przez internetową społeczność . Nie dziwię się sądząc choćby po samej wielkosci nagłówków .

Bądźmy rzetelni ! Taka ciekawa i ładna strona nie może siać propagandy . Bill Gates odszedł na emeryturę i być może nowy szef
nie poradzi sobie z utrzymaniem dominującej pozycji Microsoftu ale strzelanie z fajerwerków przed zwycięstwem nadweręża wiarygodność .

Dadam jeszcze jeden fakt : Opera i FF również różnie interpretują
wygląd stron /choćby różnice w wielkości czcionek / co dla mnie jest już całkowitym absurdem gdyż obie przeglądarki twierdzą iż są zgodne z W3C.

Tą bitwę wygrają narzędzia szybkie , tanie i najmniej obciążające systemy i cierpliwosć użytkowników . Google wydało Chrome/beta/ ale popełniono błąd korzystając z cieżkiego silnika Javy pozostawiając już w sferze dyskusji monitorowanie przez Google stron ogwiedzanych przez posiadaczy Chrome.

Demokracja użytkowników zwycieży.

pozdrawiam autorów serwisu . Bardzo czytelny , niemal wzorcowy przykład strony informacyjnej .

p.s. interesował mnie ranking hostingów . Rozbudowałbym go nieco .





www-4u.pl (2008-09-29) Komentarz 2

Dzięki Paulus za komentarz, jest w nim sporo racji. Jednak nie zgodzę się z Tobą, że Przeglądarka Microsoftu to 70 - 80% rynku (cokolwiek miałoby to oznaczać). Fakt, że każdy internauta korzystający z Windowsa - ma ją standardowo zaimplementowaną w systemie - nie oznacza, że ów internauta z niej korzysta.
Dane pochodzą ze statystyk jednego z moich serwisów (google, stat24). Wg nich, dokładnie w ostatnim miesiącu - na 78 454 odwiedzin:
Firefox / Windows - 52,06%
Internet Explorer / Windows - 27,83%
Opera / Windows - 18,01%
Chrome / Windows - 0,75%
...

Poza tym robiąc strony stosując standardowe techniki zgodne z WC3 - strony pod FF i Operą wyglądają tak jak zakładałem tworząc szablon css, "jazda" zaczyna się dopiero Pod IE - trzeba sporo kombinować, aby i w tej przeglądarce strona wyglądała jak powinna. Często trzeba uciekać się do różnych sztuczek (rozkładają validację, ale to szczegół), aby osiągnąć zakładany wygląd w przeglądarce Microsoftu.
PS
Na koniec taka ciekawostka - wielkość czcionki nigdy nie stanowiła problemu (raczej wielkość marginesów różnych elementów p, hr itp) aż do czasu pojawienia sie google chrome ;)

www-4u (2010-11-30) Komentarz 3

Internet Explorer coraz bardziej traci na popularności. Oto aktualne zestawienie (wg. Google Analytics - z 72000 odwiedzin):

- Firefox: 54,47%
- Opera: 15,86%
- IE: 15,07%
- Chrome: 13,35%
- Safari: 1,05%

WaDragon (2012-01-23) Komentarz 4

Długo używałem ked-a i nadal używam go do szybkiej edycji. Niedawno przerzuciłem się na "Aptana Studio 3"

Co posiada ?
Wsparcia dla kodowania w HTML, CSS, JavaScripcie, Rubym, PHP i Pythonie, z koloryzacją składni, autouzupełnianiem, podpowiedziami i informacjami o poziomie obsługi danych elementów w najważniejszych przeglądarkach. Obsługiwane są najnowsze specyfikacje HTML5, CSS3 i JavaScriptu.

Kreatora wdrożeń, który pozwala łatwo umieścić aplikacje na serwerze, po FTP, SFTP, FTPS i Capistrano, synchronizację kodu pomiędzy serwerem produkcyjnym i lokalnym, a także mechanizm automatycznego publikowania aplikacji RoR w chmurach Heroku i Engine Yard (szkoda, że nie ma takiego mechanizmu dla aplikacji PHP i chmur typu Orchestra.io – czekamy na wtyczkę).

Zintegrowanego debuggera dla Rubiego i JavaScriptu. Niestety obsługuje on tylko Firefoksa i Internet Explorera. Daje jednak wszystko, czego można oczekiwać od debuggera – w tym kontrolę wykonywania kodu czy sprawdzanie wartości zmiennych.

Integracji z Gitem, a przez opcjonalne wtyczki z SVN, CVS, Mercurialem i innymi systemami kontroli wersji. Pozwalać ma na pełną współpracę z członkami programistycznego zespołu i kontrolowanie repozytoriów.

Wbudowanego terminalu – nie trzeba już otwierać powłoki systemowej,by wydawać polecenia dla systemu operacyjnego.

Możliwości pełnej personalizacji IDE: Aptanę Studio można rozbudowywać przez własne skrypty, uzupełniające setki domyślnie dostępnych komend. Dodatkowo można konwertować istniejące pakiety programu TextMate, oraz importować jego skórki.

Walidacji kodu, za pomocą takich narzędzi jak HTML Tidy i JSLint, oraz walidatorów W3C.

Skomentuj ten artykuł (zadaj pytanie).

Twój Nick:

Numer komentarza na który odpowiadasz
Jeżeli nie odpowiadasz na konkretny komentarz pozostaw to pole puste.

Twój Komentarz: (Proszę, nie wstawiaj linków ani kodu HTML)

© copyright: www-4u.pl

powrót na górę strony