Poradnik webdesignera
Strona główna
Uwagi ogólne
Błędy
Przykazania
Artykuły
Linki
Słowo od autorki
Dreamweaver MX - wprowadzenie
Program Dreamweaver MX firmy Macromedia jest bardzo rozbudowanym narzędziem służącym do tworzenia i zarządzania statycznymi oraz dynamicznymi witrynami internetowymi. Daje on nam możliwość pracy zarówno w edytorze graficznym (WYSIWYG) jak i bezpośredniej edycji kodu HTML (kolorowany kod, uzupełnianie tagów). Dzięki wielu ułatwieniom możemy w prosty sposób zamieścić na stronie takie elementy jak animacje Flash, skrypty czy ruchome przyciski menu, a dodatkowe rozszerzenia (extensions) pozwalają na przykład na stworzenie rozwijanego menu praktycznie kilkoma kliknięciami myszki. Dreamweaver obsługuje takie technologie jak CSS, JSP, DHTML, ASP, ASP.NET, ColdFusion Markup Language (CFML) oraz PHP.
Edytor stron internetowych jest zintegrowany z aplikacjami:
- Fireworks MX - tworzenie i edycja grafiki;
- Flash MX;
- FreeHand MX - tworzenie ilustracji i projektów graficznych do druku i zastosowań internetowych;
- ColdFusion MX - tworzenie aplikacji internetowych.
PRZYGOTOWANIE ŚRODOWISKA PRACY
W systemie Windows program Dreamweaver MX oferuje nam dwa sposoby rozmieszczenia okien, paneli oraz pasków narzędzi: zintegrowany w jednym oknie lub układ znany użytkownikom Dreamweavera w wersji 4.
Wyboru dokonujemy przy pierwszym uruchomieniu programu lub ustawiamy później korzystając z menu Edit > Preferences > General > Change Workspace. Należy ponownie uruchomić program, żeby zmiany zostały uwzględnione.
PODSTAWOWE PASKI NARZĘDZI
Standard
Pasek zawierający ikonki podstawowych operacji dostępnych w menu File
i Edit, takich jak tworzenie nowego pliku, otwieranie i zapis dokumentów,
kopiowanie elementów czy cofnięcie operacji.
Pasek ten nie jest domyślnie wyświetlany po uruchomieniu programu, więc
aby go uruchomić kliknij View > Toolbars > Standard.
Document
1. Edycja kodu
2. Edycja kodu i podgląd graficzny
3. Edycja graficzna
4. Podgląd i testowanie dynamicznych stron (Live Data View)
5. Tytuł dokumentu
6. Zarządzanie plikiem (np. zgrywanie na serwer)
7. Podgląd/debugowanie pliku w przeglądarce
8. Odświeżenie podglądu graficznego
9. Wyświetlenie panelu Reference
10. Ustawienie nawigacji w kodzie JavaScript
11. Opcje wyświetlania kodu/podglądu graficznego
Insert (Ctrl+F2)
Zawiera ikonki służące do zamieszczania różnego rodzaju obiektów, takich jak grafika, tabele, odnośniki, znaki specjalne, formularze, znaczniki meta czy skrypty. Oczywiście wszystkie te opcje są również dostępne z głównego menu.
OKNA I PANELE
Properties (Ctrl+F3)
Wyświetla oraz umożliwia edycję właściwości zaznaczonego obiektu:
- tekst - wyrównanie tekstu, pogrubienie czcionki, dodanie odnośnika, definiowanie nagłówków, wielkość i kolor czcionki, listy wypunktowane i numerowane;
- grafika - wymiary, przestrzeń naokoło grafiki, odnośnik, podpis, obramowanie, tworzenie image map;
- tabela - wymiary, położenie, kolor/obrazek tła, obramowanie, wyrównanie zawartości komórek, możliwość łączenia komórek, wymiary komórek, itd.;
- pola formularzy, itp.
Reference (Shift+F1)
Panel, w którym są wyświetlane szczegółowe informacje na temat komend
języka HTML, CSS, JavaScript, ASP i JSP oraz przykłady ich zastosowania.
Snippet (Shift+F9)
Zawiera predefiniowane fragmenty kodu gotowe do użycia na naszej stronie.
Mamy możliwość zapisania własnych przykładów, które chcielibyśmy wykorzystać
w przyszłości, jak również edycji istniejących.
Site (F8)
Panel do zarządzania plikami i katalogami witryny zarówno na dysku lokalnym
(Local View) jak i serwerze ftp (Remote View). Standardowo układ plików
i katalogów jest wyświetlany w formie znanej z managera plików w systemie
Windows, lecz możemy przełączyć się na układ mapy witryny, w którym pokazane
są połączenia pomiędzy poszczególnymi plikami.
 |
1. Nawiązanie połączenia/rozłączenie się z serwerem 2. Odświeżenie widoku (F5) 3. Zgranie pliku(ów) z serwera 4. Wgranie pliku(ów) na serwer 5. Zgranie z serwera plików bardziej aktualnych niż te, które mamy na dysku lokalnym 6. Zgranie na serwer plików, które są bardziej aktualne na dysku lokalnym niż na zdalnej lokalizacji 7. Powiększenie okna na pełny ekran/zmniejszenie okna 8. Wybór witryny |
W menu File i Edit mamy możliwość tworzenia nowych plików i folderów, otwierania istniejących, kopiowania oraz kasowania. Opcje menu Site to między innymi edycja właściwości witryn, tworzenie nowych, synchronizacja plików pomiędzy dyskiem lokalnym i serwerem, tworzenie raportów oraz sprawdzanie poprawności odnośników.
ZARZĄDZANIE OKNAMI
Dostępne panele są pogrupowane tematycznie, ale oczywiście możemy je
dowolnie między sobą przenosić. Klikamy prawym klawiszem myszki na panel
i wybieramy "Group {nazwa panelu} with". Mamy też możliwość zmiany nazwy
danej grupy "Rename Panel Group", zmaksymalizowanie rozmiarów okna "Maximize
Panel Group" oraz zamknięcie okna "Close Panel Group".
Launcher (szybkie uruchamianie paneli)
Domyślnie wszystkie panele mają ustawiony parametr "Always on top" (zawsze
na wierzchu), co możemy zmienić wchodząc w menu głównym w Edit > Preferences
> Panels. W tym samym oknie dialogowym, zaznaczając opcję "Show Icons
in Panels and Launcher", włączamy wyświetlanie na dolnym pasku ikonek
wybranych ("Show in Launcher") paneli, które dzięki temu możemy szybko
uruchomić. Pozostałe okna otwieramy korzystając z pozycji "Window" w menu
głównym.
Agnieszka Richter
Zobacz również:
Rozszerzenia na stronie Macromedia
http://www.macromedia.com/cfusion/exchange/
PVII Dreamweaver Extensions
http://www.projectseven.com/
Artykuł został napisany dla Optimus
Pascal S.A. Publikowanie całości lub fragmentów niniejszego artykułu
jest zabronione bez zgody właściciela.