Cyfroteka.pl

klikaj i czytaj online

Cyfro
Czytomierz
00451 008299 10497469 na godz. na dobę w sumie
Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podręcznik - książka
Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podręcznik - książka
Autor: Liczba stron: 472
Wydawca: Helion Język publikacji: polski
ISBN: 83-246-0309-3 Data wydania:
Lektor:
Kategoria: ebooki >> komputery i informatyka >> webmasterstwo >> dreamweaver
Porównaj ceny (książka, ebook (-91%), audiobook).

Stwórz dynamiczne witryny WWW za pomocą nowoczesnego narzędzia

Macromedia Dreamweaver od dawna cieszy się uznaniem twórców witryn WWW. Główne przyczyny popularności to przyjazne i łatwe w obsłudze środowisko, możliwość ręcznej edycji kodu źródłowego, a przede wszystkim liczne narzędzia usprawniające pracę. Najnowsza wersja Dreamweavera, oznaczona symbolem 8, to jednak nie tylko edytor stron WWW -- to także rozbudowane narzędzie programistyczne, pozwalające na tworzenie aplikacji internetowych w językach PHP, ASP i ColdFusion. Osoby stawiające pierwsze kroki w projektowaniu dynamicznych witryn WWW docenią bogatą bibliotekę gotowych skryptów, zwanych behawiorami, a doświadczeni projektanci -- swobodę twórczą, jaką oferuje Dreamweaver.

Książka 'Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podręcznik' to podręcznik przedstawiający zasady tworzenia dynamicznych witryn WWW, przygotowany przez instruktorów certyfikowanych w firmie Macromedia. Wykonując zaproponowane ćwiczenia, zbudujesz witrynę WWW wykorzystującą wszystkie najnowsze technologie internetowe -- ostatnie specyfikacje HTML i CSS, języki PHP, ASP i ColdFusion oraz bazy danych. Dowiesz się, jak skonfigurować środowisko robocze, stworzyć wszystkie elementy witryny, opublikować ją na serwerze i przeprowadzić aktualizację.

Tchnij życie w statyczne strony WWW, wykorzystując Dreamweavera 8.

Znajdź podobne książki Ostatnio czytane w tej kategorii

Darmowy fragment publikacji:

IDZ DO IDZ DO PRZYK£ADOWY ROZDZIA£ PRZYK£ADOWY ROZDZIA£ SPIS TREœCI SPIS TREœCI KATALOG KSI¥¯EK KATALOG KSI¥¯EK KATALOG ONLINE KATALOG ONLINE ZAMÓW DRUKOWANY KATALOG ZAMÓW DRUKOWANY KATALOG TWÓJ KOSZYK TWÓJ KOSZYK Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podrêcznik Autor: Jeffrey Bardzell T³umaczenie: Leszek Sagalara (wstêp, rozdz. 1 – 8), Marcin Rogó¿ (rozdz. 9 – 15) ISBN: 83-246-0309-3 Tytu³ orygina³u: Macromedia Dreamweaver 8 with ASP, PHP and ColdFusion: Training from the Source Format: B5, stron: 472 DODAJ DO KOSZYKA DODAJ DO KOSZYKA Stwórz dynamiczne witryny WWW za pomoc¹ nowoczesnego narzêdzia CENNIK I INFORMACJE CENNIK I INFORMACJE ZAMÓW INFORMACJE ZAMÓW INFORMACJE O NOWOœCIACH O NOWOœCIACH ZAMÓW CENNIK ZAMÓW CENNIK CZYTELNIA CZYTELNIA FRAGMENTY KSI¥¯EK ONLINE FRAGMENTY KSI¥¯EK ONLINE Wydawnictwo Helion ul. Koœciuszki 1c 44-100 Gliwice tel. 032 230 98 63 e-mail: helion@helion.pl (cid:129) Skonfiguruj œrodowisko pracy i zainstaluj serwer WWW (cid:129) Wykorzystaj mo¿liwoœci jêzyków ASP, PHP i ColdFusion (cid:129) Zastosuj jêzyk SQL do przetwarzania danych Macromedia Dreamweaver od dawna cieszy siê uznaniem twórców witryn WWW. G³ówne przyczyny popularnoœci to przyjazne i ³atwe w obs³udze œrodowisko, mo¿liwoœæ rêcznej edycji kodu Ÿród³owego, a przede wszystkim liczne narzêdzia usprawniaj¹ce pracê. Najnowsza wersja Dreamweavera, oznaczona symbolem 8, to jednak nie tylko edytor stron WWW — to tak¿e rozbudowane narzêdzie programistyczne, pozwalaj¹ce na tworzenie aplikacji internetowych w jêzykach PHP, ASP i ColdFusion. Osoby stawiaj¹ce pierwsze kroki w projektowaniu dynamicznych witryn WWW doceni¹ bogat¹ bibliotekê gotowych skryptów, zwanych behawiorami, a doœwiadczeni projektanci — swobodê twórcz¹, jak¹ oferuje Dreamweaver. Ksi¹¿ka „Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podrêcznik” to podrêcznik przedstawiaj¹cy zasady tworzenia dynamicznych witryn WWW, przygotowany przez instruktorów certyfikowanych w firmie Macromedia. Wykonuj¹c zaproponowane æwiczenia, zbudujesz witrynê WWW wykorzystuj¹c¹ wszystkie najnowsze technologie internetowe — ostatnie specyfikacje HTML i CSS, jêzyki PHP, ASP i ColdFusion oraz bazy danych. Dowiesz siê, jak skonfigurowaæ œrodowisko robocze, stworzyæ wszystkie elementy witryny, opublikowaæ j¹ na serwerze i przeprowadziæ aktualizacjê. (cid:129) Definiowanie stylów CSS dla statycznej witryny (cid:129) Konfiguracja serwera WWW na lokalnym komputerze (cid:129) Przekazywanie danych miêdzy stronami witryny (cid:129) Obs³uga formularzy na stronach WWW (cid:129) Po³¹czenie serwisu WWW z baz¹ danych (cid:129) Dynamiczne generowanie menu i list rozwijanych (cid:129) Wyszukiwanie i filtrowanie danych (cid:129) Obs³uga logowania u¿ytkowników (cid:129) Tworzenie mechanizmów zarz¹dzania treœci¹ witryny Tchnij ¿ycie w statyczne strony WWW, wykorzystuj¹c Dreamweavera 8 Wstęp .................................................................................................................................................................................................. 11 Lekcja 1. Przedstawiamy Newland Tours ........................................................................................................................... 21 Czego się nauczymy? ................................................................................................................................................. 23 Przewidywany czas .................................................................................................................................................... 23 Pliki lekcji ................................................................................................................................................................... 23 Definiowanie statycznej witryny .............................................................................................................................24 Tworzenie strony „Kontakt z nami” ......................................................................................................................29 Formatowanie strony „Kontakt z nami” ............................................................................................................... 33 Ocena witryny: kod ...................................................................................................................................................42 Ocena witryny: procesy biznesowe ......................................................................................................................... 45 Widoki na przyszłość ................................................................................................................................................ 51 Czego się nauczyliśmy? ............................................................................................................................................. 54 Lekcja 2. Przygotowanie statycznych stron HTML i CSS ............................................................................................... 55 Czego się nauczymy? ................................................................................................................................................. 56 Przewidywany czas .................................................................................................................................................... 56 Pliki lekcji ................................................................................................................................................................... 56 Automatyzowanie zmian za pomocą funkcji Find and Replace ........................................................................ 57 Przedefiniowanie wyglądu elementów HTML za pomocą CSS .......................................................................... 63 Tworzenie i stosowanie własnych stylów CSS .......................................................................................................70 Tworzenie szablonu do wielokrotnego użytku .....................................................................................................77 Zwiększanie dostępności za pomocą niewidocznej nawigacji ............................................................................79 Czego się nauczyliśmy? ............................................................................................................................................. 83 Lekcja 3. Dynamiczne witryny WWW ................................................................................................................................... 85 Czego się nauczymy? ................................................................................................................................................. 86 Przewidywany czas .................................................................................................................................................... 86 Pliki lekcji ................................................................................................................................................................... 86 Podstawy dynamicznych witryn WWW .................................................................................................................87 Wybór technologii serwerowych .............................................................................................................................90 Zmiana witryny Newland Tours na witrynę dynamiczną ................................................................................... 93 Praca na serwerze lokalnym .....................................................................................................................................94 Konfigurowanie środowiska lokalnego dla IIS/ASP ............................................................................................94 Konfigurowanie środowiska lokalnego dla ColdFusion ..................................................................................... 96 Konfigurowanie środowiska lokalnego dla Apache/PHP ...................................................................................99 Praca na serwerze zdalnym ......................................................................................................................................113 Definiowanie witryny dynamicznej w programie Dreamweaver (wszyscy użytkownicy) ..............................114 Budujemy prostą aplikację dynamiczną ...............................................................................................................119 Czego się nauczyliśmy? ........................................................................................................................................... 129 Lekcja 4. Przesyłanie danych między stronami ............................................................................................................ 131 Czego się nauczymy? ............................................................................................................................................... 132 Przewidywany czas ...................................................................................................................................................133 Pliki lekcji ..................................................................................................................................................................133 Poznajemy protokół HTTP .....................................................................................................................................133 Pobieranie danych z adresu URL .......................................................................................................................... 135 Wysyłanie danych za pomocą odnośników ..........................................................................................................141 Umieszczanie i odczytywanie cookies .................................................................................................................. 145 Czego się nauczyliśmy? ............................................................................................................................................151 Lekcja 5. Wysyłanie wiadomości e-mail z formularza WWW ................................................................................. 153 Czego się nauczymy? ............................................................................................................................................... 154 Przewidywany czas .................................................................................................................................................. 154 Pliki lekcji ................................................................................................................................................................. 155 Wprowadzenie do usługi pocztowej SMTP ......................................................................................................... 155 Konfigurowanie systemu w celu wysyłania wiadomości e-mail przez SMTP ................................................. 155 Konfigurowanie serwera IIS w celu wysyłania wiadomości e-mail (użytkownicy ASP) ................................. 156 Konfigurowanie ColdFusion w celu wysyłania wiadomości e-mail ................................................................. 158 Pisanie kodu wysyłającego wiadomości ................................................................................................................ 160 Obiekty, metody i właściwości .............................................................................................................................. 160 Tworzenie formularzy WWW ............................................................................................................................... 167 Wysyłanie wartości formularza przez e-mail ....................................................................................................... 170 Walidacja formularza po stronie klienta ............................................................................................................. 173 Czego się nauczyliśmy? ........................................................................................................................................... 176 Lekcja 6. Budujemy kalkulator cen wycieczek ............................................................................................................. 177 Czego się nauczymy? ............................................................................................................................................... 178 Przewidywany czas .................................................................................................................................................. 178 Pliki lekcji ................................................................................................................................................................. 178 Utworzenie strony ................................................................................................................................................... 179 6 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Budujemy formularz ...............................................................................................................................................181 Zbieranie, przetwarzanie i wyświetlanie danych ................................................................................................. 184 Walidacja po stronie serwera ..................................................................................................................................191 Tworzenie obszarów warunkowych ...................................................................................................................... 194 Tworzenie i zastosowanie własnej klasy CSS ....................................................................................................... 197 Czego się nauczyliśmy? ...........................................................................................................................................200 Lekcja 7. Bazy danych w WWW ............................................................................................................................................ 201 Czego się nauczymy? ...............................................................................................................................................202 Pliki lekcji .................................................................................................................................................................202 Przyspieszony kurs obsługi baz danych ...............................................................................................................203 Wprowadzenie do obiektów związanych z bazami danych ..............................................................................203 Relacje .......................................................................................................................................................................206 Bazy danych w sieci WWW ....................................................................................................................................208 Bezpieczeństwo baz danych a WWW ................................................................................................................... 210 Instalacja i uruchomienie MySQL .........................................................................................................................211 Instalacja i uruchomienie MySQL w OS X .......................................................................................................... 215 Instalacja bazy danych Newland na serwerze zdalnym ...................................................................................... 219 Przegląd bazy danych Newland .............................................................................................................................220 Nawiązywanie połączenia z bazą danych .............................................................................................................224 Pobieranie zestawu rekordów i wyświetlanie informacji z bazy danych .......................................................... 233 Czego się nauczyliśmy? ...........................................................................................................................................238 Lekcja 8. Kalkulator cen — ciąg dalszy .......................................................................................................................... 239 Czego się nauczymy? ...............................................................................................................................................240 Przewidywany czas ..................................................................................................................................................240 Pliki lekcji .................................................................................................................................................................240 Menu rozwijane wypełniane dynamicznie .......................................................................................................... 241 Filtrowanie zestawów rekordów ............................................................................................................................247 Skrypt korzystający z prawdziwych danych .........................................................................................................249 Dokumentowanie kodu za pomocą komentarzy ............................................................................................... 253 Czego się nauczyliśmy? ...........................................................................................................................................257 Lekcja 9. Filtrowanie i wyświetlanie danych .................................................................................................................. 259 Czego się nauczymy? ...............................................................................................................................................260 Przewidywany czas ..................................................................................................................................................260 Pliki lekcji ................................................................................................................................................................. 261 Tworzenie strony pobierającej dane od użytkownika ........................................................................................ 261 Dynamiczne generowanie adresów URL ............................................................................................................. 263 Przygotowanie strony z wynikami ........................................................................................................................272 SPIS TREŚCI 7 Wstawianie dynamicznej zawartości strony ........................................................................................................274 Dynamiczne wyświetlanie obrazów i formatowanie liczby ludności ..............................................................276 Pobieranie danych z tabel zewnętrznych przy użyciu SQL ............................................................................... 281 Czego się nauczyliśmy? ...........................................................................................................................................286 Lekcja 10. Tworzenie strony zawierającej opisy wyjazdów ................................................................................... 287 Czego się nauczymy? ...............................................................................................................................................288 Przewidywany czas ..................................................................................................................................................289 Pliki lekcji .................................................................................................................................................................289 Planowanie aplikacji ...............................................................................................................................................289 Tworzenie zestawów rekordów za pomocą operatora JOIN .............................................................................292 Tworzenie opisów wyjazdów .................................................................................................................................297 Wstawianie obrazów i atrybutów alt .....................................................................................................................302 Implementowanie stronicowania zestawu rekordów .........................................................................................304 Przesyłanie danych do innych aplikacji ...............................................................................................................309 Czego się nauczyliśmy? ........................................................................................................................................... 316 Lekcja 11. Budowanie interfejsów wyszukiwania ....................................................................................................... 317 Czego się nauczymy? ............................................................................................................................................... 318 Przewidywany czas .................................................................................................................................................. 318 Pliki lekcji ................................................................................................................................................................. 318 Przygotowywanie strony wyszukiwania i tworzenie odnośnika „Wyszukaj wszystkie” ................................ 319 Wyszukiwanie według rejonu świata — tworzenie interfejsów .........................................................................322 Poprawianie zapytania SQL oraz używanie komentarzy do kodu w celu testowania i usuwania błędów ..328 Kontrolowanie wyświetlania paska nawigacji ..................................................................................................... 334 Wyszukiwanie według kraju — filtrowanie względem wartości pola formularza .......................................... 337 Wybór zapytania SQL w zależności od przekazanych danych ......................................................................... 343 Czego się nauczyliśmy? ...........................................................................................................................................347 Lekcja 12. Uwierzytelnianie użytkowników ................................................................................................................... 349 Czego się nauczymy? ............................................................................................................................................... 350 Przewidywany czas .................................................................................................................................................. 350 Pliki lekcji ................................................................................................................................................................. 351 Uwierzytelnianie użytkowników jako aplikacja sieci Web ................................................................................ 351 Tworzenie strony rejestracji ................................................................................................................................... 354 Tworzenie strony logowania .................................................................................................................................. 360 Tworzenie Application.cfm (tylko ColdFusion) ................................................................................................. 365 Ograniczanie dostępu do stron.............................................................................................................................. 366 Czego się nauczyliśmy?............................................................................................................................................ 369 8 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Lekcja 13. Zarządzanie treścią za pomocą formularzy ............................................................................................. 371 Czego się nauczymy? ............................................................................................................................................... 373 Przewidywany czas .................................................................................................................................................. 373 Pliki lekcji ................................................................................................................................................................. 373 Tworzenie części administracyjnej ........................................................................................................................374 Dwa podejścia do formatowania zawartości przechowywanej w bazie danych ..............................................377 Tworzenie formularza ............................................................................................................................................378 Zmienne sesji i ukryte pola wykorzystywane do śledzenia użytkowników .....................................................382 Wstawianie rekordu ................................................................................................................................................ 383 Czego się nauczyliśmy? ...........................................................................................................................................387 Lekcja 14. Tworzenie stron aktualizujących dane ...................................................................................................... 389 Czego się nauczymy? ...............................................................................................................................................390 Przewidywany czas .................................................................................................................................................. 391 Pliki lekcji ................................................................................................................................................................. 391 Przygotowywanie stron ........................................................................................................................................... 391 Planowanie stron Master-Detail ............................................................................................................................392 Wprowadzenie aktualizacji na stronie szczegółowej ..........................................................................................400 Czego się nauczyliśmy? ...........................................................................................................................................409 Lekcja 15. Kodowanie prostego systemu zarządzania treścią (CMS) ............................................................... 411 Czego się nauczymy? ............................................................................................................................................... 412 Przewidywany czas .................................................................................................................................................. 413 Pliki lekcji ................................................................................................................................................................. 413 Przygotowywanie systemu zarządzania treścią (CMS) ....................................................................................... 413 Tworzenie formularza i wpisywanie kodu zestawu rekordów .......................................................................... 417 Umożliwienie wstawiania rekordów .....................................................................................................................426 Tworzenie strony ogólnej .......................................................................................................................................430 Tworzenie strony szczegółowej do aktualizowania rekordów .......................................................................... 436 Dodawanie funkcji aktualizującej .........................................................................................................................445 Usuwanie rekordów ................................................................................................................................................449 Co dalej? ...................................................................................................................................................................452 Czego się nauczyliśmy? ...........................................................................................................................................452 Skorowidz ...................................................................................................................................................................................... 453 SPIS TREŚCI 9 W porównaniu do innych środków przekazu takich jak radio czy telewizja internet jest medium stosunkowo młodym. Jak wszystkie nowe formy przekazu, ulega on nieustannym zmianom. Zmiany takie często oznaczają, że założona witryna WWW wymaga przeróbki. Wiele organizacji zastępuje atrakcyjne w wyglądzie witryny (które jednak nie mają wiele do zaoferowania, poza samą statyczną obecnością w internecie) witrynami interaktywnymi, które przekazują informacje, za- pewniają rozrywkę, sprzedają produkty, organizują społeczności itd. Strona domowa Newland Tours wygląda dość dobrze, lecz pewne jej części, np. kolumna Dziennik podróżnika (po prawej) wymaga jeszcze dopracowania Dzisiejsi projektanci i twórcy stron WWW wciąż stają przed nowymi problemami, różniącymi się od tych, które można było spotkać kilka lat temu. ² Zamiast tworzyć całkiem nowe witryny, projektanci i twórcy stają przed koniecznością utrzymywania istniejących witryn w obliczu zmieniających się standardów, nowych technologii i rozwoju zawartości. ² Nowoczesne witryny WWW powinny odpowiadać potrzebom użytkownika, co często oznacza, że strony WWW muszą „w locie” reagować na działania użytkownika. ² Obecne witryny WWW służą już nie tylko do jednorazowych interakcji pomiędzy pojedynczym użytkownikiem a organizacją; wiele z nich pełni rolę przestrzeni dla wirtualnych społeczności, np. newgrounds.com (amatorscy twórcy w technologii Flash), dailykos.com (społeczność zainteresowana polityką) czy whatifsports.com (społeczność sportów wirtualnych). ² Współcześni projektanci i twórcy często muszą budować systemy zarządzania treścią i jej obiegiem wewnątrz witryny, które pozwalają przenieść zadania związane z zarządzaniem treścią witryny z działów informatycznych do użytkowników nietechnicznych przez stworzenie formularzy WWW służących do dodawania informacji na stronę. Takie wymagania wywołują szereg konkretnych pytań. W jaki sposób można najszybciej zaktuali- zować wygląd witryny lub jej strukturę? W jaki sposób tak zaprojektować witrynę, aby specjalista od treści (nieposiadający umiejętności technicznych) mógł ją współtworzyć? Jak stworzyć witrynę, która dostosowywałaby się do potrzeb i zainteresowań użytkownika? Jak kształtować społeczność z osób odwiedzających witrynę? I w końcu, jak osiągnąć te cele jednocześnie? Między innymi w odpowiedzi na te kwestie pojawiła się cała seria nowinek technologicznych, sta- nowiących rozwiązanie problemów w tworzeniu stron WWW, takich jak kaskadowe arkusze sty- lów (cascading style sheets, CSS), Macromedia ColdFusion, ASP, SQL, serwery baz danych, XHTML, DHTML, XML, usługi WWW, ADO, CDO, JavaScript, Flash, PHP, Java, .NET, XSLT itp. Pro- gramy do tworzenia witryn WWW, takie jak Macromedia Dreamweaver 8, starały się dotrzymać kroku tak, aby ich użytkownicy byli w stanie tworzyć witryny z użyciem każdej z wymienionych technologii. Jednak dawnym specjalistom w zakresie języka HTML taki nawał rozwiązań tech- nicznych sprawił tyle samo kłopotów, co problemy, które miały być dzięki nim rozwiązane. Opanowanie wielu spośród tych technologii staje się częścią niezbędnego arsenału umiejętności dzisiejszych twórców stron WWW. Celem tej książki jest zapewnienie dobrego przygotowania na drodze do ich biegłego opanowania. Głównym zadaniem będzie przekształcenie statycznej witryny WWW w witrynę interaktywną, łatwą w zarządzaniu i — przede wszystkim — zgodną ze standardami. Oprócz tego, użytkownicy zarządzający witryną, a nieposiadający umiejętności technicznych, będą w stanie ją aktualizować bez żadnej znajomości języka HTML. Są to ambitne, lecz osiągalne cele. Dzięki narzędziom i środowisku Dreamweaver będą one łatwiejsze do zdobycia, niż sądzicie. W tej lekcji poznamy punkty wyjściowy i końcowy książki. Otworzymy aktualnie istniejącą stronę, utworzoną bez wykorzystania programu Dreamweaver. Pierwszym zadaniem będzie utworzenie nowej strony. Wyobraźmy sobie, że przed przystąpieniem do przebudowy witryny klient wymaga od nas natychmiastowego utworzenia brakującej strony. Gdy już sobie z tym poradzimy, zajmiemy się niedostatkami witryny. Mankamenty te możemy podzielić na dwie kategorie: niedociągnięcia techniczne, takie jak problemy z dostępnością i niewykorzystane możliwości poprawienia wyglądu strony, oraz problemy biznesowe, występujące w sytuacji gdy witryna nie spełnia postawionych przed nią zadań. Na koniec sprawdzimy, jak wygląda w internecie końcowa wersja witryny. 22 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Czego się nauczymy? W czasie tej lekcji: ² zdefiniujemy statyczną witrynę w programie Dreamweaver, ² zaczniemy pracować w środowisku programu Dreamweaver, tworząc i zapełniając nową stronę treścią, ² skorzystamy z okna dialogowego Find and Replace (Znajdź i zamień) aby w zautomatyzowany sposób uzupełnić witrynę o opcje zwiększające dostępność, ² zbadamy istniejący kod HTML, ² poznamy potrzeby klienta, ² poznamy ukończony projekt w formie, jaką przyjmie pod koniec książki, ² nakreślimy strategię aktualizacji witryny. Przewidywany czas Ukończenie tej lekcji zajmie około 60 minut. Pliki lekcji Pliki wyjściowe: Lekcja01/Start/newland/about.htm Lekcja01/Start/newland/contact_text.txt Lekcja01/Start/newland/index.htm Lekcja01/Start/newland/profiles.htm Lekcja01/Start/newland/tours.htm Pliki końcowe: Lekcja01/Start/newland/contact.htm LEKCJA 1. Przedstawiamy Newland Tours 23 Definiowanie statycznej witryny Witryna Newland Tours, na której będziemy pracować, jest witryną statyczną. Dlatego też możemy śmiało wczytać ją do programu Dreamweaver i przystąpić do pracy. Praca z witrynami WWW często wymaga setek, a nawet tysięcy plików. Składają się na nie strony WWW, grafiki, kaskadowe arkusze stylów, zasoby multimedialne itp. Pliki te powiązane są ze sobą za pomocą HTML. Niestety, mała literówka podczas wpisywania może wywołać nieprzyjemny (lub nieczytelny dla użytkownika) komunikat o błędzie, a nawet zablokować dostęp do części na- szej witryny. Dreamweaver dostarcza wiele wyrafinowanych narzędzi do zarządzania witryną, po- magających utrzymać integralność naszej witryny, zarówno na etapie tworzenia, jak i po jej uru- chomieniu. Aby skorzystać z tych opcji, należy najpierw zdefiniować witrynę. Jest to proces, w którym wymagane jest (jako minimum) wskazanie głównego folderu witryny na naszym dysku twardym. Definiowanie witryny niesie ze sobą korzyści, z których wiele za chwilę zobaczymy. Zapobiega powstawaniu błędnych odnośników, automatycznie aktualizując pliki należące do witryny w razie ich przeniesienia lub zmiany nazwy. Site Manager (Menadżer witryny) umożliwia wykonywanie dzia- łań na całej witrynie, takich jak np. Find and Replace, co znacznie zwiększa wydajność. Inną zasadni- czą korzyścią, jaką daje Site Manager, jest to, że posiada on wbudowaną zdolność przesyłania plików (także za pomocą FTP), co oznacza, że możemy publikować nasze pliki, kiedy chcemy, za pomocą jednego naciśnięcia klawisza. Możemy nawet synchronizować ze sobą pliki lokalne (położone na naszym dysku twardym) i zdalne (umieszczone w internecie lub na udostępnionym publicznie serwerze), aby mieć pewność, że najnowsze wersje plików znajdują się na właściwym miejscu. W tym zadaniu w oknie dialogowym Site Definition (Definicja witryny) zdefiniujemy zwykłą, statyczną witrynę. Wymaga to jedynie podania jej nazwy i wskazania położenia na dysku twardym. Po kilku lekcjach, gdy poczynimy już odpowiednie przygotowania, wrócimy do tego okna dialogowego i zde- finiujemy witrynę dynamiczną. Definiowanie witryny dynamicznej wymaga nieco więcej zabiegów (te dodatkowe czynności nie dadzą nam żadnych korzyści na tak wczesnym etapie). Na szczęście, zawsze możemy zmienić definicję witryny, więc nic nie stracimy, jeśli zdefiniujemy na razie witrynę statyczną i przystąpimy od razu do pracy. 1. Utwórz na dysku twardym katalog o nazwie dwa08. W tym folderze przechowywana będzie lokalna kopia witryny. 2. Do nowo utworzonego katalogu skopiuj folder newland (wraz z zawartością), znajdujący się w folderze Lekcja01/Start. W praktyce często możemy spotkać się z zadaniem poprawienia już istniejącej witryny. W przypadku wprowadzania znaczących zmian najlepiej będzie skopiować istniejącą witryną i pracować na jej kopii. Nie należy nigdy dokonywać edycji udostępnionej (tj. widocznej dla ogółu) wersji strony. 3. Uruchom program Dreamweaver 8. 24 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Po wczytaniu plików do programu Dreamweaver należy je edytować wyłącznie w tym programie. Pliki HTML można otworzyć w każdym edytorze tekstowym, a każdy system operacyjny wyposażony jest w program do zarządzania plikami (np. Macintosh Finder czy Eksplorator Windows), który umożliwia przenoszenie plików i ich usuwanie. Powinniśmy jednak unikać korzystania z tych narzędzi, gdyż każda zmiana może zmylić program Dreamweaver i spowodować powstawanie błędnych odnośników. Skoro więc pliki są już na właściwym miejscu, przechodzimy do programu Dreamweaver i starajmy się uniknąć pokusy dokonywania na nich operacji w jakikolwiek inny sposób. 4. Z głównego okna programu wybierz polecenie Create New Dreamweaver Site (Utwórz nową witrynę w programie Dreamweaver). Możesz też wybrać z menu polecenie Site (Witryna) Manage Sites (Zarządzaj witrynami) i kliknąć przycisk New (Nowa). Choć pliki są już na naszym dysku twardym, Dreamweaver jeszcze ich nie widzi. Dopiero zdefiniowanie witryny umożliwi programowi odnalezienie tych plików i zarządzanie nimi. Witrynę definiujemy w oknie dialogowym Site Definition. Jeśli zobaczymy okno dialogowe wyglądające inaczej niż przedstawione na rysunku, prawdopodobnie oznacza to, że znajdujemy się w trybie zaawansowanym. Kliknijmy zakładkę Basic (Tryb prosty), aby przywrócić tryb widoku prostego przedstawionego na rysunku. LEKCJA 1. Przedstawiamy Newland Tours 25 5. Wpisz Newland Tours w pierwsze pole na ekranie, a następnie kliknij Next (Dalej). Tryb widoku prostego okna dialogowego Site Definition działa na zasadzie kreatora. Jeśli wolisz dawny styl okna dialogowego Site Definition, możesz uzyskać do niego dostęp przez kliknięcie zakładki Advanced (Tryb zaawansowany). 6. W oknie Editing Files, Part 2 (Edycja plików, część 2) wybierz opcję No, I do not want to use a server technology. (Nie, nie chcę korzystać z technologii serwerowych), a następnie kliknij przycisk Next. Nieco dalej w książce będziemy korzystać z technologii serwerowych, ale wybierając teraz odpowiedź No, pominiemy kilka skomplikowanych kroków. 7. W następnym ekranie wybierz pierwszą opcję, Edit local copies on my machine, then upload to server when ready (recommended) (Edytuj lokalne kopie plików na moim komputerze, a po ich przygotowaniu prześlij je na serwer zalecane ). Dzięki takiej decyzji zawsze będziemy posiadać dwa zestawy plików witryny — jeden lokalny (zwykle na naszym dysku twardym, choć możemy też umieścić je w folderze sieciowym) i jeden zdalny (zazwyczaj na serwerze). Jest to bezpieczniejsze, ponieważ zawsze będziemy mieć co najmniej jedną kopię naszych plików, i — co ważniejsze — oznacza to, że pliki, nad którymi będziemy pracować, przechowywane będą na dysku twardym, gdzie nie będą widoczne dla innych. 26 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Większość profesjonalnych witryn działa w na trzech poziomach. Lokalna witryna zawiera wszystkie pliki tworzone przez użytkownika programu Dreamweaver na dysku twardym. Serwer testowy zawiera kopię witryny służącą wyłącznie do testowania i rozwijania. Zawartość serwera testowego nie jest widoczna dla ogółu, ale jest to rzeczywiste środowisko serwera WWW, które jest zwykle identyczne lub prawie identyczne ze środowiskiem serwera eksploatacyjnego. Serwer eksploatacyjny jest publiczną wersją witryny. Powinny być na nim publikowane jedynie pliki przetestowane, zredagowane, dopracowane i zatwierdzone. 8. Kliknij ikonę folderu obok pola Where on your computer do you want to store your files? (Gdzie w komputerze chcesz przechowywać swoje pliki?) i wskaż folder newland znajdujący się w folderze dwda08. Kliknij Otwórz, aby wybrać folder, a następnie Zapisz, aby powrócić do okna dialogowego Site Definition. W tym kroku definiujemy witrynę lokalną — tu będą miały miejsce wszystkie nasze działania. Gdy dokonamy edycji pliku, zmiany będą widoczne tylko tutaj. Oznacza to, że jeżeli podczas pracy chwilowo naruszymy funkcjonalność witryny, nie wyrządzimy żadnych szkód. 9. W kolejnym ekranie wybierz z menu rozwijanego pozycję None (Brak). Normalnie jako witrynę zdalną wskazuje się tu serwer testowy lub serwer eksploatacyjny. Serwer testowy jest niezbędny, gdy pracujemy na zawartości ulegającej zmianom, opartej na bazie danych. LEKCJA 1. Przedstawiamy Newland Tours 27 Dalej w tej książce zdefiniujemy witrynę zdalną, której użyjemy w charakterze serwera testowego. Serwer ten będzie w stanie obsłużyć w pełni dynamiczne witryny, z którymi — jak się wkrótce przekonamy — nie poradzi sobie zdefiniowany przez nas serwer lokalny. Na razie jednak zdalny serwer stanowiłby niepotrzebną komplikację. Witryna, którą budujemy w tej książce, nie posiada serwera eksploatacyjnego, gdyż Newland Tours jest firmą fikcyjną. 10. Kliknij przycisk Next. Przejrzyj podsumowanie i kliknij Done (Gotowe). Na zakończenie pojawi się okno dialogowe wskazujące, że Dreamweaver tworzy bufor podręczny witryny. Program analizuje wszystkie pliki w witrynie, sprawdzając wszystkie łączące je odnośniki, po czym przechowuje je w pamięci. Jeśli zdecydujemy się zmienić nazwę strony lub przenieść jakiś zasób do innego folderu, Dreamweaver automatycznie tak zaktualizuje wszystkie pliki, aby odnośniki wskazywały na zmodyfikowany plik. Po utworzeniu bufora podręcznego okno dialogowe zniknie samoczynnie. W palecie Files (domyślnie znajduje się ona w prawej dolnej części ekranu) powinna teraz pojawić się lista plików. 28 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Tworzenie strony „Kontakt z nami” Jak to często bywa w przypadku projektów WWW, zanim przystąpimy do przeglądu witryny New- land Tours, musimy zająć się bardziej palącą potrzebą: zniknęła strona contact.htm i trzeba ją odtworzyć. Ćwiczenie to ma służyć jako szybki kurs podstaw tworzenia i edycji stron WWW. Jeśli potrafisz już tworzyć statyczne strony w programie Dreamweaver, możesz je pominąć — ostateczny rezultat znajduje się na płycie CD w folderze Complete tego rozdziału, podobnie jak foldery Start dla następ- nych rozdziałów. Jeśli zrezygnujesz z tego ćwiczenia, rozpocznij czytanie nieco dalej, od podroz- działu „Ocena witryny: kod”. Jedynym celem tego ćwiczenia jest prezentacja podstaw pracy w środowisku programu Dreamwe- aver. Nie jest ono obszernym przewodnikiem tworzenia statycznych witryn WWW przy użyciu tego programu. Do tego celu służą książki Macromedia Dreamweaver 8: Training From the Source (Macrome- dia Press) lub Macromedia Dreamweaver 8: Visual Quickstart Guide (Macromedia Press/Peachpit). 1. W palecie Files (Pliki) kliknij dwukrotnie pozycję contact_text.txt, aby otworzyć ten plik w programie Dreamweaver. Jeśli paleta Files jest niewidoczna, wybierz z menu Window (Okno) Files, aby wyświetlić plik. Jak można się domyślić po jego zawartości, plik ten zawiera tekst, który ma się znaleźć na stronie „Kontakt z nami”. Jest to zwykły plik tekstowy, a nie dokument HTML. Nie zawiera on żadnych znaczników HTML i choć w programie Dreamweaver plik ten wygląda na sformatowany, to gdybyśmy otworzyli go w przeglądarce internetowej, całe formatowanie zostałoby utracone, a plik wyświetliłby się w postaci pojedynczego, dużego bloku (pod warunkiem, że wcześniej zmienilibyśmy jego rozszerzenie na .htm lub .html). Dzieje się tak dlatego, że przeglądarki ignorują puste znaki — znaki akapitu, spacje (poza pierwszym znakiem spacji służącym do oddzielania wyrazów) oraz znaki tabulatora. Aby podzielić tekst na poszczególne linie czy akapity na stronie wyświetlanej w przeglądarce, należy użyć znaczników HTML, LEKCJA 1. Przedstawiamy Newland Tours 29 takich jak znacznik akapitu ( p ). W następnych kilku krokach utworzymy kopię istniejącej w witrynie strony (about.htm), zastąpimy jej zawartość zawartością tego pliku, formatując go za pomocą znaczników HTML, po czym zapiszemy stronę jako contact.htm. Proszę zwrócić uwagę, że na pasku narzędziowym View (Widok) wybrany jest przycisk Code (Kod), a dwa następne przyciski, Split (Podział) i Design (Projekt), są nieaktywne. Ponieważ dokument ten nie posiada żadnych znaczników HTML, Dreamweaver nie może go otworzyć w widoku projektu. W książce tej często będziemy się przełączać pomiędzy widokiem kodu a widokiem projektu. 2. Kliknij gdziekolwiek tekst i wybierz z menu Edit (Edycja) Select All (Zaznacz wszystko), następnie wybierz Edit Copy (Kopiuj), aby skopiować tekst do schowka. Tekst jest już gotowy do umieszczenia w dokumencie docelowym — tylko nie mamy jeszcze dokumentu docelowego. 3. W palecie Files kliknij dwukrotnie plik about.htm, aby go otworzyć. Jeśli to konieczne, kliknij przycisk Design, aby zobaczyć wygenerowaną stronę zamiast jej kodu. Strona ta posłuży nam jako szablon do tworzenia nowych stron. 4. Wybierz File (Plik) Save As (Zapisz jako) i nazwij plik contact.htm. Mamy zamiar zmodyfikować istniejącą wersję strony about.htm. Aby upewnić się, że nie nadpiszemy oryginalnej wersji pliku, tworzymy jego kopię za pomocą opcji Save As i nadajemy mu nową nazwę. Każda ze stron posiada na pasku nawigacyjnym przycisk o nazwie Kontakt z nami. Kliknięcie tego przycisku powoduje wczytanie strony contact.htm, która do tej pory nie istniała. 30 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik 5. Za pomocą myszy zaznacz wszystko od słów O firmie aż do końca strony, łącznie z opisem rysunku. Naciśnij klawisz Delete. Jest to treść którą do tej pory zawierał plik about.htm. Zastąpimy ją zawartością schowka. Po naciśnięciu klawisza Delete zauważymy, że usunięty został również wstawiony do tekstu rysunek. 6. Przy migającym kursorze w głównym (teraz pustym) obszarze zawartości strony przełącz się na jednoczesny widok kodu i projektu (zwanym dalej widokiem dzielonym), klikając przycisk Split (Podział). Pracując w obu trybach równolegle, możemy projektować stronę wizualnie i sprawdzać jednocześnie, czy Dreamweaver wprowadza taki kod, jakiego oczekujemy. Zwróćmy uwagę, że w widoku kodu kursor położony jest wewnątrz znacznika h1 . Znaczniki te nakazują przeglądarce wyświetlanie objętej nimi zawartości w formie nagłówka stopnia pierwszego. Poniżej okna dokumentu, w palecie Properties (Właściwości) widzimy, że menu rozwijane Format pokazuje wartość Heading 1 (Nagłówek 1). Innymi słowy, paleta Properties odzwierciedla to, co widzimy w widoku kodu: punkt wstawiania sformatowany jest jako nagłówek stopnia pierwszego. Jeśli wkleimy teraz zawartość schowka, zostanie ona sformatowana jako nagłówek stopnia pierwszego. Rozsądniejszym wyborem domyślnego formatu będzie zwykły format akapitu, oznaczany znacznikiem p . LEKCJA 1. Przedstawiamy Newland Tours 31 7. Z menu rozwijanego Format w palecie Properties wybierz Paragraph (Akapit). Zauważ, że w widoku kodu znaczniki h1 /h1 zastąpione zostały znacznikami p /p . Jeśli teraz wkleimy zawartość schowka, zostanie ona sformatowana jako zwykłe akapity. 8. Jeśli w widoku kodu między znacznikami p /p pojawi się znacznik br / , zaznacz go i usuń. Znacznik ten jest pozostałością po pliku about.htm. Może on, lecz nie musi się pojawić, w zależności od sposobu zaznaczenia i usunięcia oryginalnej zawartości strony. 9. Z kursorem umieszczonym pomiędzy znacznikami p i /p w części okna zawierającej kod wybierz Edit Paste (Wklej). Tekst z pliku contact_text.txt został wklejony i sformatowany w takiej formie, jaką posiadał oryginalny plik. Jeśli porównamy tekst i kod w widoku projektu i w widoku kodu, zobaczymy, że w widoku kodu Dreamweaver automatycznie podzielił wiersze dla przedstawienia podziału między akapitami. 32 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Umieściliśmy już treść na nowej stronie i możemy teraz przystąpić do jej sformatowania. Formatowanie strony „Kontakt z nami” W tym zadaniu zajmiemy się formatowaniem tekstu, dzieląc go na akapity oraz wykorzystując nie- które z opcji zmiany układu tekstu. Zaczniemy od oddzielenia od siebie poszczególnych akapitów. 1. W części ekranu zawierającej widok projektu umieść punkt wstawiania pomiędzy wierszami Kontakt z agentem a Aby uzyskać więcej informacji, a następnie naciśnij klawisz Enter (Windows) lub Return (Mac OS). Dreamweaver podzieli tekst na dwa akapity, obejmując każdy z nich parą znaczników p /p (zobacz pierwszy rysunek na następnej stronie). 2. Powtórz krok 1., tworząc nowe akapity od następujących słów: Adres, Newland Tours, ul. Podróżna 1, 00-001 Warszawa, E-mail, info@newlandtours.pl, 022 oraz Na zdjęciu. Po wykonaniu powyższego powinniśmy w głównym obszarze okna otrzymać dziesięć oddzielnych akapitów. Może nie są jeszcze idealne, ale przynajmniej są oddzielone (zobacz drugi rysunek na następnej stronie). LEKCJA 1. Przedstawiamy Newland Tours 33 34 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik 3. W widoku projektu umieść punkt wstawiania gdziekolwiek w obrębie pierwszego akapitu (Kontakt z agentem Newland Tours). Z menu Format w palecie Properties wybierz Heading 1 (Nagłówek 1). Zauważ, że nagłówek strony wreszcie wygląda odpowiednio. W widoku kodu zobaczymy, że w tym akapicie znacznik p zastąpiony został znacznikiem h1 . Zauważ też, że nagłówek strony pojawia się bardzo blisko paska nawigacyjnego. Możemy umieścić go nieco niżej za pomocą znacznika podziału wiersza br / . 4. W widoku kodu, pomiędzy otwierającym znacznikiem h1 a słowem Kontakt, wpisz br / , aby utworzyć podział wiersza. Żeby zobaczyć efekt tego działania, kliknij część okna zawierającą widok projektu. 5. W widoku projektu umieść kursor tuż przed słowami Aby uzyskać więcej informacji, po czym kliknij przycisk Insert Image (Wstaw rysunek) z kategorii Common (Popularne) na pasku Insert (Wstaw). Rysunki wstawiane są przez wbudowanie ich w otaczający je tekst i znaczniki HTML, więc należy uważnie wybrać punkt wstawiania. Zauważ, że przy przycisku Insert Image znajduje się mała strzałka, sygnalizująca obecność rozwijanego menu. Kliknięcie strzałki ujawnia wiele innych zasobów zawiązanych z rysunkami, które możemy wstawić za pomocą tego menu, takich jak: miejsce na rysunek (Image Placeholder), LEKCJA 1. Przedstawiamy Newland Tours 35 interaktywne rysunki Fireworks HTML, efekt rollover (zmiana rysunku po najechaniu kursorem), pola aktywne rysunku (hotspot) i inne. Nie będziemy korzystać z tych opcji w książce, ale warto wiedzieć o ich istnieniu. Kilka innych przycisków na pasku Insert również grupuje podobne polecenia. 6. W oknie dialogowym Select Image Source (Wybierz źródło rysunku) wskaż plik fountain_versailles.jpg z folderu images. Kliknij OK. Oprócz możliwości wyboru rysunku, dzięki czemu Dreamweaver może wpisać jego poprawną ścieżkę dostępu do pliku contact.htm, to okno dialogowe zawiera też kilka innych opcji. Są to m.in.: podgląd, informacja o wielkości pliku i wymiarach rysunku oraz opcje odnoszące się do rodzaju odnośnika: czy ma on być określany względem dokumentu, czy witryny (domyślnie jest określany względem dokumentu, o taki nam chodziło). Na górze okna dialogowego znajduje się opcja Select File Name From (Wybierz nazwę pliku z). Do wyboru mamy tu File System (System plików), gdzie wskazujemy plik na swoim komputerze oraz Data Sources (Źródła danych), gdzie adres URL pobierany jest z bazy danych. W tej książce będziemy często korzystać z obu metod. Jeśli chodzi o ten krok, upewniamy się, że wybrana została opcja File System. 36 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Po kliknięciu przycisku OK pojawi się okno dialogowe z prośbą o podanie dodatkowych informacji służących poprawie dostępności. 7. W polu Alternate text (Tekst alternatywny) wpisz: Fotografia fontanny w Wersalu wykonana przez klienta Newland Tours podczas wycieczki Atrakcje Francji . Pole Long description (Długi opis) pozostaw puste. Kliknij OK. Aby wszystkie obiekty naszej witryny, włącznie z rysunkami, były dostępne dla osób o ograniczonej sprawności, np. o słabszym wzroku, należy wprowadzić opis każdego rysunku (omówimy to w następnym rozdziale). Nowością w programie Dreamweaver 8 jest przypominające o tym okno dialogowe, pojawiające się za każdym razem, gdy wstawiamy rysunek. 8. Przy zaznaczonym rysunku na stronie, w palecie Properties zmień ustawienie Align (Wyrównanie) na Left (Do lewej). Ustawienie domyślne zwykle powoduje wstawienie rysunku po lewej stronie jednego wiersza tekstu, podczas gdy pozostała część tekstu umieszczona zostaje poniżej rysunku. Skutkiem tego jest znaczna ilość niewykorzystanego obszaru strony. Opcja Left (lub odwrotnie, Right — Do prawej) powoduje, że tekst „oblewa” rysunek. LEKCJA 1. Przedstawiamy Newland Tours 37 Aby zrzuty ekranu były łatwiejsze do zrozumienia, mogę czasami przełączać się pomiędzy wido- kiem kodu, projektu i widokiem dzielonym. Jednak Twoim domyślnym widokiem podczas wyko- nywania ćwiczeń w tej książce powinien pozostać widok dzielony. 9. Umieść punkt wstawiania przed słowem Adres i kliknij przycisk Insert Table (Wstaw tabelę) na pasku Insert. W tym kroku przygotowujemy się do wstawienia tabeli, która będzie przechowywała informacje o sposobach kontaktu użytkowników z Newland Tours. Tabele można stosować (jak można się domyślić) do przedstawienia danych tabelarycznych, ale można je też wykorzystać jako narzędzie układu strony. (Warstwy CSS są nowszą i zazwyczaj nadrzędną techniką układu strony: układy oparte na warstwach są bardziej elastyczne, szybsze do pobrania i dostępniejsze. Jednak wymagają one biegłości w posługiwaniu się CSS, której niektórzy z czytelników mogą nie posiadać, a ponieważ nie jest to książka o CSS, lecz o tworzeniu witryn bazodanowych, będziemy tu tworzyć układ strony, korzystając ze starszej, lepiej znanej techniki tabel HTML). W następnym kroku utworzymy prostą, dwukolumnową tabelę, zawierającą nazwę ulicy, adres poczty elektronicznej oraz numer telefonu. 10. W oknie dialogowym Insert Table określ następujące opcje: Rows (Wiersze): 2, Columns (Kolumny): 2, Table width (Szerokość tabeli): 400 pikseli Border thickness (Grubość obramowania): 1 piksel, Cell padding (Marginesy komórek): 3 i Cell spacing (Odstęp miedzy komórkami): 0. W sekcji Accessibility (Dostępność) w pole Summary (Podsumowanie) wpisz: Informacje kontaktowe Newland Tours. Kliknij OK. Takie ustawienia spowodują utworzenie czterokomórkowej tabeli o szerokości 400 pikseli. Opcja Cell padding określa odstęp między obramowaniem komórki a jej zawartością. Cell spacing wyznacza odległość między komórkami. Gdy wypełnimy pole Summary, Dreamweaver doda do znacznika table atrybut summary, wykorzystywany przez lektory ekranowe do szybkiego przekazania informacji o zawartości tabeli użytkownikom o słabszym wzroku. 38 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik 11. Kliknij trzykrotnie słowo Adres, aby zaznaczyć akapit. Przeciągnij zaznaczony akapit (składający się tylko z tego jednego słowa) do lewej górnej komórki tabeli. Podobnie, zaznacz potrójnym kliknięciem, a następnie przeciągnij za pomocą myszy słowa E-mail i telefon do prawej górnej komórki. Zaznacz i przenieś trzy następne akapity zawierające adres pocztowy do lewej dolnej komórki, a e-mail i numer telefonu do prawej dolnej komórki. Dreamweaver przeniesie do odpowiednich komórek zaznaczone bloki tekstu wraz z obejmującymi je znacznikami p . Zwróć uwagę, że informacje adresowe, numer telefonu i adres e-mail mają duże odstępy między wierszami. 12. Umieść punkt wstawiania tuż przed słowami ul. Podróżna 1 i naciśnij klawisz Backspace (Windows) lub Delete (Mac OS), aby usunąć znak końca akapitu oddzielający wiersze ul. Podróżna 1 i Newland Tours (tak, aby utworzyły one jeden wiersz). Kursor umieść w miejscu, w którym poprzednio następował podział wierszy i trzymając wciśnięty klawisz Shift, naciśnij jednocześnie Enter (Windows) lub Return (Mac OS). Po naciśnięciu klawisza Enter lub Return Dreamweaver tworzy nowy akapit ( p ), natomiast klawisze Shift+Enter lub Shift+Return powodują wstawienie znacznika końca wiersza ( br / ). LEKCJA 1. Przedstawiamy Newland Tours 39 13. Powtarzaj krok 12. usuwając dodatkowy odstęp oddzielający wiersz z nazwą ulicy od wiersza z nazwą miasta (oraz kodu pocztowego) w lewej komórce oraz odstęp między wierszem z adresem e-mail a numerem telefonu w prawej komórce. 40 MACROMEDIA DREAMWEAVER 8 Z ASP, PHP I COLDFUSION Oficjalny podręcznik Tabela jest już gotowa. Musimy jeszcze tylko usunąć zbyteczne odstępy poniżej tabeli (jeśli to konieczne) oraz sformatować podpis rysunku kursywą. 14. Umieść punkt wstawiania przed słowami Na zdjęciu i naciskaj klawisz Backspace (Windows) lub Delete (Mac OS) tyle razy, aż podpis pojawi się tuż pod rysunkiem. Ta dodatkowa przestrzeń jest pozostałością po usunięciu akapitów z adresem i wstawieniu ich do tabeli. Jeśli spojrzymy w kod strony przez ukończeniem tego kroku, zobaczymy szereg bloków p nbsp; /p . W ten sposób Dreamweaver tworzy puste akapity. HTML zabrania użycia znaczników otwierającego i zamykającego p /p bez żadnej zawartości. Dlatego Dreamweaver wstawia pomiędzy nie znak odstępu. Ponieważ HTML ignoruje puste odstępy w kodzie, Dreamweaver używa znaku nbsp;, oznaczającego tzw. „twardą spację” — traktowaną jak każdy inny znak. 15. Kliknij trzykrotnie gdziekolwiek w wierszu podpisu, a po jego zaznaczeniu zastosuj tu kursywę za pomocą palety Properties. Kursywa pozwala odróżnić podpis od reszty tekstu. 16. Zapisz plik contact.htm. Zakończyliśmy projektowanie nowej strony. W realnej sytuacji opublikowalibyśmy stronę na ser- werze WWW. Zamiast tego skupmy się teraz na bardziej ambitnych zadaniach związanych z prze- rabianiem witryny. LEKCJA 1. Przedstawiamy Newland Tours 41 Ocena witryny: kod W tym zadaniu nie będziemy dokonywać żadnych zmian w plikach. Będziemy raczej dostosowy- wać środowisko programu Dreamweaver, aby uczynić je bardziej przyjaznym w pracy, którą bę- dziemy wykonywać, a następnie zbadamy kod strony głównej w wersji pierwotnej w celu poznania niedociągnięć występujących w tejże wersji. Oglądając stronę w przeglądarce, możemy ich w ogóle nie dostrzec. W większości przeglądarek strona powinna wyglądać poprawnie. Być może zastanawiasz się, w jaki sposób kod może mieć ja- kieś niedociągnięcia, skoro wygląda dobrze w przeglądarce? Odpowiedź jest taka, że kod w pier- wotnej wersji projektu jest przestarzały i niezgodny ze współczesnymi standardami. W tym roz- dziale dowiemy się jakie znaczenie ma zgodność kodu ze standardami. Często rozpoczynając prace polegające na przeprojektowaniu witryny WWW, mamy do czynienia z przestarzałym, niezgodnym kodem, powinniśmy więc nauczyć się go rozpoznawać. Później po- znamy metody jego poprawiania. 1. Kliknij dwukrotnie plik index.htm, aby go otworzyć. W zależności od tego, czy wykonywałeś ćwiczenie z formatowaniem strony contact.htm, możesz ujrzeć dokument w widoku projektu (jeśli nie wykonywałeś ćwiczenia) lub w widoku dzielonym (jeśli wykonywałeś to ćwiczenie). Dawniej, w późnych latach 90., gdy rynek edytorów HTML był zapełniony edytorami tworzącymi dobry kod, lecz niezbyt wspomagającymi projektowanie (albo odwrotnie), wprowadzenie programu Dreamweaver, przewyższającego inne w obu tych aspektach, było czymś rewolucyjnym. W kilka lat później Dreamweaver wciąż pozostaje edytorem jedynym w swojej klasie, zarówno w tworzeniu kodu, jak i w projektowaniu. Wielu twórców WWW, wiedząc o tym, że Dreamweaver tworzy w tle czysty HTML, projektowało witryny w widoku projektu, nie przejmując się zbytnio kodem. Praca wyłącznie w widoku projektu jest jednak luksusem przeszłości. Jeśli myślisz poważnie o tworzeniu stron WWW i musisz korzystać z treści internetowych opartych o bazy danych, musisz nauczyć się pracować również z kodem strony. 2. Jeśli to konieczne, kliknij przycisk Split. Widok dzielony to jedna z najlepszych opcji. Dzięki niemu mamy dostęp do kodu, więc możemy go w razie potrzeby edytować ręcznie, zostawiając jednocześnie otwarty tradycyjny widok projektu, w którym niektóre operacje, np. edycję treści, można przeprowadzić znacznie łatwiej, niż pracując w widoku kodu. Widok dzielony jest nieodzowny w pracy w witrynami dynamicznymi. Choć Dreamweaver pozwala na wykonywanie wielu zadań przy użyciu kreatorów serwera oraz wbudowanych wizualnych generatorów SQL, to wciąż będziemy zmuszeni edytować kod bezpośrednio. Stwierdzimy także, że niektóre operacje o wiele szybciej można wykonać w widoku kodu niż w widoku projektu, a przy okazji nauczymy się kodu. Zakładam, że skoro czytasz tę książkę, to znasz już HTML, mogłeś jednak zapomnieć o nie
Pobierz darmowy fragment (pdf)

Gdzie kupić całą publikację:

Macromedia Dreamweaver 8 z ASP, PHP i ColdFusion. Oficjalny podręcznik
Autor:

Opinie na temat publikacji:


Inne popularne pozycje z tej kategorii:


Czytaj również:


Prowadzisz stronę lub blog? Wstaw link do fragmentu tej książki i współpracuj z Cyfroteką: