Spis Treści
Rozdział 1. FrontPage 2002 - wprowadzenie
|
FrontPage 2002, sprzedawany jako samodzielny program lub jako składnik pakietu Microsoft Office XP Professional Edition lub Microsoft Office XP Developer Edition, jest wyposażony w narzędzia do tworzenia witryn internetowych w szybki i prosty sposób. Jedną z zalet tego programu jest to, że zamiast tworzyć strony internetowe bezpośrednio w HTML-u (HyperText Markup Language), autor witryny korzysta z menu i poleceń znanych z innych programów firmy Microsoft, takich jak Word, Excel i PowerPoint. FrontPage 2002 pozwala zaprojektować strukturę nawigacyjną witryny internetowej, stworzyć strony potrzebne do wypełnienia tej struktury, dodać multimedia i składniki dynamiczne ożywiające strony internetowe, a także wysłać witrynę internetową do serwera, aby opublikować ją w Internecie. Office XP, do którego należy FrontPage 2002, rozpoznaje HTML—podstawowy format wykorzystywany do tworzenia stron internetowych — równie łatwo jak swoje własne formaty. FrontPage 2002 posiada zatem narzędzia do umieszczania dokumentów tego pakietu bezpośrednio na stronach internetowych. Czy pracujesz w jednoosobowej firmie, czy też w firmie międzynarodowej możesz używać FrontPage'a 2002, ponieważ posiada on wszystkie narzędzia i funkcje potrzebne do budowania witryn internetowych i intranetowych. |
Nowości Jeżeli porównać program FrontPage 98 z programem FrontPage 2000 oraz program FrontPage 2000 z programem FrontPage 2002, można odnieść wrażenie, że różnica między najnowszą wersją programu FrontPage a jego poprzednikiem nie jest tak duża jak różnica między wersją 98 a 2000. Jednak im częściej stosujemy program FrontPage 2002, tym bardziej się przekonujemy, że jest on łatwiejszy w użyciu i oferuje więcej możliwości niż FrontPage 2000. Nowe narzędzia programu FrontPage 2002 omawiamy w poszczególnych rozdziałach niniejszej książki, poniżej natomiast przedstawiamy listę niektórych z nich:
|
Rysunek 1.1. Miłośnicy programu PowerPoint mają powód do radości: FrontPage 2002 korzysta z tych samych narzędzi do tworzenia grafiki wektorowej jak PowerPoint
Rysunek 1.2. Efekty tekstowe, na przykład cienie, można tworzyć za pomocą programu FrontPage 2002 i wyświetlać poprawnie w przeglądarkach internetowych w wersji 5 i nowszych |
|
|
Ważne zmiany Czasem na sposób korzystania z programu większy wpływ mają drobne zmiany niż nowe funkcje, które widać od razu. Oto zmiany, które najprawdopodobniej będą miały największy wpływ na sposób pracy z programem FrontPage 2002:
|
Rysunek 1.3. Pasek narzędzi Tabele zawiera narzędzia do stosowania formatów niestandardowych a także do automatycznego wypełniania pustych komórek |
|
|
O tej książce Niniejsza książka, podobnie jak wszystkie książki z serii „Po prostu”, zawiera dużą ilość rysunków. Rysunki z łatwymi do zrozumienia podpisami wyjaśniają działanie programu FrontPage 2002. W odszukaniu potrzebnego tematu pomaga spis treści, nagłówki stron, rysunki oraz podpisy pod rysunkami. Temat zawiera zwykle tekst podstawowy oraz dodatkowe wskazówki. Aby korzystać z tej książki, musisz posiadać podstawową wiedzę o działaniu systemu operacyjnego Windows oraz o działaniu WWW (World Wide Web). Warto zwrócić uwagę, że w książce nie omawia się szczegółów działania serwerów internetowych. Każdy temat prezentujemy krok po kroku. Wszystkie zagadnienia, które mogą sprawiać trudność, staramy się wyjaśnić w prosty sposób. Aby ułatwić pracę z książką, zastosowaliśmy w niej następujące konwencje typograficzne: Wskazówki: stąd dowiesz się, jak wykonać na skróty zadanie omawiane w danym podrozdziale lub w jaki sposób wykorzystać zdobyte umiejętności do rozwiązania często występujących problemów. Kursywa: terminy wyróżnione kursywą odpowiadają terminom występującym w programie FrontPage 2002. Kursywą są wyróżnione nazwy elementów interfejsu użytkownika (okna dialogowe, przyciski, listy, pozycje menu, nazwy klawiszyMa ona pomóc |
|
Rysunek 1.4. Z menu Plik wybierz pozycję Drukuj |
odnaleźć żądany element na ekranie wypełnionym wieloma oknami. Rysunek towarzyszący instrukcji ma ułatwić odszukanie omawianego elementu. Oto dwa przykłady: Kliknij przycisk Przeglądaj, aby odszukać żądany plik. Z menu Plik wybierz pozycję Drukuj, aby wydrukować stronę (rysunek 1.4). Klawisze skrótu: Klawisze skrótu podajemy w nawiasach po instrukcji, np. (Ctrl+P) oznacza, że aby wydrukować stronę, należy nacisnąć jednocześnie klawisz Ctrl oraz klawisz P.
|
Uaktualnienia i kontakt z autorem Odwiedzaj od czasu do czasu witrynę firmy Microsoft, www.microsoft.com, aby poznać uaktualnienia usprawniające działanie programu FrontPage 2002. Odwiedź również witrynę internetową Wydawnictwa Helion, www.helion.pl, aby dowiedzieć się o innych książkach poświęconych programowi FrontPage 2002. Autor książki i Wydawnictwo Helion dołożyli wszelkich starań, aby niniejsza książka była wolna od błędów. Aby przekazać autorowi sugestie i uwagi o książce, wyślij wiadomość e-mail na adres frontpage@waywest.net. Czytelnicy poprzedniej edycji tej książki przekazali wiele wskazówek, które zostały wykorzystane w niniejszej pozycji. Dzięki pomocy Czytelników następna edycja będzie jeszcze lepsza. Podobnie jak witryna internetowa, książka tak naprawdę nigdy nie jest skończona. |
|
|
Wskazówki dotyczące planowania witryny Internet, choć nazywany zupełnie nowym medium, działa na ten sam zmysł jak stare media - wzrok. Witryny nie służą ani do jedzenia, ani do wąchania - witryny sięogląda. Aby zatem korzystać z witryny internetowej, potrzebujemy wizualnych wskazówek. Warto przestrzegać zasad, które przedstawiamy na kilku następnych stronach, bo dzięki nim jest duża szansa, że witryny spodobają się użytkownikom. Jest wiele dobrych książek poświęconych wyłącznie projektowaniu witryn internetowych. Jeżeli jesteś zainteresowany tą tematyką, oto tytuły pięciu książek. The Non-Designer's Web Book: An Easy Guide to Creating, Designing, and Posting Your Own Web Site, autorzy Robin Williams i John Tollett (Peachpit Press). Dwie następne książki zawierają wiele cennych rad dla każdego projektanta witryn internetowych: Hot Wired Style: Principles for Buliding Smart Web Sites, autor Jeffrey Veen (Wired Books) oraz Web Style Guide: Basic Design Principles for Creating Web Sites, autorzy Patrick J. Lynch i Sarah Horton (Yale University Press). Na koniec jeszcze dwie pozycje: Creating Killer Web Sites: The Art Of Third-Generation Site Design, autor David Siegel (Haydn Books) oraz Designing Web Usability: The Pracitce of Simplicity, autor Jakob Nielsen (New Riders). Z opiniami zawartymi w tych książkach można się zgadzać lub nie, ale nie można przejść obok nich obojętnie. Buduj przejrzyste witryny Co za dużo, to niezdrowo. Strony zawierające łącza do bardzo wielu miejsc dezorientują lub, co gorsza, irytują użytkowników. Wyobraźmy sobie, co by się działo, gdyby projekt parkingu wyglądał tak, jak niektóre witryny internetowe - nie można |
byłoby znaleźć wejścia. Twórz więc je proste i przejrzyste. Stosuj maksymę: jeżeli trzeba objaśniać działanie witryny, witryna ta nie działa. Nie buduj witryn internetowych z „fałszywymi drzwiami wejściowymi”. Pierwsza strona zamiast wyświetlać łącza i inne informacje, wyświetla absolutnie zdumiewający obraz lub animację, którą użytkownik musi obowiązkowo obejrzeć. Dopiero po odtworzeniu animacji na stronie pojawia się tekst w rodzaju „Odkryj siłę produktu XYZ” lub „Chcesz się dowiedzieć więcej?”. Trzeba więc kliknąć jeszcze raz, by wreszcie zostać dopuszczonym do „prawdziwych drzwi wejściowych” - strony startowej, gdzie można zacząć szukać potrzebnych informacji. Nie każ gościom pukać dwa razy. I w żadnym przypadku nie każ im prosić. Jeżeli strona startowa zawiera obrazy, powinny one być małe, aby użytkownicy nie musieli długo czekać na ich wyświetlenie. Usuń z witryny wszystko co zbędne, aby była przejrzysta. Buduj szybkie witryny Internet jest zbyt powolny. Tak było w zeszłym roku; tak będzie przyszłym roku. Chociaż wszyscy chcielibyśmy, by szybkość połączeń internetowych umożliwiała obsługę filmów wideo, dźwięku o jakości CD oraz wyrafinowanych apletów Java, większość ludzi nadal łączy się z Internetem za pomocą modemów telefonicznych. Wzrost popularności komputerów naręcznych i telefonów komórkowych z obsługą poczty elektronicznej tylko zwiększy popyt na szybkie witryny. Nawet jeżeli projektujesz witryny intranetowe dla firmy wykorzystującej szybkie komputery i nowoczesne łącza, powinieneś budować szybkie witryny. Terenowi przedstawiciele firmy, chcąc uzyskać dostęp do jej zasobów, będą się łączyć z intranetem za pomocą linii telefonicznych. |
|
|
Internet jest więc zbyt wolny. Z barierą szybkości będziemy się borykać jeszcze przez kilka lat. Problemu tego nie należy ignorować, ale pamiętać o nim podczas tworzenia witryny. Jak to ujął architekt i pionier multimediów: „Projekt w dużym stopniu zależy od ograniczeń”. Buduj witryny łatwe w użyciu Nikt nie musi Ci mówić, jak czytać gazetę lub magazyn z dwóch powodów: znasz już „zasady” czytania, a nawet gdybyś ich nie znał, są one dość oczywiste. Im większy nagłówek, tym artykuł jest ważniejszy. Teksty zgrupowane razem są zwykle ze sobą powiązane. Artykuły umieszczone na stronie tytułowej są ważniejsze niż te umieszczone wewnątrz czasopisma. W drukowanych publikacjach rozmiar, bliskość i położenie odgrywają olbrzymią rolę od wielu wieków. Ponieważ Internet jest nowym medium, istnieje pokusa, by myśleć, że nie obowiązują tu żadne zasady. Zaufaj jednak swoim oczom. Rozmiar, bliskość i położenie odgrywają tu równie wielką rolę jak w innych publikacjach, mimo że Internet pojawił się stosunkowo niedawno. Należy wyróżnić najważniejszy element każdej strony witryny internetowej. Oznacza to, że trzeba zdecydować, co jest najważniejsze - a co najmniej ważne - na każdej stronie i w całej witrynie. Zanim zaczniesz opracowywać zdumiewającą animację dla strony startowej, zdefiniuj cel witryny i zastanów się, do kogo jest ona adresowana. Tworząc gazetę nie umieściłbyś artykułu sportowego wśród przepisów kulinarnych. Zasadę tę należy stosować również podczas budowy witryny internetowej, na przykład rady techniczne należy oddzielić od informacji marketingowych. Chociaż wydaje się to oczywiste, na wielu witrynach tematy pokrewne nie są umieszczane razem. Aby usprawnić działanie witryny internetowej, zawsze grupuj pokrewne elementy. |
Być może najtrudniejszym zadaniem podczas tworzenia witryny internetowej jest zaprojektowanie przemyślanej struktury nawigacyjnej. Jeżeli będzie ona zbyt „głęboka”, użytkownik będzie musiał klikać wiele razy, aby dojść do potrzebnych informacji (rysunek 1.5). Istnieje ryzyko, że użytkownik nigdy nie znajdzie tego, czego szuka. Nie jest również dobrym rozwiązaniem struktura zbyt „płytka” ze stroną startową posiadającą tak wiele łączy, że staje się ona zbyt skomplikowana (rysunek 1.6). Należy stworzyć taką strukturę, aby użytkownik mógł znaleźć interesującą go informację za pomocą dwóch lub trzech kliknięć (rysunek 1.7). Nie jest to łatwe zadanie. Na szczęście w widoku Nawigacja programu FrontPage można modyfikować strukturę nawigacyjną witryny aż do stworzenia struktury umożliwiającej dostęp do prawie wszystkich informacji witryny za pomocą nie więcej niż czterech kliknięć. Poznając narzędzia programu FrontPage 2002, pamiętaj, aby tworzyć strony przejrzyste, szybkie i łatwe w użyciu. |
Rysunek 1.5. Struktura zbyt „głęboka” sprawia, że użytkownik ma utrudniony dostęp do potrzebnych informacji
Rysunek 1.6. Struktura zbyt „płytka” sprawia, że strona startowa zawiera zbyt dużą ilość łączy nadających wszystkim składnikom witryny jednakową ważność
Rysunek 1.7. Przemyślana struktura witryny internetowej sprawia, że strona startowa wyświetla tylko najważniejsze łącza, elementy są zgrupowane w logiczne kategorie i do wszystkich informacji można dojść za pomocą dwóch lub trzech kliknięć |
Rozdział 2. FrontPage 2002 - pierwsze kroki
|
W niniejszym rozdziale omówimy główne funkcje programu FrontPage 2002 oraz sposób wykonywaniae podstawowych zadań, takich jak otwieranie, zamykanie i zapisywanie stron i witryn internetowych. Wszystkie poruszane w tym rozdziale elementy - widoki, menu, paski narzędzi - omówimy szczegółowo w dalszej części książki. Czytając ten rozdział, dowiesz się, jak wygląda praca z programem FrontPage 2002 i poznasz jego funkcje, po czym będziesz mógł zająć się bardziej zaawansowanymi skomplikowanymi zagadnieniami. |
Rysunek 2.1. Po uruchomieniu FrontPage 2002 wyświetla stronę w widoku normalnymwidok normalny strony. Aby go zmienić widok strony, kliknij kartę HTML lub Podgląd
1 Application menu (click to activate) - 1 Menu programu (kliknij, aby uruchomić) 2 Web site name, Selected Web page name, Page Selection tabs - 2 Nazwa witryny internetowej, Nazwa wybranej strony internetowej, Karty stron 3 Search FrontPage Help - 3 Pomoc programu FrontPage 2002 4 Close application window, Maximize window, Minimize window - 4 Zamknij program, Maksymalizuj okno, Minimalizuj okno 5 Menu bar, Standard toolbar, Formatting toolbar - 5 Pasek menu, Pasek narzędzi Standardowy, Pasek narzędzi Formatowanie 6 Views Bar - 6 Pasek widoków 7 Page view tabs - 7 Karty widoków 8 Drawing toolbar (with AutoShapes) - 8 Pasek narzędzi Rysowanie (z przyciskiem Autokształty) 9 Download progress indicator - 9 Wskaźnik postępu pobierania strony 10 Estimated download time (click to change connection speed) - 10 Szacowany czas pobierania strony (kliknij, aby zmienić szybkość połączenia) |
Okno programu FrontPage Standardowo okno programu FrontPage 2002 otwiera się w widoku normalnym (rysunek 2.1). W nowej wersji programu FrontPage dodano karty stron (2), pole tekstowe służące do wpisywania pytań do pomocy (3) oraz nowy pasek narzędzi Rysowanie (8).
|
|
Uruchamianie i zamykanie programu FrontPage Aby uruchomić program FrontPage:
Aby zamknąć program FrontPage:
|
Rysunek 2.2. Kliknij przycisk Start, wybierz pozycję Programy, a następnie pozycję Microsoft FrontPage
Rysunek 2.3. Po uruchomieniu FrontPage wyświetla puste okno programu
Rysunek 2.4. Aby opuścić program FrontPage, z menu Plik wybierz pozycję Zakończ (Alt+F4) |
Rysunek 2.5. Kliknij kartę HTML, aby Aby przejrzeć lub edytować kod HTML bieżącej strony, kliknij kartę HTML
Rysunek 2.6. Kliknij kartę Podgląd, aby Aby zobaczyć, jak w przybliżeniu bieżąca strona będzie wyglądać w przeglądarce internetowej, kliknij kartę Podgląd
Rysunek 2.7. Niektórych elementów, na przykład pokazów slajdów, nie można poprawnie wyświetlić korzystając z karty Podgląd (po lewej), można to jednak zrobić korzystając z polecenia Podgląd w przeglądarce (po prawej) |
Widok Normalny, HTML i Podgląd Mając otwartą stronę w widoku Strona, można wybrać jeden z trzech widoków: Normalny (domyślny), HTML lub Podgląd. W widoku Normalny można edytować bieżącą stronę internetową - bez oglądania generowanego w tle kodu HTML (rysunek 2.1). Widok HTML wyświetla kod strony i pozwala go zmieniać (rysunek 2.5). Widok Podgląd wyświetla stronę mniej więcej takpodobnie, jak robi to przeglądarka internetowa (rysunek 2.6). Wskazówki
|
Ikony widoków W programie FrontPage strony i witryny internetowe można oglądać i edytować na sześć różnych sposób. Aby wyświetlić widok, kliknij odpowiednią ikonę na pasku widoków (rysunek 2.8). Standardowo FrontPage wyświetla widok Strona (rysunek 2.9). Inne widoki pozwalają oglądać foldery, raporty, strukturę nawigacyjną, hiperłącza i zadania związane z bieżącą stroną lub witryną internetową. Każdy widok wyświetla inny zbiór informacji o witrynie lub stronach (rysunki 2.10 - 2.14). |
Rysunek 2.8. Aby zmienić widok bieżącej strony lub witryny internetowej, kliknij jedną z sześciu ikon dostępnych na pasku widoków
Rysunek 2.9. Po otwarciu witryny internetowej FrontPage standardowo wyświetla widok Strona
Rysunek 2.10. Kliknij ikonę Foldery dostępną na pasku widoków, aby wyświetlić foldery bieżącej witryny internetowej
Rysunek 2.11. Kliknij ikonę Raporty dostępną na pasku widoków, aby Aby móc analizować bieżącą witrynę internetową, kliknij ikonę Raporty dostępną na pasku widoków
Rysunek 2.12. Kliknij ikonę Nawigacja dostępną na pasku widoków, aby Aby wyświetlić strukturę bieżącej witryny internetowej kliknij ikonę Nawigacja dostępną na pasku widoków. Widok Nawigacja jest znakomitym właściwym miejscem do stworzenia struktury witryny przed przystąpieniem do tworzenia poszczególnych stron internetowych
Rysunek 2.13. Kliknij ikonę Hiperłącza dostępną na pasku widoków, aby Aby wyświetlić łącza prowadzące do bieżącej strony internetowej oraz łącza z niej wychodzące, kliknij ikonę Hiperłącza dostępną na pasku widoków
Rysunek 2.14. Kliknij ikonę Zadania dostępną na pasku widoków, aby Aby stworzyć listę zadań dla witryny internetowej i aby śledzić stan tych zadańich postęp, kliknij ikonę Zadania dostępną na pasku widoków |
Rysunek 2.15. Pasek widoków można wyświetlić lub ukryć. W tym celu z menu Widok należy wybrać pozycję Pasek widoków lub prawym przyciskiem myszy kliknąć pasek widoków i z menu kontekstowego wybrać pozycję Ukryj pasek widoków
Rysunek 2.16. Aby obejrzeć strukturę folderów witryny - bez względu na to, który widok jest wyświetlany - kliknij przycisk Okienko przełączania dostępny na pasku narzędzi Standardowy. Aby ukryć Listę folderów, kliknij ten przycisk jeszcze raz
Rysunek 2.17. Aby przełączać widoki, kliknij zakładkę Lista folderów lub Nawigacja albo kliknij strzałkę przycisku Okienko przełączania dostępnego na pasku narzędzi Standardowy |
Aby wyświetlić widok:
Wskazówki
|
Okienko zadań Okienko zadań, nowy element programu FrontPage 2002 występujący również w innych programach pakietu Office XP, służy do wykonywania zadań takich jak tworzenie nowych stron i korzystanie z szablonów stron. Okienko zadań oferuj pokazuje trzy widoki: Nowy plik strony lub sieci Web, Schowek oraz Wyszukaj. Po otwarciu okienko zadań wyświetla ostatnio używany widok. Mimo podobnych nazw okienko zadań nie ma nic wspólnego z widokiem Zadania. Okienko zadań jest związane jedynie z bieżącą stroną internetową; widok Zadania dotyczy całej witryny internetowej. Niestety, pomoc programu FrontPage 2002 nie zawiera informacji na temat okienka zadań, co jeszcze bardziej komplikuje sprawę. Aby korzystać z okienka zadań:
Wskazówki
|
Rysunek 2.18. Aby wyświetlić okienko zadań, skorzystaj z menu Widok
Rysunek 2.19. Kliknij jedną ze strzałek w lewym górnym rogu lub trójkąt w prawym górnym rogu okienka zadań, aby Aby wybrać jeden z trzech widoków, kliknij jedną ze strzałek w lewym górnym rogu lub trójkąt w prawym górnym rogu okienka zadań
Rysunek 2.20. Kliknij jedną z pozycji okienka zadań, aby Aby uruchomić akcję, kliknij jedną z pozycji okienka zadań
Rysunek 2.21. Schowek dostępny w okienku zadań (po lewej) jest znakomitym miejscem do tymczasowego przechowywania obrazów, hiperłączy i innych elementów. Widok Wyszukiwanie podstawowe (po prawej) pomoga pomaga odszukać elementy na stronie lub w witrynie internetowej. |
Rysunek 2.22. Z menu Narzędzia wybierz pozycję Opcje, aby Aby ustawić opcję dla okienka zadań, z menu Narzędzia wybierz pozycję Opcje
Rysunek 2.23. Aby oddzielić okienko zadań od okna programu FrontPage 2002, kliknij pasek tytułu okienka zadań i przeciągnij na pulpit |
Aby wyświetlić okienko zadań przy uruchomieniu:
Aby przesunąć okienko zadań na pulpit:
Aby zamknąć okienko zadań:
|
Paski narzędzi Standardowo pasek narzędzi Standardowy i Formatowanie (rysunki 2.24 oraz 2.25) znajdują się u góry okna programu FrontPage 2002, natomiast pasek narzędzi Rysowanie - u dołu tego okna. Jednak FrontPage 2002 posiada jeszcze dziewięć innych pasków narzędzi, które usprawniają pracę nad witryną internetową (rysunki 2.26 - 2.35). Paski narzędzi programu FrontPage można dowolnie modyfikować ile dusza zapragnie. Można też stworzyć własne paski narzędzi. Więcej informacji na ten temat zawierają podrozdziały Aby dostosować istniejący pasek narzędzi oraz Aby stworzyć nowy pasek narzędzi. |
|
Rysunek 2.24. Przyciski dostępne na pasku narzędzi Standardowy umieszczonym tuż pod paskiem menu służą do wykonywania najbardziej podstawowych zadań
New Page - Nowa strona New - Wyświetl menu Nowa Open - Otwórz Open - Wyświetl menu Otwórz Save - Zapisz Search - Wyszukaj Publish Web site - Publikuj sieć Web Show/Hide panes - Okienko przełączania Toggle pane type - Wyświetl menu Okienko przełączania Print - Drukuj Preview in browser - Podgląd w przeglądarce Spell check - Pisownia Cut - Wytnij Copy - Kopiuj Paste - Wklej Format painter - Malarz formatów Undo - Cofnij Redo - Wykonaj ponownie Insert component - Składnik sieci Web Insert table - Wstaw tabelę Insert file picture - Wstaw obraz z pliku Show/Hide drawing toolbar - Rysowanie Create hyperlink - Wstaw hiperłącze Refresh page - Odśwież Stop page load - Zatrzymaj Show/Hide invisible characters - Pokaż wszystko Help - Pomoc
Rysunek 2.25. Przyciski dostępne na pasku narzędzi Formatowanie generalnie odpowiadają poleceniom kontrolującym wygląd tekstu dostępnym w menu Format
Style (paragraph) - Styl (akapit) Choose style - Wybierz styl Font - Czcionka Choose font - Wybierz czcionkę Font size - Rozmiar czcionki Choose size - Wybierz rozmiar czcionki Font styles - Style czcionki Text alignment - Wyrównanie tekstu Increase/decrease font size - Zwiększ/-zmniejsz rozmiar czcionki Numbered list - Numerowanie Bullet list - Punktory Decrease/increase line indent - Zmniejsz/-zwiększ wcięcie Apply border - Krawędzie Choose border - Wybierz krawędź Apply highlight - Wyróżnienie Choose highlight - Wybierz kolor wyróżnienia Apply font color - Kolor czcionki Choose font color - Wybierz kolor czcionki
Rysunek 2.26. Dzięki przyciskom dostępnym na pasku narzędzi WordArt można stosować efekty wykorzystujące grafikę wektorową
Apply WordArt effect - Wstaw obiekt WordArt Change text - Edytuj tekst Choose WordArt effect - Galeria WordArt Format WordArt - Formatuj WordArt Shape WordArt - Kształt obiektu WordArt Letter height - Jednakowa wysokość liter WordArt Vertical letters - Tekst pionowy WordArt Alignment - Wyrównanie obiektu WordArt Letter spacing - Odstępy między znakami WordArt
Rysunek 2.27. Przyciski dostępne na pasku narzędzi Rysowanie umożliwiają tworzenie i modyfikowanie obiektów graficznych i autokształtów
Draw tool - Rysuj Choose draw tool - Wybierz narzędzie Select object - Zaznacz obiekty AutoShapes tool - Autokształty Choose AutoShapes - Wybierz autokształt Line - Linia Arrow - Strzałka Rectangle - Prostokąt Oval - Elipsa Text box - Pole tekstowe Insert WordArt - Wstaw obiekt WordArt Insert clip art - Wstaw ClipArt Insert file art - Wstaw obraz z pliku Fill color - Kolor wypełnienia Choose fill color - Wybierz kolor wypełniania Line color - Kolor linii Choose line color - Wybierz kolor linii Font color - Kolor czcionki Choose font color - Wybierz kolor czcionki Line style - Styl linii Dash style - Styl kreskowany Arrow style - Styl strzałki Shadow style - Cień 3-D style - 3-W
Rysunek 2.28. Przyciski dostępne na pasku narzędzi Kanwa rysunku kontrolują rozmiar kanwy rysunku podczas pracy z obrazami wykorzystującymi grafikę wektorową
Fit canvas to drawings - Dopasuj rysunek do zawartości Enlarge canvas - Rozwiń rysunek Scale canvas up or down - Skaluj rysunek
Rysunek 2.29. Listy rozwijane dostępne na pasku narzędzi Efekty języka DHTML (Dynamiczny HTML) pozwalają ustawić efekty formatowania wywoływane w odpowiedzi na zdarzenie
Choose event - Wybierz zdarzenie Effect setting - Ustawienia efektu Choose effect - Wybierz efekt Highlight effect - Wyróżnij efekty języka DHTML
Rysunek 2.30. Lista rozwijana oraz przyciski dostępne na pasku narzędzi Nawigacja (działającym tylko w widoku Nawigacja) kontrolują widok struktury bieżącej witryny internetowej. Więcej informacji na ten temat zawiera podrozdział Kontrola widoku struktury witryny w rozdziale 3., Tworzenie witryny internetowej
Zoom view - Powiększenie Toggle view: portrait/landscape - Orientacja pozioma/-pionowa Add external link - Dodaj istniejącą stronę Include in navigation bars - Dołączone do pasków nawigacyjnych View subtree only - Pokaż tylko poddrzewo
Rysunek 2.31. Przyciski dostępne na pasku narzędzi Obrazy służą do edytowania zaznaczonego obrazu. Więcej informacji na ten temat zawiera rozdział 7., Tworzenie i edytowanie obrazów
Insert picture - Wstaw obraz z pliku Add text - Tekst Create thumbnail - Autominiatura Position absolutely - Pozycjonuj bezwzględnie Bring forward - Przesuń do przodu Send back - Przesuń do tyłu Rotate left - Obróć w lewo Rotate right - Obróć w prawo Flip horizontal - Przerzuć w poziomie Flip vertical - Przerzuć w pionie More contrast - Więcej kontrastu Less contrast - Mniej kontrastu Brighter - Większe rozjaśnienie Dimmer - Mniejsze rozjaśnienie Crop - Przytnij Line style - Styl linii Format picture - Formatuj obraz Set transparent color - Ustaw kolor przezroczysty Set color - Kolor Bevel border - Skos Resample picture - Przepróbkowanie Select - Wybierz Create hotspots - Stwórz punkty aktywne Add/remove buttons - Dodaj lub usuń przyciski Restore picture - Przywróć
Rysunek 2.32. Przyciski i pola tekstowe dostępne na pasku narzędzi Pozycjonowanie kontrolują absolutną i relatywną pozycję zaznaczonego elementu strony. Więcej informacji na ten temat zawiera podrozdział Pozycja absolutna obrazów w rozdziale 7., Tworzenie i edytowanie obrazów
Rysunek 2.33. Listy rozwijane i przyciski dostępne na pasku narzędzi Raportowanie używanym tylko w widoku Raporty pomagają sprawdzić pliki, funkcje i hiperłącza bieżącej witryny internetowej
Rysunek 2.34. Przycisk dostępny na pasku narzędzi Styl otwiera okno dialogowe Styl.
Rysunek 2.35. Przyciski dostępne na pasku narzędzi Tabele pomagają tworzyć i modyfikować tabele
Draw table - Rysuj tabelę Erase - Gumka Insert rows - Wstaw wiersze Insert columns - Wstaw kolumny Delete cells - Usuń komórki Merge cells - Scal komórki Split cells - Podziel komórki Align top - Wyrównaj do góry Center - Wyśrodkuj pionowo Align bottom - Wyrównaj do dołu Spread rows evenly - Rozłóż wiersze równomiernie Spread columns evenly - Rozłóż kolumny równomiernie Autofill - Automatycznie dopasuj do zawartości Apply fill color - Kolor wypełnienia Choose fill color - Wybierz kolor wypełnienia Apply AutoFormat Combo - Pole kombi autoformatowania tabeli Choose AutoFormat Combo - Wybierz typ autoformatowania AutoFormat - Autoformatowanie tabeli Fill down - Wypełniaj w dół Fill right - Wypełniaj w prawo |
Rysunek 2.36. Aby wyświetlić lub ukryć pasek narzędzi, z menu Widok wybierz pozycję Pasek narzędzi i z podmenu wybierz nazwę paska
Rysunek 2.37. Aby przesunąć zadokowany pasek narzędzi, kliknij go (a) i przeciągnij na pulpit (b) |
Aby wyświetlić lub ukryć paski narzędzi:
Zmiana położenia pasków narzędzi Paski narzędzi można umieszczać w wygodnych miejscach. Czasem najlepiej pasek narzędzi „zadokować”, czyli usytuować nieruchomo wzdłuż górnej lub dolnej krawędzi okna programu FrontPage. Jednak podczas wykonywania niektórych zadań dobrze jest umieścić pasek narzędzi na pulpicie poza oknem programu FrontPage na pulpicie. Można ponadto zmienić rozmiar pasków narzędzi, aby dostosować go do obszaru roboczego. Aby przesunąć pasek narzędzi na pulpit:
|
Aby zadokować pasek narzędzi w oknie programu FrontPage:
Aby zmienić rozmiar wolno stojącego paska narzędzi:
|
Rysunek 2.38. Aby zadokować wolno stojący pasek narzędzi, kliknij i przeciągnij go do miejsca dokowania (a). Kiedy wskaźnik myszy zbliży się do miejsca dokowania (b), wolno stojący pasek narzędzi zostanie zadokowany (c)
Rysunek 2.39. Aby zmienić rozmiar paska narzędzi, kliknij jego krawędź i, przytrzymując klawisz myszy, przeciągnij poziomo lub pionowo |
Rysunek 2.40. Aby dodać lub usunąć przycisk, kliknij trójkąt na końcu paska narzędzi - w odpowiedzi pojawi się opcja Dodaj lub usuń przyciski
Rysunek 2.41. Po umieszczeniu wskaźnika nad opcją Dodaj lub usuń przyciski pojawi się menu z nazwami wszystkich dostępnych przycisków paska narzędzi
Rysunek 2.42. Kliknij nazwę przycisku, który chcesz usunąć lub dodać do wybranego paska narzędzi. Kliknij poza menu, aby zatwierdzić zmianę
Rysunek 2.43. Aby przywrócić pasek narzędzi do oryginalnego pierwotnego stanu, kliknij trójkąt na jego końcu, umieść wskaźnik myszy nad opcją Dodaj lub usuń przyciski i wybierz opcję Resetuj pasek narzędzi |
Dostosowywanie pasków narzędzi FrontPage pozwala dodawać i usuwać przyciski pasków narzędzi. Można dodawać przyciski do istniejących pasków narzędzi lub tworzyć nowe, puste paski narzędzi i dodawać do nich potrzebne przyciski. Aby dodać lub usunąć przyciski:
Wskazówka
|
Aby dostosować istniejący pasek narzędzi:
|
Rysunek 2.44. Aby dodać przyciski niedostępne w menu Dodaj lub usuń przyciski, wybierz opcję Dostosuj
Rysunek 2.45. W panelu Kategorie kliknij nazwę kategorii, a następnie w panelu Polecenia kliknij nazwę polecenia, które chcesz dodać do paska narzędzi
Rysunek 2.46. Po wybraniu polecenia przeciągnij goprzesuń je na modyfikowany pasek narzędzi |
Rysunek 2.47. Aby stworzyć nowy pasek narzędzi, z menu Narzędzia wybierz pozycję Dostosuj
Rysunek 2.48. Wyświetl kartę Paski narzędzi okna dialogowego Dostosowywanie, a następnie kliknij przycisk Nowy
Rysunek 2.49. Podaj opisową nazwę dla nowego paska narzędzi i kliknij przycisk OK
Rysunek 2.50. Kliknij i przeciągnij przesuń nazwę polecenia z panelu Polecenia na nowy pasek narzędzi. Po dodaniu wszystkich potrzebnych przycisków, kliknij przycisk Zamknij |
Aby stworzyć nowy pasek narzędzi:
Wskazówka
|
Aby usunąć pasek narzędzi:
|
Rysunek 2.51. Aby usunąć pasek narzędzi, z menu Widok wybierz pozycję Paski narzędzi, a następnie pozycję Dostosuj
Rysunek 2.52. Po pojawieniu się okna dialogowego Dostosowywanie wyświetl kartę Paski narzędzi, kliknij nazwę paska narzędzi przeznaczonego do usunięcia i kliknij przycisk Usuń |
Rysunek 2.53. Polecenia menu Plik służą do tworzenia, otwierania, zamykania, zapisywania, publikowania oraz importowania stron lub witryn internetowych
Rysunek 2.54. Większość poleceń menu Edycja działa tak samo jak w innych programach. Piąta sekcja tego menu pozwala kontrolować dostęp do plików, jeżeli nad witryną internetową pracuje więcej niż jedna osoba
Rysunek 2.55. Menu Widok pozwala wyświetlić lub ukryć sześć widoków programu FrontPage oraz jego paski narzędzi |
Menu Pasek menu usytuowany wzdłuż górnej krawędzi okna programu FrontPage jest widoczny podczas wykonywania wszystkich zadań. Jednak niektóre polecenia menu są dostępne podczas wykonywania konkretnych zadań. Na przykład poleceń menu Ramki można używać tylko podczas oglądania lub edytowania stron internetowych z ramkami. Menu Plik Polecenia menu Plik służą do tworzenia, otwierania, zamykania, zapisywania, publikowania oraz importowania stron lub witryn internetowych (rysunek 2.53). Menu Plik pozwala również zdefiniować ustawienia wydruku, zmienić właściwości programu FrontPage i zakończyć program. Menu Edycja Większość poleceń menu Edycja działa tak samo jak w innych programach - z wyjątkiem piątej sekcji tego menu (rysunek 2.54). Sekcja ta pozwala stworzyć system ewidencji w celu kontrolowania wersji plików, jeżeli nad witryną internetową pracuje więcej niż jedna osoba. Menu Widok Większość poleceń menu Widok odpowiada ikonom paska widoków (rysunek 2.55). Pozycja Paski narzędzi wywołuje podmenu, dzięki któremu można wyświetlić lub ukryć dowolny z dwunastu pasków narzędzi programu FrontPage. |
Menu Wstaw Jak sugeruje nazwa, menu Wstaw służy do wstawiania różnych składników strony internetowej: podziałów, dat, hiperłączy, apletów Java, składników pakietu Office XP oraz Office 2000, na przykładnp. wykresów i arkuszy itp. (rysunek 2.56). Menu Format Polecenia menu Format kontrolują wygląd tekstu, znaczników HTML oraz motywów odpowiedzialnych za graficzny wygląd witryny internetowej (rysunek 2.57). Menu Narzędzia Menu Narzędzia pozwala na modyfikację wielu opcji programu FrontPage (rysunek 2.58). Umożliwia ponadto dostęp do słownika oraz tezaurusa programu FrontPage. |
Rysunek 2.56. Menu Wstaw służy do umieszczania na stronach internetowych różnych składników: podziałów, dat, hiperłączy, apletów Java, składników pakietu Office itp.
Rysunek 2.57. Menu Format kontroluje wygląd tekstu, a jego polecenia generalnie odpowiadają przyciskom dostępnym na pasku narzędzi Formatowanie
Rysunek 2.58. Menu Narzędzia udostępnia opcje programu FrontPage, a także słownik i tezaurus |
Rysunek 2.59. Menu Tabela służy do tworzenia i dostosowywania tabel, a jego polecenia generalnie odpowiadają przyciskom dostępnym na pasku narzędzi Tabele
Rysunek 2.60. Menu Ramki posiada polecenia do pracy nad stronami z ramkami (niedostępne podczas oglądania stron bez ramek)
Rysunek 2.61. Menu Okno służy do wyświetlania otwartego okna
Rysunek 2.62. Menu Pomoc udostępnia system pomocy programu FrontPage 2002 |
Menu Tabela Menu Tabela posiada polecenia do tworzenia tabel oraz do dopracowywania układu indywidualnych wierszy i kolumn (rysunek 2.59). Menu Ramki Polecenia menu Ramki są dostępne jedynie podczas pracy nad stroną z ramkami HTML (rysunek 2.60). Aby stworzyć stronę z ramkami, wybierz Plik → Nowy → Strona lub sieć Web (Ctrl+N). Więcej informacji na ten temat zawiera rozdział 11., Tworzenie i formatowanie ramek. Menu Okno Można otworzyć wiele stron i witryn internetowych jednocześnie. Menu Okno pozwala przełączać się między otwartymi oknami (rysunek 2.61). Aby wyświetlić otwartą stronę, można również kliknąć kartę tej strony. Menu Pomoc Menu Pomoc, znane z wszystkich programów pakietu Office XP, udostępnia system pomocy programu FrontPage 2002 (rysunek 2.62). |
Aby skorzystać z pomocy programu FrontPage:
|
Rysunek 2.63. Aby uruchomić pomoc programu FrontPage, z menu Pomoc wybierz pozycję Microsoft FrontPage - Pomoc
Rysunek 2.64. Karta Spis treści wyświetla tematy pomocy programu FrontPage. Prawy panel wyświetla zawartość tematu wybranego w lewym panelu
Rysunek 2.65. Karta Kreator odpowiedzi pozwala zadać pytanie. Jest to czasem najlepszy sposób na uzyskanie pomocy, jeżeli nie wiesz, czego dokładnie szukasz
Rysunek 2.66. Karta Indeks pozwala odszukać konkretny termin lub zwrot. Wpisz szukany tekst w polu 1. i kliknij przycisk Wyszukaj. Uściślij swoją kwerendę posługując się wstępnymi wynikami wyświetlonymi w polu 2. (słowa kluczowe) lub w polu 3. (tematy). Kliknij dwa razy pozycję w polu 2. lub 3., aby wyświetlić pełny tekst w prawym panelu. Aby rozpocząć nowe wyszukiwanie, kliknij przycisk Wyczyść |
Rysunek 2.67. Aby szybko uzyskać pomoc, wpisz pytanie do pola tekstowego pomocy, naciśnij klawisz Enter, po pojawieniu się listy tematów kliknij jedną z opcji i wybierz pozycję w oknie pomocy |
Wskazówki
|
Tworzenie, otwieranie, zapisywanie i zamykanie stron internetowych Stronę internetową można zbudować na trzy sposoby: można stworzyć nową stronę od zera początku i zapisać ją; można stworzyć nową stronę z posługując się szablonemu; można również otworzyć stronę istniejącą, zmodyfikować ją i zapisać pod nową nazwą za pomocą okna dialogowego Zapisywanie jako. Więcej informacji o szablonach zawiera podrozdział Szablony i motywy w rozdziale 3., Tworzenie witryny internetowej. Aby stworzyć nową pustą stronę internetową:
Wskazówka
|
Rysunek 2.68. Aby stworzyć nową stronę internetową, z menu Plik wybierz pozycję Nowy, a następnie pozycję Strona lub sieć Web albo kliknij przycisk Nowa strona (Ctrl+N)
Rysunek 2.69. Jeżeli korzystasz z okienka zadań, kliknij opcję Pusta strona, aby utworzyć nową stronę internetową
Rysunek 2.70. Nowa pusta strona internetowa posiada domyślny tytuł |
Rysunek 2.71. Aby otworzyć istniejącą stronę internetową, z menu Plik wybierz pozycję Otwórz lub kliknij przycisk Otwórz (Ctrl+O)
Rysunek 2.72. Po pojawieniu się okna dialogowego Otwieranie pliku odszukaj plik, który chcesz otworzyć, a następnie kliknij go dwa razy
Rysunek 2.73. FrontPage wyświetla istniejącą stronę internetową
Rysunek 2.74. Jeżeli używasz okienka zadań, kliknij nazwę jednej z ostatnio otwieranych stron internetowych (sekcja Otwórz nową stronę) |
Aby otworzyć istniejącą stronę internetową:
Wskazówki
|
Aby zapisać stronę internetową:
Wskazówka
|
Rysunek 2.75. Aby zapisać stronę internetową, z menu Plik wybierz pozycję Zapisz jako
Rysunek 2.76. Za pomocą przycisków okna dialogowego Zapisywanie jako odszukaj miejsce, w którym chcesz zapisać stronę internetową, a następnie ustaw nadaj jej tytuł, klikając przycisk Zmień tytuł
Rysunek 2.77. W oknie dialogowym Ustawianie tytułu strony wpisz tekst, który ma się pojawić na pasku tytułu przeglądarek internetowych i kliknij przycisk OK
Rysunek 2.78. Podaj nazwę dla pliku strony internetowej i kliknij przycisk Zapisz
Rysunek 2.79. Jeżeli podczas zapisywania strony internetowej nie ustawisz nadasz jej tytułu, na pasku tytułu przeglądarki internetowej pojawi się przypadkowy tekst |
Rysunek 2.80. Aby zapisać stronę internetową pod inną nową nazwą, z menu Plik wybierz pozycję Zapisz jako
Rysunek 2.81. Aby zamknąć stronę internetową, z menu Plik wybierz pozycję Zamknij lub kliknij X w prawym górnym rogu okna strony |
Aby zapisać stronę internetową pod inną nową nazwą:
Aby zamknąć stronę internetową:
|
Drukowanie stron internetowych Chociaż nie można wydrukować całej witryny internetowej na raz, można wydrukować jej poszczególne strony. Aby wydrukować stronę internetową:
|
Rysunek 2.82. Okno podglądu wydruku pozwala sprawdzić każdą stronę osobno, obejrzeć dwie strony jednocześnie oraz obejrzeć zobaczyć stronę w powiększeniu
Rysunek 2.83. Aby wydrukować bieżącą stronę internetową, z menu Plik wybierz pozycję Drukuj |
Rysunek 2.84. Aby stworzyć nową witrynę internetową, z menu Plik wybierz pozycję Nowy, a następnie - pozycję Strona lub sieć Web albo kliknij przycisk Nowy dostępny na pasku narzędzi i z menu wybierz pozycję Sieć Web
Rysunek 2.85. Jeżeli korzystasz z okienka zadań, kliknij pozycję Pusta sieć Web
Rysunek 2.86. Kliknij przycisk Przeglądaj, aby odszukać folder, w którym chcesz zapisać witrynę internetową. FrontPage zapisze witrynę w folderze podanym w polu Określ lokalizację nowej sieci Web |
Tworzenie, otwieranie i zamykanie witryn internetowych Witryna internetowa (w terminologii firmy Microsoft -witryna sieci Web) to zbiór stron internetowych połączonych ze sobą za pomocą hiperłączy. Jednak Iistnieją również witryny zawierające tylko jedną stronę internetową. FrontPage automatycznie zarządza wszystkimi dokumentami i obiektami graficznymi tworzącymi witrynę internetową. Jeżeli zmienisz położenie strony, FrontPage zadba obędzie aktualizował aktualizację hiperłączay prowadząceych do tej strony oraz hiperłączay z niej wychodząceych. Nie trzeba się więc martwić o łącza zerwane łącza. Aby stworzyć nową pustą witrynę internetową:
|
Wskazówki
|
Rysunek 2.87. Okno dialogowe Tworzenie nowej sieci Web pojawia się na momentprzez chwilę podczas generowania witryny internetowej
Rysunek 2.88. Po wygenerowaniu nowej witryny internetowej FrontPage wyświetla puste okno
Rysunek 2.89. Kliknij ikonę Nawigacja dostępną na pasku widoków, aby Aby wyświetlić widok Nawigacja, kliknij ikonę Nawigacja dostępną na pasku widoków, a następnie kliknij przycisk Nowa strona, aby utworzyć pustą stronę startową, kliknij przycisk Nowa strona |
Rysunek 2.90. Aby utworzyć witrynę internetową z szablonuposługjąc się szablonem, w okienku zadań kliknij pozycję Szablony witryn sieci Web
Rysunek 2.91. W oknie dialogowym Szablony witryn sieci Web wybierz ikonę szablonu lub kreatora i kliknij przycisk OK
Rysunek 2.92. Po pojawieniu się strony startowej witryny internetowej wygenerowanej przez kreatora możesz przystąpić do modyfikowania zawartości poszczególnych stron witryny |
Aby utworzyć witrynę internetową z szablonuposługując się szablonem:
|
Aby otworzyć istniejącą witrynę internetową:
Wskazówka
Aby zamknąć witrynę internetową:
|
Rysunek 2.93. Aby otworzyć istniejącą witrynę internetową, z menu Plik wybierz pozycję Otwórz sieć Web
Rysunek 2.94. Po pojawieniu się okna dialogowego Otwieranie sieci Web odszukaj istniejącą witrynę internetową i kliknij przycisk Otwórz
Rysunek 2.95. Kliknij ikonę Foldery, aby obejrzeć wszystkie pliki witryny internetowej
Rysunek 2.96. Kliknij ikonę Nawigacja, aby obejrzeć strukturę nawigacji witryny internetowej
Rysunek 2.97. Aby zamknąć witrynę internetową, z menu Plik wybierz pozycję Zamknij sieć Web |
Rozdział 3. Tworzenie witryny internetowej
|
Jak wyjaśniliśmy w rozdziale 1., FrontPage 2002 - wprowadzenie, przed utworzeniem witryny internetowej należy zastanowić się nad jej celem i adresatami. Zakładając, że rozważyłeś już każdą z tych kwestii, w niniejszym rozdziale wyjaśnimy, jak stworzyć witrynę internetową. Widok Nawigacja programu FrontPage 2002 jest wyposażony w kilka znakomitych narzędzia do tworzenia i modyfikowania struktury witryny internetowej. Ponieważ podczas modyfikowania struktury witryny internetowej FrontPage automatycznie aktualizuje hiperłącza stron, można więc swobodnie eksperymentować ze strukturą witryny aż do osiągnięcia zadawalającego zadowalającego rezultatu. |
Aby stworzyć strukturę witryny internetowej:
Wskazówki
|
Rysunek 3.1. Kliknij ikonę Nawigacja dostępną na pasku widoków, aby wyświetlić widok Nawigacja
Rysunek 3.2. Aby dodać nową stronę do struktury witryny internetowej, kliknij stronę prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Nowy, a następnie pozycję Strona lub naciśnij kombinację klawiszy (Ctrl+N)
Rysunek 3.3. Nowa strona o domyślnej nazwie zostanie dołączona do zaznaczonej strony
Rysunek 3.4. Za pomocą polecenia Nowy → Strona bardzo szybko można stworzyć strukturę witryny internetowej
Rysunek 3.5. Aby ukryć Listę listę folderów wyświetlającą foldery i pliki witryny internetowej, z menu Widok wybierz pozycję Lista folderów, kliknij przycisk Okienko przełączania dostępny na pasku narzędzi lub kliknij X okna Listy folderów |
Rysunek 3.6. Aby zmodyfikować tytuł strony, wyróżnij ją, naciskając klawisz Tab. Wpisz nowy tytuł i naciśnij klawisz Enter
Rysunek 3.7. Naciśnij klawisz Tab lub Enter, aby Aby przejść do następnej strony i zmodyfikować zmienić jej tytuł, naciśnij klawisz Tab lub Enter
Rysunek 3.8. Aby zmodyfikować zmienić tytuł strony, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Zmień nazwę
Rysunek 3.9. Aby porównać tytuł strony z nazwą jej pliku, kliknij stronę prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości (widok Nawigacja) lub Właściwości strony (widok Strona)
Rysunek 3.10. Okna dialogowe Właściwości oraz Właściwości strony pozwalają porównać nazwę pliku strony (pole Nazwa pliku lub Lokalizacja) z tytułem strony (pole Tytuł) |
Aby zmodyfikować zmienić tytuł strony internetowej:
Wskazówki
|
Aby zmodyfikować zmienić nazwę pliku strony internetowej:
Wskazówka
|
Rysunek 3.11. Aby zmodyfikować zmienić nazwę pliku strony internetowej, kliknij ten plik w panelu Lista folderów
Rysunek 3.12. Nowa nazwa pliku strony pojawi się w panelu Lista folderów oraz na karcie strony
Rysunek 3.13. Aby zmodyfikować zmienić nazwę pliku strony, kliknij ten plik prawym przyciskiem myszy w panelu Lista folderów i z menu kontekstowego wybierz pozycję Zmień nazwę |
Rysunek 3.14. Aby przesunąć stronę, najpierw kliknij reprezentujący ją żółty symbol - kolor symbolu zmieni się na niebieski
Rysunek 3.15. Podczas przeciągania przesuwania strony szara linia wskazuje dostępne dla niej miejsca docelowe dla przeciąganej strony
Rysunek 3.16. Przeciągaj Przesuwaj stronę tak długo, aż szara linia wskaże właściwe dla niej miejsce docelowe dla przeciąganej strony
Rysunek 3.17. Zwolnij przycisk myszy - przeciągana przesuwana strona zajmie nowe położenie w strukturze nawigacyjnej witryny internetowej |
Modyfikacja struktury nawigacyjnej witryny internetowej Możliwość modyfikowania struktury nawigacyjnej witryny internetowej bez naruszania łączy między jej stronami należy do największych zalet programu FrontPage. Strukturę nawigacyjną witryny można modyfikować w widoku Nawigacja, gdzie w którym każdą stronę witryny reprezentuje prostokątny symbol, a cała witryna wygląda jak schemat organizacyjny. Widok Nawigacja jest znakomitym miejscem do rozpoczęcia tworzenia nowej witryny i eksperymentowania z różnymi strukturami. Możesz tu zmienić położenie pojedynczej strony lub grupy stron i ocenić, czy osiągnąłeś zadawalający zadowalający rezultat. Jeżeli nie, możesz dokonać kolejnej modyfikacji. Podczas modyfikowania zmian struktury witryny FrontPage dba o aktualizacjębędzie aktualizował wszystkich wszystkie łączya. Aby przesunąć pojedynczą stronę:
|
Wskazówki
|
Rysunek 3.18. Aby przesunąć stronę o jeden poziom w górę, kliknij ją i przeciągaj tak długo aż szara linia wskaże poziom, na którym strona ta ma się znajdować. Zwolnij przycisk myszy - strona zostanie przeniesiona w nowe miejsce
Rysunek 3.19. Aby zapisać zmiany w strukturze nawigacyjnej, prawym przyciskiem myszy kliknij dowolne miejsce (poza strukturą nawigacyjną) w widoku Nawigacja i z menu kontekstowego wybierz pozycję Zastosuj zmiany |
Rysunek 3.20. Aby zmienić położenie grupy stron, kliknij najwyższą stronę poddrzewa stron przeznaczonego do przesunięcia i przeciągnij ją w nowe miejsce
Rysunek 3.21. Po zwolnieniu przycisku myszy, przeciągana przesuwana strona wraz z jej poddrzewem zajmie nowe położenie w strukturze nawigacyjnej witryny internetowej
Rysunek 3.22. Poddrzewo można przesunąć nawet gdy jest ono zwinięte (strona ze zwiniętym poddrzewem posiada symbol +) - wystarczy kliknąć i przesunąć widoczną stronę
Rysunek 3.23. Po zwolnieniu przycisku myszy, przeciągana przesuwana strona wraz z jej zwiniętym poddrzewem zajmie nowe położenie w strukturze nawigacyjnej witryny internetowej |
Aby przesunąć grupę stron:
Wskazówka
|
Dodawanie i usuwanie stron Nie zawsze można stworzyć wszystkie strony witryny internetowej w widoku Nawigacja. Czasem do struktury nawigacyjnej trzeba dodać istniejącą stronę (na przykładnp. stronę internetową zaimportowaną przeniesioną z innego programu). Od czasu do czasu trzeba też stronę internetową usunąć ze struktury nawigacyjnej. Aby dodać istniejącą stronę do struktury witryny internetowej:
Wskazówka
|
Rysunek 3.24. Aby dodać istniejącą stronę do struktury nawigacyjnej witryny, wybierz ją w panelu Lista folderów i dołącz do struktury
Rysunek 3.25. Zwolnij przycisk myszy - przeciągana przesuwana strona zostanie dodana do struktury nawigacyjnej witryny |
Rysunek 3.26. Aby usunąć istniejącą stronę ze struktury nawigacyjnej witryny, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Usuń
Rysunek 3.27. Upewnij się, że wybrano opcję Usuń stronę ze struktury nawigacji i kliknij przycisk OK
Rysunek 3.28. FrontPage usunie stronę ze struktury nawigacyjnej witryny, ale nie z Listy listy folderów |
Aby usunąć istniejącą stronę ze struktury nawigacyjnej witryny:
Wskazówka
|
Kontrola widoku struktury witryny Podczas pracy nad strukturą nawigacyjną witryny dużo czasu spędza się w widoku Nawigacja. Z tego powodu FrontPage jest wyposażony w wiele narzędzi ułatwiających pracę w tym widoku. Strukturę nawigacyjną można oglądać w całości lub tylko w części. Można ją oglądać w powiększeniu oraz w orientacji poziomej poziomie lub w pionowejpionie. To, w jaki sposób oglądasz strukturę nawigacji, zależy wyłącznie do Ciebie. Aby zwinąć strukturę nawigacyjną witryny:
Aby rozwinąć strukturę nawigacyjną witryny:
Wskazówka
|
Rysunek 3.29. Aby zwinąć strukturę witryny, kliknij symbol - strony w celu ukrycia jej pod-stron
Rysunek 3.30. Symbol + informuje, że strona posiada ukryte pod-strony
Rysunek 3.31. Aby rozwinąć lub zwinąć strukturę witryny, kliknij przycisk Pokaż tylko poddrzewo dostępny na pasku narzędzi Nawigacja |
Rysunek 3.32. Aby wyświetlić tylko poddrzewo wybranej strony, kliknij ją i z menu kontekstowego wybierz pozycję Pokaż tylko poddrzewo
Rysunek 3.33. Po wybraniu polecenia Pokaż tylko poddrzewo FrontPage ukryje wszystkie strony powyżej poziomu wybranej strony
Rysunek 3.34. Aby rozwinąć poddrzewo, kliknij strzałkę wychodzącą z najwyżej położonej strony poddrzewa
Rysunek 3.35. Jeżeli klikniesz strzałkę poddrzewa, FrontPage wyświetli strukturę nawigacyjną całej witryny |
Aby wyświetlić tylko poddrzewo:
Aby rozwinąć poddrzewo:
|
Aby zmienić orientację położenie struktury nawigacyjnej:
Wskazówka
|
Rysunek 3.36. Aby zmienić orientację struktury nawigacyjnej, kliknij prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Orientacja pozioma/-pionowa
Rysunek 3.37. Teraz struktura nawigacyjna posiada orientację poziomą
Rysunek 3.38. Aby zmienić orientację struktury nawigacyjnej witryny, kliknij przycisk Orientacja pozioma/-pionowa dostępny na pasku narzędzi Nawigacja |
Rysunek 3.39. Aby zmienić skalę wyświetlania struktury nawigacyjnej, kliknij prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Powiększenie, a następnie wybierz procent lub pozycję Dopasuj rozmiar
Rysunek 3.40. Aby szybko zmienić skalę wyświetlania struktury nawigacyjnej, wybierz jedną z opcji listy rozwijanej dostępnej na pasku narzędzi Nawigacja |
Aby zmienić skalę wyświetlania struktury nawigacyjnej:
Wskazówka
|
Paski łączy i obramowanie wspólne FrontPage 2002 jest wyposażony w narzędzia do tworzenia pasków łączy, ulepszonej i łatwiejszej w użyciu wersji pasków nawigacyjnych znanych z poprzedniej edycji programu FrontPage. Pasek łączy pozwala stworzyć zbiór hiperłączy dla grupy stron lub dla całej witryny internetowej. Pasek łączyJest on jest lepszy od indywidualnych hiperłączy z paru powodów. Po pierwsze, wystarczy go stworzyć raz, a następnie dodać do dowolnej liczby stron. Po drugie, umożliwia on budowę łącz dostępnych na wszystkich stronach witryny, dzięki którym użytkownicy mogą szybko przejeść do strony startowej i innych ważnych stron witryny. Pasek łączy można stworzyć na dwa sposoby: można go zbudować od zera początku i umieścić na odpowiednich stronach lub poinstruować program FrontPage 2002dać polecenie, aby program wstawił pasek łączy odzwierciedlający strukturę nawigacyjną bieżącej witryny internetowej. Na przykład, np. FrontPage może wygenerować hiperłącza do każdej strony usytuowanej powyżej wybranej strony (strony nadrzędnej), do wszystkich stron usytuowanych na tym samym poziomie co jak wybrana strona lub do każdej strony usytuowanej poniżej wybranej strony (strony podrzędnej). W każdym przypadku FrontPage dba o aktualizacjębędzie aktualizował paskiów łączy, ilekroć zmieni się struktura nawigacyjna witryny. Na danej stronie można umieścić więcej niż jeden pasek łączy, tworząc w ten sposób kilka różnych poziomów nawigacji. Na przykład, np. strona może posiadać pasek łączy prowadzących do stron usytuowanych najwyżej w strukturze nawigacyjnej witryny oraz pasek łączy prowadzących do poprzedniej i następnej strony usytuowanej położonej na tym samym poziomie co jak ta strona. Można również stworzyć pasek z łączami niestandardowymi i umieścić go na konkretnej stronie. Więcej informacji na ten temat zawiera podrozdział Aby stworzyć pasek z łączami niestandardowymi. Przed dodaniem pasków łączy należy stworzyć strukturę nawigacyjną witryny. Jeżeli jeszcze tego nie zrobiłeś, wróć do początku tego rozdziału. Paski łączy można stworzyć przed lub po dodaniemu zawartości do stron lub po. |
|
|
Niektórzy, w tym również ja, uważają, że paski łączy należy stworzyć przed umieszczeniem na stronie innych elementów, ponieważ dzięki temu osiąga się większą spójność projektu witryny. Inni natomiast twierdzą, że najpierw na stronie należy umieścić tekst, grafikę i inne składniki, a dopiero potem dodać do niej paski łączy. Jeżeli należysz do tych osób, przejdź do części 2. niniejszej książki i wróć do tego rozdziału po zbudowaniu stron, aby dowiedzieć się, jak połączyć je w całość. Obramowanie wspólne to obszar, w którym można umieścić elementy wymagające regularnej aktualizacji, na przykład znaki firmowe, informacje o prawach autorskich lub numery telefoniczne. Dzięki obramowaniu wspólnemu wystarczy zmodyfikować dany element w jednym miejscu, a FrontPage zadba o jego aktualizacjębędzie go aktualizował w całej witrynie. Chociaż wiele witryn do tego celu używa ramek, ramki nie są one tak dobrym rozwiązaniem jak obramowanie wspólne. Mimo że w obramowaniu wspólnym można umieścić paski łączy, nie jest to najlepsze rozwiązanie, ponieważ trudno stworzyć pasek łączy pasujący do więcej niż jednej strony. Aby temu zaradzić, można wyłączyć obramowanie wspólne dla poszczególnych stron lub stworzyć wiele zestawów pasków z łączami niestandardowymi. Więcej informacji na ten temat zawierają podrozdziały Aby usunąć obramowanie wspólne z pojedynczej strony oraz Aby stworzyć pasek z łączami niestandardowymi. Najlepiej jednak nie wstawiać pasków łączy do obramowania wspólnego. W przypadku dużej witryny internetowej można stworzyć spis treści lub mapę witryny. Więcej informacji na ten temat zawiera podrozdział Dodawanie spisu treści witryny internetowej w rozdziale 9., Multimedia i składniki sieci Web. |
Aby stworzyć pasek łączy oparty na strukturze nawigacyjnej:
|
Rysunek 3.41. Umieść kursor w miejscu, w którym ma się pojawić pasek łączy, i z menu Wstaw wybierz pozycję Nawigacja
Rysunek 3.42. Po pojawieniu się okna dialogowego Wstawianie składnika sieci Web wybierz pozycję Pasek oparty na strukturze nawigacyjnej
Rysunek 3.43. Wybierz jeden z wielu wbudowanych stylów paska łączy |
Rysunek 3.44. Wybierz orientację poziomą lub pionową dla paska łączy
Rysunek 3.45. Karta Ogólne okna dialogowego Właściwości paska łączy posiada przyciski opcji decydujące o tym, które strony mają zostać uwzględnione w pasku łączy
Rysunek 3.46. Pasek łączy oparty na strukturze nawigacyjnej wzdłuż górnej krawędzi strony internetowej |
Wskazówka
|
Opcje paska łączy opartego na strukturze nawigacyjnej W oknie dialogowym Właściwości paska łączy można nie tylko wskazać strony, które FrontPage ma uwzględnić w pasku łączy (rysunek 3.45), ale również zdefiniować wygląd łączy.
|
Rysunek 3.47. Sekcja Hiperłącza, które mają być dodane do strony, zawiera diagram wyświetlający strony, które zostaną połączone ze stroną bieżącą
Rysunek 3.48. Oprócz sześciu głównych opcji, okno dialogowe Właściwości paska łączy pozwala dodać łącza do strony głównej i (lub) do strony nadrzędnej
Rysunek 3.49. Karta Styl okna dialogowego Właściwości paska łączy pozwala określić wygląd łączy |
Rysunek 3.50. Aby zmodyfikować standardowe etykiety pasków łączy, w widoku Nawigacja kliknij prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Ustawienia sieci Web
Rysunek 3.51. Aby uzyskać dostęp do etykiet pasków łączy, wyświetl kartę Nawigacja okna dialogowego Ustawienia sieci Web
Rysunek 3.52. Zmień standardowy tekst etykiet, wpisując nowy tekst w odpowiednich polach, i kliknij przycisk OK. Nowe etykiety zostaną zastosowane tylko w bieżącej witrynie internetowej |
Modyfikacja etykiet wykorzystywanych w paskach łączy opartych na strukturze nawigacyjnej Jeżeli zastosujesz paski łączy oparte na strukturze nawigacyjnej, FrontPage użyje zestawu standardowych etykiet: dla strony głównej - Strona główna, dla strony nadrzędnej - W górę, dla strony poprzedniej - Wstecz, a dla strony następnej - Dalej. W wielu przypadkach nie ma powodu zmienić tych etykiet. Czasem jednak trzeba zmodyfikować standardowe etykiety, aby wyświetlić konkretną informację, na przykład łącze prowadzące do strony głównej witryny Helion.com może wyświetlać etykietę „Helion”. FrontPage pozwala swobodnie modyfikować etykiety łączy. Aby zmodyfikować etykiety wykorzystywane w paskach łączy opartych na strukturze nawigacyjnej:
Wskazówki
|
Aby pojedyncza strona nie została uwzględniona w pasku łączy opartym na strukturze nawigacyjnej:
|
Rysunek 3.53. Aby dana strona nie pojawiła się w pasku łączy, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Dołączone do pasków nawigacyjnych
Rysunek 3.54. Strony nieuwzględniane w pasku łączy opartym na strukturze nawigacyjnej mają szary kolor |
Rysunek 3.55. Przed utworzeniem paska z łączami wstecz i dalej dodaj do struktury nawigacyjnej kilka stron usytuowanych na tym samym poziomie
Rysunek 3.56. Umieść kursor w miejscu, w którym chcesz wstawić pasek łączy, i z menu Wstaw wybierz pozycję Nawigacja
Rysunek 3.57. Po pojawieniu się okna dialogowego Wstawianie składnika sieci Web kliknij pozycję Pasek z łączami wstecz i dalej
Rysunek 3.58. Wybierz jeden z wybudowanych stylów dla paska łączy |
Tworzenie pasków z łączami wstecz Wstecz i dalej Dalej oraz z łączami niestandardowymi Można by sądzić, że pasek z łączami wstecz Wstecz i dalej Dalej działa tak samo jak pasek łączy oparty na strukturze nawigacyjnej, ponieważ i jeden i drugi zależy od struktury witryny. W rzeczywistości jednak, proces tworzenia paska z łączami wstecz Wstecz i dalej Dalej przebiega tak samo jak proces tworzenia paska z łączami niestandardowymi. Aby stworzyć pasek z łączami wstecz Wstecz i dalejDalej:
|
|
Rysunek 3.59. W panelu Wybierz orientację wskaż orientację - poziomą lub pionową - dla paska łączy i kliknij przycisk Zakończ
Rysunek 3.60. Po wpisaniu nazwy w polu Nazwa okna dialogowego Tworzenie nowego paska łączy kliknij przycisk OK - nazwa paska łączy pojawi się w polu Wybierz istniejące okna dialogowego Właściwości paska łączy
Rysunek 3.61. Kliknij przycisk Dodaj łącze, aby Aby zbudować zbiór stron powiązanych łączami wstecz i dalej, kliknij przycisk Dodaj łącze |
Rysunek 3.62. Wybierz bieżącą stronę jako pierwsze łącze paska łączy, a w polu Tekst do wyświetlenia podaj łatwą do rozpoznawania etykietę dla tego łącza
Rysunek 3.63. FrontPage dodał łącze do łącz wyświetlanych na liście Łącza w oknie dialogowym Właściwości paska łączy
Rysunek 3.64. Po zbudowaniu listy łączy kliknij przycisk OK |
|
Wskazówki
|
Rysunek 3.65. Ostatnia strona posiadająca pasek z łączami wstecz i dalej wyświetla tylko łącze wstecz
Rysunek 3.66. Pasek z łączami wstecz i dalej pozwala wyświetlać kolejne strony usytuowane w strukturze nawigacyjnej na tym samym poziomie
Rysunek 3.67. Aby odszukać stronę w innym folderze niż bieżący, kliknij jeden z przycisków paska Połącz z lub Szukaj w |
Rysunek 3.68. W oknie dialogowym Wstawianie składnika sieci Web kliknij pozycję Pasek z łączami niestandardowymi
Rysunek 3.69. Wybierz styl wbudowany dla paska łączy
Rysunek 3.70. Wybierz orientację - poziomą lub pionową - dla paska łączy i kliknij przycisk Zakończ |
Aby stworzyć pasek z łączami niestandardowymi:
|
Wskazówka
|
Rysunek 3.71. W polu Tekst do wyświetlenia okna dialogowego Dodawanie do paska łączy stwórz etykiety łączy niestandardowych
Rysunek 3.72. Po zbudowaniu listy łączy niestandardowych kliknij przycisk OK
Rysunek 3.73. Paski z łączami niestandardowymi wyświetlają łącza nieuwzględniane w paskach łączy opartych na strukturze nawigacyjnej |
Rysunek 3.74. Aby zmodyfikować pasek z łączami wstecz i dalej lub pasek z łączami niestandardowymi, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości paska nawigacyjnego
Rysunek 3.75. Karta Ogólne okna dialogowego Właściwości paska łączy służy do dodawania, usuwania i modyfikowania łączy oraz do przenoszenia ich w górę lub w dół |
Modyfikacja właściwości paska łączy FrontPage automatycznie aktualizuje hiperłącza pasków łączy podczas modyfikowania struktury nawigacyjnej witryny internetowej. Aby natomiast zmodyfikować grafikę, orientację, zestaw łączy, etykiety łączy lub porządek połączeńłączy w paskau łączy, należy skorzystać z okna dialogowego Właściwości paska łączy. Właściwości paska łączy można modyfikować w dowolnym momencie. Sposób modyfikowania paska łączyzmian zależy od typu paska. Można również zmienić tekst standardowych etykiet pasków łączy opartych na strukturze nawigacyjnej i pasków z łączami wstecz Wstecz i dalejDalej. Aby edytować pasek z łączami wstecz Wstecz i dalej Dalej lub pasek z łączami niestandardowymi:
|
|
Rysunek 3.76. W oknie dialogowym Modyfikuj łącze można zmienić stronę docelową łącza
Rysunek 3.77. Karta Styl okna dialogowego Właściwości paska łączy pozwala zmodyfikować styl graficzny, orientację i wygląd paska łączy |
Rysunek 3.78. Aby stworzyć obramowanie wspólne dla wszystkich stron witryny, z menu Format wybierz pozycję Obramowanie wspólne. W podobny sposób możesz wyłączyć obramowanie wspólne dla pojedynczych stron
Rysunek 3.79. W oknie dialogowym Obramowanie wspólne zaznacz pole wyboru Górne, Lewe, Prawe lub Dolne
Rysunek 3.80. W oknie dialogowym Właściwości obramowania ustaw kolor tła lub obraz obramowania wspólnego
Rysunek 3.81. Obramowanie wspólne - obszar przypominający nagłówki i stopki stron dokumentów drukowanych -zawiera tekst i grafikę widoczną na każdej stronie witryny internetowej |
Aby dodać obramowanie wspólne:
Wskazówka
|
Aby usunąć obramowanie wspólne z pojedynczej strony:
|
Rysunek 3.82. Aby usunąć obramowanie wspólne z bieżącej strony, wybierz opcję Bieżąca strona, wyczyść usuń zaznaczenie wszystkie polach pól wyboru i kliknij przycisk OK
Rysunek 3.83. Strona przedstawiona na rysunku 3.81 po usunięciu obramowania wspólnego |
Rysunek 3.84. Aby utworzyć stronę z szablonu, w okienku zadań kliknij pozycję Szablony stron
Rysunek 3.85. Karta Ogólne okna dialogowego Szablony stron oferuje duży wybórzawiera wiele szablonów stron. Wybierz jeden z nich i kliknij przycisk OK
Rysunek 3.86. Po utworzeniu strony z szablonu można przystąpić do zastępowania nagłówków, tekstu i grafiki nowymi elementami |
Szablony i motywy Szablony i motywy programu FrontPage 2002 pozwalają zaoszczędzić mnóstwo czasu podczas tworzenia stron internetowych. Szablony Ppomagają tworzyć wspaniałe interesujące strony i witryny internetowe, natomiast zaś motywy nadają pojedynczym stronom lub całym witrynom unikatowy ciekawy wygląd. FrontPage posiada również kilka kreatorów, dzięki którym w łatwy sposób można zbudować bardziej złożone strony i witryny. Aby stworzyć stronę z szablonu:
|
|
Rysunek 3.87. Aby zastąpić obraz, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości obrazu
Rysunek 3.88. Kliknij przycisk Przeglądaj okna dialogowego Właściwości obrazu, aby Aby odszukać nowy obraz, kliknij przycisk Przeglądaj okna dialogowego Właściwości obrazu
Rysunek 3.89. Po zastąpieniu standardowych nagłówków, tekstu i grafiki nowymi elementami z menu Plik wybierz pozycję Zapisz (Ctrl+S)
Rysunek 3.90. Odszukaj folder, w którym chcesz zapisać zmodyfikowaną stronę, i kliknij przycisk Zapisz |
Rysunek 3.91. Aby stworzyć witrynę internetową z szablonu, w okienku zadań kliknij pozycję Szablony witryn sieci Web
Rysunek 3.92. W oknie dialogowym Szablony witryn sieci Web wybierz szablon witryny internetowej, odszukaj folder, w którym chcesz ją zapisać, i kliknij przycisk OK
Rysunek 3.93. Wyświetl widok Nawigacja oraz Listę folderów, aby obejrzeć strukturę nawigacyjną oraz wszystkie strony witryny wygenerowanej z szablonu
Rysunek 3.94. Otwórz stronę witryny wygenerowanej powstałej z szablonu i zastąp standardowy tekst i grafikę nowymi elementami. Aby zapisać zmodyfikowaną stronę, z menu Plik wybierz pozycję Zapisz (Ctrl+S) |
Aby stworzyć witrynę internetową z szablonu:
Wskazówki
|
Aby zastosować użyć motywu do budowy strony lub witryny:
|
Rysunek 3.95. Otwórz stronę lub witrynę internetową, do której chcesz zastosować motyw, i z menu Format wybierz pozycję Motyw
Rysunek 3.96. Jeżeli prawy panel okna dialogowego Motywy jest pusty, strona lub witryna internetowa nie posiada jeszcze motywu. W lewym górnym rogu okna dialogowego Motywy wybierz opcję Wszystkie strony lub opcję Zaznaczone strony, aby określić zakres zastosowania motywu
Rysunek 3.97. Wybierz motyw. Prawy panel wyświetli próbkę wybranego motywu |
Rysunek 3.98. Okno dialogowe Motywy w lewym dolnym rogu zawiera cztery pola wyboru - Żywe kolory, Grafika aktywna, Obraz tła lub Zastosuj z arkuszami CSS -dodatkowo wzbogacające wygląd stron internetowych
Rysunek 3.99. Strona internetowa z motywem Citrus Punch |
Wskazówka
|
Aby zmodyfikować motyw:
|
Rysunek 3.100. Kliknij przycisk Modyfikuj okna dialogowego Motywy, aby zmodyfikować motyw
Rysunek 3.101. FrontPage pozwala modyfikować trzy aspekty motywu: kolory, grafikę oraz tekst |
Rysunek 3.102. Karta Schematy kolorów okna dialogowego Modyfikowanie motywu pozwala wybrać zestaw kolorów motywu i określić, czy mają to być kolory normalne czy żywe. Dwie pozostałe karty okna dialogowego Modyfikowanie motywu definiują ustalają kolory poszczególnych elementów
Rysunek 3.103. Jeżeli klikniesz przycisk Grafika okna dialogowego Motywy, FrontPage wyświetli okno dialogowe Modyfikowanie motywu, w którym można zmodyfikować elementy graficzne istniejącego motywu
Rysunek 3.104. Jeżeli klikniesz przycisk Tekst okna dialogowego Motywy, FrontPage wyświetli okno dialogowe Modyfikowanie motywu, w którym można zmodyfikować zmienić czcionkę związaną z każdym elementem HTML |
|
Opcje motywu Motywy wbudowane programu FrontPage można swobodnie modyfikować. W celu wyświetlenia różnych wersji okna dialogowego Modyfikowanie motywu (rysunki 3.102 - 3.104) wykonaj punkty podrozdziału Aby zmodyfikować motyw.
|
Rysunek 3.105. Karta Koło kolorów okna dialogowego Modyfikowanie motywu pozwala zmodyfikować jasność wybranego zestawu kolorów
Rysunek 3.106. Karta Niestandardowy okna dialogowego Modyfikowanie motywu pozwala zmodyfikować kolor poszczególnych elementów HTML motywu
Rysunek 3.107. Z listy rozwijanej okna dialogowego Modyfikowanie motywu (wersja Grafika) wybierz element lub kategorię elementów, które chcesz zmodyfikować |
Rysunek 3.108. Okno dialogowe Styl - wywoływane z okna dialogowego Modyfikowanie motywu - pozwala zmodyfikować czcionki znaczników HTML |
Wskazówka
|
Rozdział 4. Wpisywanie i formatowanie tekstu
|
Jedną z największych zalet programu FrontPage jest to, że wyręcza on autora stron internetowych w pisaniu kodu HTML. Wpisywanie i formatowanie tekstu w programie FrontPage wygląda tak samo jak w zwykłym edytorze tekstu. Oznacza to, że tekst można zaznaczać, przesuwać, wycinać, kopiować, wklejać i formatować za pomocą technik znanych z edytorów tekstu. |
Wpisywanie i edytowanie tekstu Pisanie w programie FrontPage 2002 nie różni się od pisania w zwykłym edytorze tekstu. Po dojściu do prawej krawędzi okna dokumentu kursor automatycznie przechodzi do następnego wiersza. Tekst, podobnie jak w edytorach tekstu, można zaznaczyć za pomocą wskaźnika myszy, a następnie przenieść, skopiować lub wkleić w inne miejsce. Aby wpisać tekst na stronie internetowej:
|
Rysunek 4.1. Aby pracować nad tekstem, wyświetl widok Strona, klikając ikonę Strona dostępną na pasku widoków
Rysunek 4.2. Aby pracować nad tekstem, upewnij się, że karta Normalny jest aktywna
Rysunek 4.3. Lista folderów ułatwia otwieranie poszczególnych plików. Z menu Widok wybierz pozycję Lista folderów lub kliknij przycisk Okienko przełączania
Rysunek 4.4. Kliknij w prawym panelu, aby Aby rozpocząć pisanie, kliknij w prawym panelu.
Rysunek 4.5. Ponieważ kod HTML jest ukryty, wpisywanie Wpisywanie tekstu w programie FrontPage nie różni się niczym od wpisywania tekstu w zwykłym edytorze tekstu, ponieważ kod HTML jest ukryty. |
Rysunek 4.6. Kliknij w miejscu, w którym chcesz wstawić tekst - w miejscu tym pojawi się migotający kursor
Rysunek 4.7. Zacznij pisać w miejscu, w którym znajduje się kursor - wpisywany tekst pojawi się na stronie |
Aby przesunąć kursor:
Wskazówki
|
Aby zaznaczyć tekst:
Aby usunąć tekst:
|
Rysunek 4.8. Kliknij i przeciągnij wskaźnik myszy, aby zaznaczyć tekst
Rysunek 4.9. Naciśnij klawisz Backspace lub Delete, a FrontPage usunie zaznaczony tekst |
Tabela 4.1.
Skróty klawiaturowe - zaznaczanie tekstu
Aby zaznaczyć |
Naciśnij |
Słowo |
kliknij go dwa razy |
Słowo na prawo od kursora |
Shift+Ctrl+→ |
Słowo na lewo od kursora |
Shift+Ctrl+← |
Tekst od kursora do końca wiersza |
Shift+End |
Tekst od kursora do początku wiersza |
Shift+Home |
Tekst od kursora w dół |
Shift+↓ |
Tekst od kursora w górę |
Shift+↑ |
Cały akapit |
Alt+ kliknięcie |
Tekst do końca akapitu |
Ctrl+Shift+↓ |
Tekst do początku akapitu |
Ctrl+Shift+↑ |
Tekst do końca następnego ekranu |
Shift+Page Down |
Tekst do początku poprzedniego ekranu |
Shift+Page Up |
Tabela 4.2.
Skróty klawiaturowe - usuwanie tekstu
Aby usunąć |
Naciśnij |
Znak na prawo od kursora |
Delete |
Znak na lewo od kursora |
Backspace |
Słowo na prawo od kursora |
Ctrl+Delete |
Słowo na lewo od kursora |
Ctrl+Backspace |
Rysunek 4.10. Aby przesunąć tekst, zaznacz go za pomocą wskaźnika myszy
Rysunek 4.11. Kliknij i przesuń zaznaczony tekst w nowe miejsce
Rysunek 4.12. Zwolnij przycisk myszy - FrontPage umieści tekst w nowym miejscu
Rysunek 4.13. Aby wyciąć zaznaczony tekst, z menu Edycja wybierz pozycję Wytnij (Ctrl+X). Aby wkleić tekst, z menu Edycja wybierz pozycję Wklej (Ctrl+V)
Rysunek 4.14. Pasek narzędzi Standardowy posiada narzędzia do wycinania, kopiowania i wklejania tekstu |
Aby przesunąć tekst:
Wskazówki
|
Aby cofnąć akcję:
Aby wykonać wznowić ponownie akcję:
Wskazówki
|
Rysunek 4.15. To, jaką akcję można cofnąć (pozycja Cofnij w menu Edycja) lub wykonać ponownie (pozycja Wykonaj ponownie w menu Edycja), zależy od poprzedniej akcji
Rysunek 4.16. Pasek narzędzi Standardowy posiada przyciski Cofnij i Wykonaj ponownie. Każdy z nich posiada listę niedawno wykonanych akcji |
Rysunek 4.17. Aby wstawić podział wiersza, z menu Wstaw wybierz pozycję Podział
Rysunek 4.18. W oknie dialogowym Podział standardowo jest wybrana opcja Normalny podział wiersza. Kliknij przycisk OK. FrontPage wstawi podział wiersza
Rysunek 4.19. FrontPage utworzył nowy wiersz bez konieczności wpisywania kodu HTML |
Aby wstawić podział wiersza:
Wskazówki
|
Aby dodać akapit:
Wyświetlanie znaczników podziału wiersza i znaczników akapitu FrontPage, podobnie jak zwykłe edytory tekstu, oferuje możliwość pozwala wyświetlenia wyświetlić ukryteych znacznikiów formatowania wskazująceych położenie podziałów wiersza i akapitów. Aby wyświetlić (lub ukryć) znaczniki podziału wiersza i znaczniki akapitu:
|
Rysunek 4.20. Umieść kursor w miejscu, w którym chcesz dodać akapit
Rysunek 4.21. Naciśnij klawisz Enter - FrontPage doda akapit
Rysunek 4.22. Aby wyświetlić (lub ukryć) znaczniki podziału wiersza i znaczniki akapitu, kliknij przycisk Pokaż wszystko dostępny na pasku narzędzi Standardowy
Rysunek 4.23. Przycisk Pokaż wszystko pozwala wyświetlić ukryte symbole wskazujące podziały wiersza i akapity |
Rysunek 4.24. Aby odszukać tekst na bieżącej stronie lub w całej witrynie internetowej, z menu Edycja wybierz pozycję Znajdź
Rysunek 4.25. W oknie dialogowym Znajdowanie i zamienianie wpisz szukane słowo lub wyrażenie i wybierz opcję Bieżąca strona. Wskaż dodatkowe kryteria wyszukiwania i kliknij przycisk Znajdź następny
Rysunek 4.26. Po odszukaniu pierwszego wystąpienia szukanego słowa lub wyrażenia okno dialogowe Znajdowanie i zamienianie nie znika z ekranu. Kliknij przycisk Znajdź następny, aby kontynuować poszukiwania
Rysunek 4.27. Aby przeszukać całą witrynę internetową, wybierz opcję Wszystkie strony, wskaż inne kryteria, a następnie kliknij przycisk Znajdź w sieci Web |
Znajdowanie i zamienianie tekstu Oprócz standardowych funkcji znajdowania i zamieniania tekstu, FrontPage jest wyposażony w narzędzia do przeszukiwania kodu HTML, co oznacza, że można odszukać słowa, wyrażenia, a nawet fragmenty kodu, niewidoczne w widoku normalnym. Aby odszukać tekst na bieżącej stronie:
|
Aby odszukać tekst w całej witrynie internetowej:
|
Rysunek 4.28. Po przeszukaniu witryny internetowej FrontPage wyświetli listę stron zawierających szukane wyrażenie oraz liczbę ilość wystąpień tego wyrażenia na danej stronie. Kliknij dwa razy nazwę strony, którą chcesz przeszukać dokładniej
Rysunek 4.29. FrontPage wyświetli standardowe okno dialogowe Znajdowanie i zamienianie. Kliknij przycisk Znajdź następny, aby przeszukać daną stronę
Rysunek 4.30. Aby kontynuować poszukiwania, kliknij przycisk Znajdź następny. Aby przeszukać inną stronę, kliknij przycisk Powrót do listy. FrontPage ponownie wyświetli listę stron zawierających szukane wyrażenie |
Rysunek 4.31. Aby powrócić do listy stron zawierających szukane wyrażenie, kliknij przycisk Powrót do listy okna dialogowego Znajdowanie i zamienianie |
|
Aby przeszukać kod HTML witryny internetowej:
Wskazówka
|
Rysunek 4.32. Aby przeszukać kod HTML witryny internetowej, wpisz szukane wyrażenie i wybierz opcję Wszystkie strony. Następnie zaznacz pole wyboru Znajdź w kodzie HTML i kliknij przycisk Znajdź w sieci Web
Rysunek 4.33. FrontPage wyświetli listę stron, na których odnalazł podane wyrażenie - nawet strony zawierające niewidoczny kod HTML
Rysunek 4.34. W tym przypadku FrontPage odnalazł pokazuje szukane wyrażenie w tytule strony |
Rysunek 4.35. Aby zamienić tekst na bieżącej stronie lub w całej witrynie, z menu Edycja wybierz pozycję Zamień (Ctrl+H)
Rysunek 4.36. Aby zamienić tekst lub kod HTML na bieżącej stronie, wpisz szukane słowo, wyrażenie lub kod HTML, wybierz opcję Bieżąca strona i kliknij przycisk Znajdź następny
Rysunek 4.37. FrontPage zaznaczy pierwsze wystąpienie szukanego tekstu lub kodu HTML. Kliknij przycisk Zamień |
Aby zamienić tekst lub kod HTML na bieżącej stronie:
|
Wskazówka
|
Rysunek 4.38. Po przeszukaniu strony FrontPage wyświetli okno komunikatu. Kliknij przycisk OK, aby go je zamknąć
Rysunek 4.39. Aby automatycznie zamienić wszystkie wystąpienia szukanego tekstu, kliknij przycisk Zamień wszystkie okna dialogowego Znajdowanie i zamienianie (karta Zamienianie) |
Rysunek 4.40. Aby zamienić tekst lub kod HTML w witrynie internetowej, wpisz żądany tekst lub kod HTML, wybierz opcję Wszystkie strony i kliknij przycisk Znajdź w sieci Web
Rysunek 4.41. FrontPage wyświetli listę stron zawierających szukany tekst oraz liczbę ilość wystąpień szukanego tekstu na danej stronie. Aby otworzyć stronę, kliknij dwukrotnie jej nazwę
Rysunek 4.42. FrontPage otworzy stronę i zaznaczy pierwsze wystąpienie szukanego tekstu. Aby zamienić tekst, kliknij przycisk Zamień |
Aby zamienić tekst lub kod HTML w witrynie internetowej:
|
|
Rysunek 4.43. Po zamienieniu tekstu FrontPage natychmiast zaznacza kolejne wystąpienie szukanego tekstu
Rysunek 4.44. Po zamienieniu wszystkich wystąpień szukanego tekstu FrontPage zapytapojawi się pytanie, czy chcesz zapisać zmiany i zamknąć stronę. Kliknij przycisk Powrót do listy
Rysunek 4.45. W oknie dialogowym Znajdowanie i zamienianie obok nazwy przeszukanej strony pojawi się informacja Edytowane. Kliknij dwukrotnie nazwę kolejnej strony, aby Aby przeszukać kolejną stronę, kliknij ją przeszukaćpdwukrotnie. |
Rysunek 4.46. Aby sprawdzić pisownię, z menu Narzędzia wybierz pozycję Pisownia (F7) lub kliknij przycisk Pisownia dostępny na pasku narzędzi Standardowy
Rysunek 4.47. Jeżeli FrontPage znajdzie słowo, co do którego ma wątpliwościpisownia może budzić wątpliwości, okno dialogowe Pisownia wyświetli to słowo wraz z sugestiami zmian
Rysunek 4.48. Po sprawdzeniu strony FrontPage wyświetli okno komunikatu. Kliknij przycisk OK |
Sprawdzanie pisowni FrontPage pozwala sprawdzać pisownię na bieżącej stronie lub w całej witrynie internetowej. FrontPage może sprawdzać pisownię nawet podczas pisania, choć akurat ta funkcja doprowadza wielu ludzi do szałudenerwuje wielu użytkowników programu. Osobiście Sam wolę sprawdzać pisownię po zbudowaniu strony. FrontPage pozwala również ustawić domyślny język sprawdzania pisowni, może to być na przykład język polski. Aby sprawdzić pisownię na bieżącej stronie:
|
Aby sprawdzić pisownię w całej witrynie internetowej:
|
Rysunek 4.49. Aby sprawdzić pisownię w całej witrynie internetowej, wyświetl widok Foldery i z menu Narzędzia wybierz pozycję Pisownia
Rysunek 4.50. W oknie dialogowym Pisownia wybierz opcję Cała sieć Web i kliknij przycisk Rozpocznij, aby sprawdzić pisownię na każdej stronie witryny
Rysunek 4.51. FrontPage przeszuka bieżącą witrynę internetową i wyświetli listę stron zawierających błędnie napisane słowa. Aby otworzyć stronę, dwukrotnie kliknij jej nazwę |
Rysunek 4.52. Po poprawieniu błędów na pierwszej stronie FrontPage wyświetli okno dialogowe z pytaniem, czy chcesz sprawdzić pisownię na następnej stronie
Rysunek 4.53. Po poprawieniu błędów w całej witrynie FrontPage wyświetli okno dialogowe z pytaniem, czy chcesz zamknąć stronę i powrócić do listy. Kliknij przycisk Powrót do listy |
|
Aby sprawdzić pisownię podczas pisania:
Wskazówka
Aby zmienić domyślny język sprawdzania pisowni:
|
Rysunek 4.54. Aby sprawdzić pisownię podczas pisania, z menu Narzędzia wybierz pozycję Opcje strony
Rysunek 4.55. W oknie dialogowym Opcje strony można określić, czy FrontPage ma sprawdzać pisownię podczas pisania oraz czy ma wyświetlać błędy pisowni. Można tu również ustawić domyślny język sprawdzania pisowni
Rysunek 4.56. Efekt włączenia funkcji wyświetlania błędów pisowni podczas pisania: FrontPage podkreśla każde słowo, którego nie ma w swoim słowniku |
|
Formatowanie tekstu Aby sformatować tekst, za pomocą kodu HTML,na przykładnp. pogrubić go, za pomocą kodu HTML, trzeba się nieźle namęczyćwykonać wiele czynności. W programie FrontPage formatowanie tekstu przebiega tak samo jak w zwykłych edytorach tekstu: wystarczy zaznaczyć tekst i kliknąć przycisk. Pasek narzędzi Formatowanie, wyświetlany standardowo, posiada wszystkie najpotrzebniejsze narzędzia do formatowania tekstu (rysunek 4.57). Dodatkowe możliwości formatowania oferuje okno dialogowe Czcionka (szczegóły w podrozdziale Okno dialogowe Czcionka). |
Rysunek 4.57. Przyciski dostępne na pasku narzędzi Formatowanie służą do formatowania tekstu
Style (paragraph) - Styl (akapit) Choose style - Wybierz styl Font - Czcionka Choose font - Wybierz czcionkę Font size - Rozmiar czcionki Choose size - Wybierz rozmiar czcionki Font styles - Style czcionki Text alignment - Wyrównanie tekstu Increase/decrease font size - Zwiększ/-zmniejsz rozmiar czcionki Numbered list - Numerowanie Bullet list - Punktory Decrease/increase line indent - Zmniejsz/-zwiększ wcięcie Apply border - Krawędzie Choose border - Wybierz krawędź Apply highlight - Wyróżnienie Choose highlight - Wybierz kolor wyróżnienia Apply font color - Kolor czcionki Choose font color - Wybierz kolor czcionki |
Aby zmienić krój czcionki:
Wskazówka
|
Rysunek 4.58. Zaznacz tekst, którego krój czcionki chcesz zmienić
Rysunek 4.59. Aby zmienić krój czcionki, kliknij strzałkę listy rozwijanej Czcionka i wybierz nazwę czcionki
Rysunek 4.60. FrontPage zastosuje wybraną czcionkę do zaznaczonego tekstu
Rysunek 4.61. Aby wywołać okno dialogowe Czcionka, zaznacz tekst, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Czcionka (Alt+Enter)
Rysunek 4.62. Okno dialogowe Czcionka pozwala w dużym stopniu kontrolować wygląd zaznaczonego tekstu |
Rysunek 4.63. Zaznacz tekst, którego rozmiar czcionki chcesz zmienić, kliknij strzałkę listy rozwijanej Rozmiar czcionki dostępnej na pasku narzędzi Formatowanie i wybierz rozmiar czcionki
Rysunek 4.64. FrontPage zastosuje wybrany rozmiar czcionki do zaznaczonego tekstu |
Aby zmienić rozmiar czcionki:
Wskazówka
|
Aby zmienić styl czcionki:
|
Rysunek 4.65. Zaznacz tekst, którego styl chcesz zmienić
Rysunek 4.66. Kliknij przycisk Pogrubienie, Kursywa lub Podkreślenie dostępny na pasku narzędzi Formatowanie
Rysunek 4.67. FrontPage zastosuje wybrany styl do zaznaczonego tekstu |
Rysunek 4.68. Zaznacz tekst, którego kolor czcionki chcesz zmienić
Rysunek 4.69. Kliknij strzałkę przycisku Kolor czcionki i wybierz kolor z rozwijanej palety
Rysunek 4.70. FrontPage zastosuje wybrany kolor do zaznaczonego tekstu |
Aby zmienić kolor czcionki:
Wskazówka
|
Aby wyrównać tekst:
|
Rysunek 4.71. Zaznacz tekst, który chcesz wyrównać
Rysunek 4.72. Kliknij jeden z czterech przycisków wyrównujących o funkcji wyrównywania tekstu (pasek narzędzi Formatowanie)
Rysunek 4.73. FrontPage wyrówna zaznaczony tekst |
Rysunek 4.74. Aby wywołać okno dialogowe Czcionka, zaznacz tekst, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Czcionka
Rysunek 4.75. Karta Czcionka okna dialogowego Czcionka pozwala zmodyfikować krój, styl, rozmiar i kolor czcionki zaznaczonego tekstu
Rysunek 4.76. Karta Odstępy między znakami okna dialogowego Czcionka pozwala zmodyfikować odstępy między znakami i wertykalną pozycję zaznaczonego tekstu |
Okno dialogowe Czcionka Aby otworzyć okno dialogowe Czcionka, zaznacz tekst, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Czcionka (rysunki 4.74 oraz 4.75). Karta Czcionka (1) pozwala zmodyfikować czcionkę, styl, rozmiar (2) oraz kolor (3) zaznaczonego tekstu. Pozwala również stosować efekty (4) niedostępne na pasku narzędzi Formatowanie. Podgląd efektu jest dostępny w okienku Podgląd (5). Karta Odstępy między znakami (6) okna dialogowego Czcionka wyświetla listę rozwijaną Odstępy (7) oraz listę rozwijaną Pozycja (8), dzięki którym można Można dzięki tym funkcjom dostosować odstępy między znakami oraz wertykalną pozycję zaznaczonego tekstu (rysunek 4.76). Okienko Podgląd (9) wyświetla rezultat zastosowania różnych kombinacji odstępów i pozycji. Więcej informacji na ten temat zawiera następna strona. |
Aby zmienić odstępy między znakami:
Aby zmienić wertykalną pozycję znaków:
|
Rysunek 4.77. W oknie dialogowym Czcionka określ odstępy między znakami, wybierając opcję Rozwinięte, Normalne lub Skondensowane z listy rozwijanej Odstępy. Pole Wielkość umożliwia jeszcze większą kontrolę nad odstępami między znakami
Rysunek 4.78. W oknie dialogowym Czcionka określ wertykalną pozycję tekstu, wybierając opcję z listy rozwijanej Pozycja |
Rysunek 4.79. Aby usunąć formatowanie tekstu, zaznacz ten tekst i z menu Format wybierz pozycję Usuń formatowanie (Ctrl+Shift+Z) |
Aby usunąć formatowanie tekstu:
|
Symbole i znaki specjalne Jak wspomnieliśmywspomniałem, dzięki FrontPage wyręcza autora stron internetowych nie musi pisać w pisaniu kodu HTML. Zaleta ta jest szczególnie istotna podczas umieszczania na stronach internetowych znaków specjalnych. Dzięki oknu dialogowemu Symbol na stronach internetowych bez trudu można umieszczać najróżniejsze symbole i znaki specjalne, na przykładnp. symbol ©, operatory matematyczne, znak waluty Euro, czy też znaki cyrylicy. Gdyby nie to okno, musiałbyś pamiętać kod HTML dla każdego z tych znaków. Aby wstawić symbol lub znak specjalny:
Wskazówka
|
Rysunek 4.80. Aby wstawić symbol lub znak specjalny, z menu Wstaw wybierz pozycję Symbol
Rysunek 4.81. Użyj listy rozwijanej Podzbiór okna dialogowego Symbol do odszukania żądanego podzbioru znaków
Rysunek 4.82. Wybierz żądany symbol w oknie dialogowym Symbol i kliknij przycisk Wstaw |
Rozdział 5. Formatowanie akapitów, list i nagłówków
|
Chociaż grafika ożywia stronę internetową, to dzięki akapitom, listom i nagłówkom strona posiada wizualną hierarchięstaje się czytelna. Do tworzenia i formatowania akapitów, list oraz nagłówków służą narzędzia dostępne na pasku narzędzi Formatowanie (rysunek 5.1). Aby stworzyć styl niestandardowy i używać go wielokrotnie, możesz skorzystać ze stylów kaskadowych. |
Rysunek 5.1. Listy rozwijane i przyciski dostępne na pasku narzędzi Formatowanie służą do formatowania akapitów, list oraz nagłówków
Style (paragraph) - Styl (akapit) Choose style - Wybierz styl Font - Czcionka Choose font - Wybierz czcionkę Font size - Rozmiar czcionki Choose size - Wybierz rozmiar czcionki Font styles - Style czcionki Text alignment - Wyrównanie tekstu Increase/decrease font size - Zwiększ/-zmniejsz rozmiar czcionki Numbered list - Numerowanie Bullet list - Punktory Decrease/increase line indent - Zmniejsz/-zwiększ wcięcie Apply border - Krawędzie Choose border - Wybierz krawędź Apply highlight - Wyróżnienie Choose highlight - Wybierz kolor wyróżnienia Apply font color - Kolor czcionki Choose font color - Wybierz kolor czcionki |
Akapity Można zmieniać wygląd akapitów. FrontPage jest wyposażony w narzędzia do wyrównywania akapitów, modyfikowania wcięć akapitów, odstępów między akapitami oraz odstępów między wierszami. Aby wyrównać akapit:
|
Rysunek 5.2. Aby wyrównać akapit, zaznacz go i kliknij jeden z czterech przycisków wyrównujących tekst, które są dostępneych na pasku narzędzi Formatowanie
Rysunek 5.3. Akapit początkowo wyrównany do lewej został wyrównany do prawej |
Rysunek 5.4. Aby zmienić wcięcie akapitu, kliknij przycisk Zmniejsz wcięcie lub Zwiększ wcięcie
Rysunek 5.5. Jeżeli zmodyfikujesz wcięcie, akapit zostanie przesunięty
Rysunek 5.6. Aby jeszcze bardziej zwiększyć wcięcie akapitu, kliknij kilka razy przycisk Zwiększ wcięcie
Rysunek 5.7. Aby wyświetlić ukryte znaczniki kodu HTML, z menu Widok wybierz pozycję Wyświetl tagi. Aby ukryć znaczniki HTML, ponownie wybierz pozycję Wyświetl tagi |
Wcięcia akapitów Wcięcie akapitu można ustawić na dwa sposoby. Pierwszy z nich polega na użyciu przycisków dostępnych na pasku narzędzi Formatowanie; drugi, dokładniejszy, wymaga ustawienia wcięć niestandardowych w oknie dialogowym Akapit. Aby zmienić wcięcie akapitu:
Wskazówki
|
Aby zmodyfikować wcięcia akapitu:
|
Rysunek 5.8. Aby zmodyfikować wcięcia akapitu, prawym przyciskiem myszy kliknij w tym akapicie i z menu kontekstowego wybierz pozycję Akapit
Rysunek 5.9. Listy rozwijane i pola ze strzałkami okna dialogowego Akapit pozwalają zmodyfikować wiele aspektów akapitu. Okienko Podgląd u dołu okna dialogowego Akapit wyświetla rezultat modyfikacji
Rysunek 5.10. FrontPage zastosował wcięcia niestandardowe do zaznaczonego akapitu |
|
Styl akapitu Jeżeli chcesz zmodyfikować kilka aspektów akapitu na raz,pod wieloma względami, możesz zmodyfikować styl Normalny. Styl ten posiada następujące cechy: krój czcionki: Times New Roman, interlinia: pojedyncza, wyrównanie: do lewej, wcięcia: brak. Możesz również użyć wbudowanego stylu Sformatowany. Styl ten korzysta z czcionki Courier, a praca z nim przypomina pisanie na maszynie. Dziś styl Sformatowany wygląda staromodniejest on przestarzały, ale przed pojawieniem się nowych wersji języka HTML był często jedynym sposobem na precyzyjne sformatowanie tekstu. Aby zmodyfikować styl Normalny:
Wskazówka
|
Aby zastosować styl Sformatowany:
|
Rysunek 5.11. Aby zastosować styl Sformatowany, użyj listy rozwijanej Styl
Rysunek 5.12. Chociaż Sstyl Sformatowany nie wygląda okropniedobrze, ale pozwala wyrównać tekst na stronie internetowej
Rysunek 5.13. Użyj listy rozwijanej Styl do powrotu do stylu Normalny |
Rysunek 5.14. Aby stworzyć listę punktowaną, kliknij przycisk Punktory dostępną na pasku narzędzi Formatowanie
Rysunek 5.15. Listę punktowaną możesz również stworzyć za pomocą listy rozwijanej Styl
Rysunek 5.16. Nic wyrafinowanego: sStandardowy styl punktora
Rysunek 5.17. Aby zastosować punktory do kilku akapitów na raz, zaznacz te akapity i kliknij przycisk Punktory |
Listy FrontPage pozwala tworzyć dwa typy list: listy punktowane oraz listy numerowane. Lista punktowana nadaje się znakomicie do prezentowania serii elementów, gdy ich porządek nie ma znaczenia - listą punktowaną może być na przykład lista zakupów. Lista numerowana służy do prezentowania serii elementów, gdy ich porządek odgrywa ważną rolę. Mimo że FrontPage pozwala tworzyć listy katalogów oraz listy menu, większość przeglądarek internetowych ich nie obsługuje, dlatego najlepiej ich nie używać. Tworzenie list punktowanych Standardowo FrontPage używa pełnych, okrągłych punktorów. Można jednak używać dowolnych punktorów pochodzących z wbudowanych motywów programu FrontPage lub stworzyć punktory niestandardowe. Więcej informacji na ten temat zawiera podrozdział Modyfikowanie list. Aby stworzyć listę punktowaną:
Wskazówki
|
Tworzenie list definicji Lista definicji służy do prezentowania informacji w postaci leksykonu: każdy termin znajduje się w osobnym wierszu, a tuż pod nim jest umieszczona definicja terminu. Mimo że istnieje możliwość sformatowania terminów i definicji dopiero po ich wpisaniu, generalnie łatwiej jest najpierw wybrać styl Termin zdefiniowany, a dopiero potem przystąpić do wpisywania terminów i definicji, ponieważ FrontPage zajmie się sformatuje wpisywany tekstformatowaniem wpisywanego tekstu. Aby stworzyć listę definicji:
|
Rysunek 5.18. Aby stworzyć listę definicji, umieść kursor w miejscu, w którym chcesz stworzyć listę definicji, i z listy rozwijanej Styl wybierz pozycję Termin zdefiniowany
Rysunek 5.19. Po wpisaniu pierwszego terminu i naciśnięciu klawisza Enter FrontPage przeniesie kursor do następnego wiersza, stworzy wcięcie i włączy styl Definicja
Rysunek 5.20. Po dodaniu wszystkich terminów i definicji naciśnij dwa razy klawisz Enter. FrontPage włączy styl Normalny |
Rysunek 5.21. Aby utworzyć listę numerowaną, zaznacz tekst i kliknij przycisk Numerowanie dostępny na pasku narzędzi Formatowanie
Rysunek 5.22. Listę numerowaną można również utworzyć wybierając pozycję Lista numerowana z listy rozwijanej Styl
Rysunek 5.23. Po dodaniu numeracji naciśnij klawisz Enter, aby Aby dodać następny element do listy numerowanej, naciśnij klawisz Enter.
Rysunek 5.24. Jeżeli jeden z elementów listy numerowanej zmienisz na zwykły tekst, FrontPage zmodyfikuje numerację pozostałych elementów |
Tworzenie list numerowanych Lista numerowana służy do prezentowania serii elementów w określonym porządku. Mimo że w listach numerowanych porządek elementów zwykle określają liczby, w listach tych można również stosować litery (A, B, C,...). Więcej informacji na ten temat zawiera podrozdział Modyfikowanie list. Aby utworzyć listę numerowaną:
Wskazówki
|
Modyfikowanie list FrontPage jest wyposażony w narzędzia do modyfikowania list. Punktory dla list punktowanych mogą pochodzić z wielu źródeł: można użyć wbudowanych motywów, klipartów dostarczanych z programem FrontPage lub dowolnej grafiki. Aby użyć punktorów wykorzystywanych w motywach, zobacz podrozdział Aby zastosować motyw do strony lub witryny w rozdziale 3., Tworzenie witryny internetowej. Aby zmodyfikować wygląd listy:
|
Rysunek 5.25. Aby zmodyfikować punktory lub numerację, z menu Format wybierz pozycję Punktory i numeracja
Rysunek 5.26. Aby zmodyfikować listę istniejącą, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości listy
Rysunek 5.27. Okno dialogowe Punktory i numeracja pozwala określić wybrać dowolny obrazy dla punktorów
Rysunek 5.28. Okno dialogowe Właściwości listy pozwala kontrolować wygląd punktorów, numeracji oraz list |
Rysunek 5.29. Aby określić wybrać obraz dla punktora, odszukaj plik graficzny i kliknij przycisk OK
Rysunek 5.30. Karta Numeracja okna dialogowego Właściwości listy pozwala wybrać jedną z sześciu opcji |
Opcje list Aby wyświetlić okno dialogowe Punktory i numeracja lub Właściwości listy (rysunki 5.27 oraz 5.28), wykonaj punkty podrozdziału Aby zmodyfikować wygląd listy. Oba okna dialogowe posiadają karty Punktory obrazkowe, Punktory zwykłe oraz Numeracja. Kartę Inne posiada tylko okno dialogowe Właściwości listy:
|
Wskazówka
|
Rysunek 5.31. Karta Inne okna dialogowego Właściwości listy pozwala wybrać styl listy |
Rysunek 5.32. Aby utworzyć listę wielopoziomową, stwórz listę punktowaną lub numerowaną i umieść kursor tuż przed miejscem, w którym chcesz wstawić podlistę
Rysunek 5.33. Standardowo podlista posiada ten sam styl numeracji co lista nadrzędna (w tym przypadku cyfry rzymskie)
Rysunek 5.34. Aby zmodyfikować styl numeracji podlisty, prawym przyciskiem myszy kliknij element podlisty i z menu kontekstowego wybierz pozycję Właściwości elementu listy
Rysunek 5.35. Element podlisty, Francja, posiada teraz inny styl numeracji (litery alfabetu) niż elementy listy nadrzędnej (cyfry rzymskie) |
Tworzenie list wielopoziomowych Lista wielopoziomowa może zawierać jedną lub więcej list podrzędnych (zagnieżdżonych). Listę wielopoziomową można modyfikować, dzięki czemu elementy poziomu nadrzędnego mogą, na przykład, używać cyfr rzymskich (I, II, III,...), a elementy poziomu podrzędnego - liter (A, B, C,...). Aby utworzyć listę wielopoziomową:
|
Wskazówka
|
Rysunek 5.36. FrontPage pozwala utworzyć podlistę podlisty. Każda podlista może posiadać własny styl numeracji |
Rysunek 5.37. Aby przerobić tekst na nagłówek, zaznacz go i z listy rozwijanej Styl wybierz rozmiar nagłówka
Rysunek 5.38. Rozmiary nagłówków: Nagłówek 1 jest największy; Nagłówek 6 - najmniejszy
Rysunek 5.39. FrontPage zastosuje wybrany nagłówek do zaznaczonego tekstu |
Nagłówki Nagłówki należą do najważniejszych elementów strony internetowej. Spełniają one taką samą funkcję co jak nagłówki gazety: pomagają czytelnikom odszukać dany temat bez konieczności czytania całego artykułu. Wielkie nagłówkitytuły, podobnie jak w gazecie, należy zarezerwować dla najważniejszych tematów, małe nagłówki - dla tematów mniej istotnych. Ta prosta, lecz niezwykle ważna, zasada jest niezbędna, aby strony do osiągnięcia wizualnego porządku na stronach witryny internetowej były czytelne. Chociaż w niniejszym podrozdziale zajmujemy się modyfikowaniem tylko rozmiaru nagłówka, można również zmienić jego czcionkę, kolor i styl. Więcej informacji na ten temat zwiera podrozdział Formatowanie tekstu w rozdziale 4., Wpisywanie i formatowanie tekstu. Aby utworzyć nagłówek:
Wskazówka
|
Aby zmienić rozmiar nagłówka:
|
|
Rozdział 6. Dodawanie hiperłączy
|
Wielką zaletą Internetu jest możliwość przechodzenia od pliku do pliku umieszczonego w dowolnym miejscu na świeciemiędzy plikami umieszczonymi w dowolnym miejscu sieci internetowej. Jest to możliwie dzięki hiperłączom. Hiperłącza (w skrócie łącza) dzielą się na kilka grup: hiperłącza do plików umieszczonych w różnych miejsca kuli ziemskiejch sieci, hiperłącza do różnych miejsc dokumentu otwartego w przeglądarce internetowej, hiperłącza do adresu e-mail oraz hiperłącza-obrazy. Microsoft FrontPage jest wyposażony w narzędzia do tworzenia każdego rodzaju hiperłącza połączeń w prosty sposób. Hiperłącza, które wykorzystują tekst, omawiamy na następnej stronie; hiperłącza-obrazy - w podrozdziale Tworzenie hiperłączy-obrazów. Warto również przypomnieć, że rozdział 3., Tworzenie witryny internetowej, wyjaśnia, jak utworzyć pasek łączy oparty na strukturze nawigacyjnej witryny internetowej. |
Adres bezwzględny a adres względny Zanim zaczniesz tworzyć hiperłącza, powinieneś zrozumieć różnicę między adresem bezwzględnym a adresem względnym. Adres bezwzględny zawiera pełny adres pliku (http://www.helion.com.pl/katalog.htm), natomiast adres względny zawiera tylko nazwę pliku i ewentualnie nazwę folderu, w którym plik ten został umieszczony (/MójFolder/MojaStrona.htm). Ilekroć tworzysz hiperłącze zewnętrzne, czyli hiperłącze do strony internetowej lub pliku poza bieżącą witryną, musisz podać adres bezwzględny. Aby utworzyć hiperłącze do pliku należącego do bieżącej witryny, należy podać adres względny. Zaleta adresów względnych polega na tym, że można modyfikować strukturę witryny internetowej bez żadnych obaw, że dojdzie do przerwania hiperłączy. Właśnie dlatego, że strona startowa witryny internetowej posiada ma adres bezwzględny, przeglądarka internetowa może przechodzić od jednego względnego hiperłącza do drugiego względnego hiperłącza tej witryny, nawet jeżeli przeniesiesz mojastrona.htm z www.mojawitryna.com/imprezy/ do www.mojawitryna.com/imieniny/. Modyfikacja struktury witryny internetowej jest nieunikniona. Oryginalna struktura często rozrasta się i jest wielokrotnie zmieniana. Aby dowiedzieć się, jak utworzyć hiperłącza względne, automatycznie aktualizowane podczas modyfikowania struktury witryny internetowej, przeczytaj podrozdział Aby utworzyć hiperłącze do strony w bieżącej witrynie internetowej. |
Rysunek 6.1. Kliknij ikonę Strona dostępną na pasku widoków, aby Aby wyświetlić widok Strona, kliknij ikonę Strona dostępną na pasku widoków.
Rysunek 6.2. Aby utworzyć hiperłącze, z menu Wstaw wybierz pozycję Hiperłącze lub kliknij przycisk Wstaw hiperłącze dostępny na pasku narzędzi Standardowy
Rysunek 6.3. Aby szybko utworzyć hiperłącze, prawym przyciskiem myszy kliknij zaznaczony element i z menu kontekstowego wybierz pozycję Hiperłącze |
Rysunek 6.4. Pole Tekst do wyświetlenia okna dialogowego Wstawianie hiperłącza wyświetla tekst zaznaczony w punkcie 2.
Rysunek 6.5. Aby utworzyć hiperłącze do zewnętrznej strony internetowej, najpierw kliknij przycisk Istniejący plik lub strona sieci Web dostępny na pasku Połącz z
Rysunek 6.6. Jeżeli nie znasz adresu strony internetowej, kliknij przycisk Przeglądaj sieć Web, aby Aby odszukać stronę, której adresu nie znasz, kliknij przycisk Przeglądaj sieć Web.
Rysunek 6.7. Tekst hiperłącza został podkreślony |
Aby utworzyć hiperłącze do zewnętrznej strony internetowej:
|
Rysunek 6.8. Okno dialogowe Wstawianie hiperłącza umożliwia pełną kontrolę nad hiperłączami
1 Choose type of hyperlink to create - 1 Wybierz typ hiperłącza 2 Look for target file in... - 2 Odszukaj plik docelowy 3 Text selected for link - 3 Tekst hiperłącza 4 Navigate Web using browser icon - 4 Przeglądaj sieć Web 5 Navigate folders on local machine/network icon - 5 Przeglądaj w poszukiwaniu pliku 6 Create mouse-over tekst tip - 6 Utwórz etykietę ekranową 7 Find Bookmark in another file - 7 Odszukaj zakładkę w pliku 8 Change frame target - 8 Zmień ramkę docelową 9 Current file list - 9 Lista plików 10 Address of targeted hyperlink - 10 Adres pliku docelowego Link to existing file - Hiperłącze do pliku istniejącego Link to Bookmark in current file - Hiperłącze do zakładki w pliku bieżącym Link to new file - Hiperłącze do nowego pliku Link to e-mail address - Hiperłącze do adresu e-mail |
Okno dialogowe Wstawianie hiperłącza Okno dialogowe Wstawianie hiperłącza umożliwia pełną kontrolę nad hiperłączami (rysunek 6.8). Aby go je otworzyć, z menu Wstaw wybierz pozycję Hiperłącze (Alt+Ctrl+H). Standardowo przy otwarciu okno dialogowe Wstawianie hiperłącza wyświetla bieżącą witrynę internetową.
|
|
|
|
Aby utworzyć hiperłącze do strony w bieżącej witrynie internetowej:
|
Rysunek 6.9. Jeżeli plik jest częścią witryny internetowej, wybierz go z listy plików, a jego nazwa pojawi się w polu Adres
Rysunek 6.10. Aby odszukać plik umieszczony na dysku twardym, kliknij przycisk Przeglądaj w poszukiwaniu pliku okna dialogowego Wstawianie hiperłącza
Rysunek 6.11. Po odszukaniu pliku w oknie dialogowym Łącz z plikiem kliknij przycisk OK |
Rysunek 6.12. Aby utworzyć hiperłącze do adresu e-mail, kliknij przycisk Adres e-mail dostępny na pasku Połącz z
Rysunek 6.13. Wpisz adres e-mail, dodaj temat wiadomości i kliknij przycisk OK |
Aby utworzyć hiperłącze do adresu e-mail:
Wskazówka
|
Hiperłącza do nowych stron Czasem trzeba szybko stworzyć nową stronę i utworzyć do niej hiperłącze ze strony bieżącej. Operacja taka jest możliwa dzięki opcji Utwórz nowy dokument okna dialogowego Wstawianie hiperłącza. Aby stworzyć nową stronę i utworzyć do niej hiperłącze:
Wskazówka
|
Rysunek 6.14. Aby utworzyć łącze do jeszcze nieistniejącej strony, kliknij przycisk Utwórz nowy dokument - wygląd okna dialogowego Wstawianie hiperłącza zostanie dostosowany do zadania, które chcesz wykonać
Rysunek 6.15. Aby odłożyć edycję strony internetowej na później, wybierz opcję Edytuj nowy dokument później, a następnie wypełnij pole Nazwa nowego dokumentu
Rysunek 6.16. Po utworzeniu hiperłącza nazwa nowego pustego dokumentu pojawi się w panelu Lista folderów |
Rysunek 6.17. Aby zmodyfikować hiperłącze, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości hiperłącza
Rysunek 6.18. W oknie dialogowym Edytowanie hiperłącza zmodyfikuj adres hiperłącza |
Edycja hiperłączy FrontPage automatycznie aktualizuje hiperłącza podczas modyfikowania struktury nawigacyjnej witryny internetowej. FrontPage pPozwala również modyfikować i usuwać hiperłącza. Jeżeli usunąłeś strony bez korzystania z narzędzi programu FrontPage, zobacz podrozdział Aby obliczyć hiperłącza ponownie, który wyjaśnia, jak naprawić przerwane hiperłącza. Aby edytować hiperłącze:
|
Aby usunąć hiperłącze:
Aby obliczyć naprawić hiperłącza ponownie:
|
Rysunek 6.19. Aby usunąć hiperłącze, kliknij przycisk Usuń łącze okna dialogowego Edytowanie hiperłącza
Rysunek 6.20. Jeżeli usunąłeś strony bez korzystania z narzędzi programu FrontPage i chcesz , naprawić przerwane łącza, z menu Narzędzia wybierz pozycję Oblicz hiperłącza ponownie., aby naprawić przerwane łącza |
Rysunek 6.21. Aby utworzyć zakładkę, zaznacz tekst, który ma służyć jako tekst zakładki, i z menu Wstaw wybierz pozycję Zakładka
Rysunek 6.22. W polu Nazwa zakładki okna dialogowego Zakładka pozostaw domyślną nazwę zakładki lub wpisz inną. Nazwa domyślna zależy od tekstu zaznaczonego w punkcie 1.
Rysunek 6.23. Poniżej tekstu zakładki FrontPage umieszcza linię przerywaną |
Zakładki Zakładka pozwala użytkownikowi przejść do konkretnego miejsca strony internetowej, na przykładnp. do jednego z nagłówkówa sekcji, długiej strony internetowejdługiego dokumentu. Proces tworzenia zakładki składa się z dwóch etapów: najpierw należy utworzyć samą zakładkę, a następnie - hiperłącze do tej zakładkiniej. Zakładka może znajdować się na bieżącej lub na innej stronie. Zakładki wWstawia się po to, by użytkownik mógł szybko przechodzić z jednego miejsca strony do innego bez konieczności przewijania całego dokumentu. Zakładkę mMożna je umieścić nie tylko w nagłówku, ale również w cytacie, słowie, obrazie lub w pojedynczym znaku. FrontPage jest wyposażony w narzędzia do szybkiego wyszukiwania zakładek na stronach internetowych, na przykład w celu ich zmodyfikowania lub usunięcia. Aby utworzyć zakładkę:
|
Aby utworzyć hiperłącze do zakładki na stronie bieżącej:
|
Rysunek 6.24. Aby utworzyć hiperłącze do zakładki na stronie bieżącej, kliknij przycisk Miejsce w tym dokumencie dostępny na pasku Połącz z, wybierz zakładkę i kliknij przycisk OK |
Rysunek 6.25. Aby utworzyć hiperłącze do zakładki na dowolnej stronie, odszukaj ją, wybierz z listy plików i kliknij przycisk Zakładka
Rysunek 6.26. W oknie dialogowym Wybieranie miejsca w dokumencie wybierz jedną z zakładek i kliknij przycisk OK
Rysunek 6.27. W polu Adres okna dialogowego Wstawianie hiperłącza pojawi się adres zakładki. Kliknij przycisk OK |
Aby utworzyć hiperłącze do zakładki na dowolnej stronie:
Wskazówka
|
Aby odszukać zakładkę:
|
Rysunek 6.28. Aby odszukać zakładkę, kliknij dowolną zakładkę prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości zakładki
Rysunek 6.29. Wybierz jedną z zakładek wyświetlanych na liście Inne zakładki na tej stronie, a następnie kliknij przycisk Przejdź do
Rysunek 6.30. FrontPage bez zamykania okna dialogowego Zakładka przejdzie do wybranej zakładki |
Rysunek 6.31. Aby wyczyścić usunąć zakładkę, odszukaj ją i kliknij przycisk Wyczyść
Rysunek 6.32. FrontPage usunął zakładkę, o czym świadczy brak linii przerywanej, ale tekst pozostawił tekst |
Aby wyczyścić usunąć zakładkę:
|
Kolory hiperłączy FrontPage przestrzega konwencji, zgodnie z którą hiperłącza nieodwiedzone mają kolor niebieski, natomiast hiperłącza odwiedzone - kolor fioletowy. Kolor czerwony jest zarezerwowany dla hiperłączy aktywnych. FrontPage pozwala jednak określić nadać kolor niestandardowy dla każdego stanu hiperłączya odwiedzonych, nieodwiedzonych i aktywnych, a także zastosować efekty najazdu hiperłączy. Aby zmienić kolor hiperłączy:
|
Rysunek 6.33. Aby zmienić kolor hiperłączy, kliknij stronę prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości strony
Rysunek 6.34. Aby uzyskać dostęp do sekcji Kolory, wyświetl kartę Tło
Rysunek 6.35. Użyj rozwijanych palet kolorów do zmodyfikowania koloru hiperłączy. Aby wybrać kolor niestandardowy, kliknij opcję Więcej kolorów
Rysunek 6.36. Okno dialogowe Więcej kolorów pozwala wybrać jeden z kolorów wyświetlanych w przeglądarkach internetowych
Rysunek 6.37. Aby pobrać otrzymać informacje o hiperłączach z innej strony, zaznacz pole wyboru Pobierz informacje o tle z innej strony, a następnie kliknij przycisk Przeglądaj, aby odszukać stronę |
Rysunek 6.38. Jeżeli chcesz, aby kolor hiperłącza zmieniał się, ilekroć użytkownik umieści nad nim wskaźnik myszy, na karcie Tło zaznacz pole wyboru Włącz efekty najazdu hiperłączy i kliknij przycisk Styl najazdu
Rysunek 6.39. Karta Tło okna dialogowego Właściwości strony pozwala również ustawić kolor tła strony oraz kolor tekstu
Rysunek 6.40. Aby dodać do strony obraz tła, zaznacz pole wyboru Obraz tła i kliknij przycisk Przeglądaj |
Wskazówki
|
Tworzenie hiperłączy-obrazów Oprócz hiperłączy tekstowych FrontPage pozwala tworzyć hiperłącza-obrazy. Tworząc hiperłącze-obraz, mMożna przerobić na hiperłącze cały obraz lub dodać do obrazu punkty aktywne z łączami do różnych miejsc w dowolnym pliku. Dzięki dodaniu do obrazu wielu punktów aktywnych, można utworzyć hiperłącza do wielu plików. Aby cały obraz przerobić na hiperłącze:
|
Rysunek 6.41. Zanim zaczniesz pracować z obrazami, z menu Widok wybierz pozycję Paski narzędzi, a następnie pozycję Obrazy
Rysunek 6.42. Pasek narzędzi Obrazy posiada narzędzia do dodawania hiperłączy i punktów aktywnych do obrazów
Rysunek 6.43. Zaznaczony obraz posiada czarne kwadratowe uchwyty
Rysunek 6.44. Aby przerobić obraz na hiperłącze, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Hiperłącze
Rysunek 6.45. Jeżeli wskaźnik myszy umieścisz nad hiperłączem-obrazem, FrontPage wyświetli etykietę ekranową z instrukcją oraz adres pliku docelowego na pasku stanu |
Rysunek 6.46. Aby utworzyć punkt aktywny, najpierw zaznacz cały obraz
Rysunek 6.47. Wybierz kształt punktu aktywnego (prostokąt, okrąg lub wielokąt) za pomocą paska narzędzi Obrazy
Rysunek 6.48. Po wybraniu narzędzia wskaźnik myszy zmieni się w ołówek, dzięki czemu możesz narysować kontur punktu aktywnego na obrazie. Nie przejmuj się rozmiarem konturu, ponieważ można go zmienić w dowolnej chwili |
Aby utworzyć punkt aktywny:
|
Wskazówki
|
Rysunek 6.49. Po wybraniu pliku docelowego dla punktu aktywnego kliknij wewnątrz tego punktu i przesuń go w żądane miejsce (rysunek z lewej). Aby zmienić rozmiar punktu aktywnego, przeciągnij jeden z jego uchwytów za pomocą wskaźnika myszy (rysunek z prawej)
Rysunek 6.50. Obraz, dzięki posiadaniu temu, że ma kilkau punktów aktywnych, może zawierać hiperłącza do kilku plików docelowych |
Rysunek 6.51. Jeżeli zawartość obrazu sprawia, że nie można dostrzec jego punktów aktywnych, zaznacz go i kliknij przycisk Wyróżnij punkty aktywne dostępny na pasku narzędzi Obrazy
Rysunek 6.52. FrontPage ukrył obraz, pozostawiając tylko kontury punktów aktywnych. Zaznaczony punkt aktywny ma kolor czarny
Rysunek 6.53. Aby zmienić miejsce docelowe punktu aktywnego, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości punktu aktywnego obrazu |
Wyszukiwanie punktów aktywnych Czasem zawartość obrazu sprawia, że nie można dostrzec jego punktów aktywnych. Z pomocą przychodzi narzędzie Wyróżnij punkty aktywne, dzięki któremu można ukryć obraz pozostawiając tylko punkty aktywne. Aby odszukać punkty aktywne:
Aby usunąć punkt aktywny:
Aby zmienić miejsce docelowe punktu aktywnego:
|
Przyciski aktywowane Przycisk aktywowany jest składnikiem sieci Web, . który mMożna go wstawić za pomocą okna dialogowego Wstawianie składnika sieci Web. Kiedy użytkownik umieści wskaźnik myszy nad przyciskiem aktywowanym, przycisk ten może zmienić wygląd lub nawet odtworzyć plik dźwiękowy. Przyciski aktywowane przede wszystkim spełniają to przede wszystkim rolę hiperłączay, dlatego są one omawiane w tym rozdziale. Aby dodać przycisk aktywowany:
Wskazówki
|
Rysunek 6.54. Aby dodać przycisk aktywowany, z menu Wstaw wybierz pozycję Składnik sieci Web
Rysunek 6.55. Po pojawieniu się okna dialogowego Wstawianie składnika sieci Web na liście Typ składnika będzie zaznaczona pozycja Efekty dynamiczne. Na liście Wybierz efekt zaznacz pozycję Przycisk aktywowania
Rysunek 6.56. Okno dialogowe Właściwości przycisku aktywowanego kontroluje wygląd i działanie przycisku
Rysunek 6.57. Po zbudowaniu przycisku aktywowanego włącz widok Podgląd, aby Aby zobaczyć rezultat zbudowania przycisku aktywowanego, włącz widok Podgląd. W Pprzycisku „Paryż” posiada zastosowano efekt poświaty |
Okno dialogowe Właściwości przycisku aktywowanego Okno dialogowe Właściwości przycisku aktywowanego pozwala zastosować kilka rodzajów efektów (rysunek 6.56). Aby otworzyć to okno, wykonaj instrukcje podrozdziału Aby dodać przycisk aktywowany lub kliknij dwa razy istniejący przycisk aktywowany.
|
|
Aby edytować przycisk aktywowany:
Aby zmodyfikować przycisk aktywowany:
Wskazówka
|
Rysunek 6.58. Aby edytować przycisk aktywowany, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości przycisku aktywowanego
Rysunek 6.59. Kliknij jeden z przycisków Przeglądaj okna dialogowego Niestandardowe, aby odszukać plik dźwiękowy lub graficzny
Rysunek 6.60. Aby do przycisku aktywowanego dodać klipart, kliknij strzałkę przycisku Otwórz okna dialogowego Wybierz obraz |
Rysunek 6.61. W widoku Hiperłącza na w środku znajduje się analizowana strona, na lewo - strony z hiperłączami do analizowanej strony, a na prawo - strony, do których prowadzą hiperłącza strony analizowanej
Rysunek 6.62. W widoku Hiperłącza dzięki ikonom można odróżnić hiperłącza do stron - zewnętrznych i wewnętrznych - można odróżnić od hiperłączy do adresu e-mail po ikonach
Rysunek 6.63. Aby włączyć widok Hiperłącza, z menu Widok wybierz pozycję Hiperłącza lub kliknij ikonę Hiperłącza dostępną na pasku widoków
Rysunek 6.64. Aby dokonać analizy hiperłączy pobocznej strony, kliknij ją i z menu kontekstowego wybierz pozycję Przenieś do środka. Kiedy wWybrana strona znajdzie się na w środku, gdzie można sprawdzić jej hiperłącza |
Widok Hiperłącza Widok Hiperłącza służy do analizowania hiperłączy witryny internetowej. Tu również najłatwiej stwierdzić, czy jakiegoś łącza brakuje (rysunek 6.61). Analizę hiperłączy dodatkowo ułatwiają ikony wskazujące typ hiperłącza (rysunek 6.62). Chcesz obejrzeć hiperłącza jednej z peryferyjnych stron witryny internetowej? Zobacz podrozdział Aby sprawdzić hiperłącza strony internetowej. Aby włączyć widok Hiperłącza:
Aby sprawdzić hiperłącza strony internetowej:
|
Rozdział 7. Wstawianie i edytowanie obrazów
|
Obraz (plik graficzny), który chcesz umieścić na stronie internetowej, musi posiadać odpowiedni format. Temat ten oOmawiamy ten problem w pierwszym podrozdzialeł tego rozdziału, Formaty plików graficznych używanych na stronach internetowych. W dDrugim podrozdziałpodrozdziale, Wstawianie obrazów, wyjaśniamy, jak umieścić obraz na stronie internetowej i zdefiniować jego rozmiar, styl otaczania, grubość krawędzi i inne atrybuty. W Ppodrozdziałle Edytowanie obrazów wyjaśniamy, co można zrobić za pomocą narzędzi dostępnych na pasku narzędzi Obrazy (rysunek 7.1). W oOstatnim podrozdziałpodrozdziale, Pozycja bezwzględna obrazu, omawiamy narzędzia do kontroli pozycji obrazów. Warto przypomnieć, że tworzenie hiperłączy-obrazów oraz punktów aktywnych zostało omawia przedstawione w podrozdział podrozdziale Tworzenie hiperłączy-obrazów w rozdziale 6., Dodawanie hiperłączy. Aby dowiedzieć się, jak o korzystaniću z wbudowanych motywów, przeczytaj podrozdział Szablony i motywy w rozdziale 3., Tworzenie witryny internetowej. Aby na stronie internetowej umieścić film wideo, zapoznaj się z rozdziałem 9., Multimedia i składniki sieci Web. |
Rysunek 7.1. Pasek narzędzi Obrazy posiada narzędzia do edytowania obrazów
Insert picture - Wstaw obraz z pliku Add text - Tekst Create thumbnail - Autominiatura Position absolutely - Pozycjonuj bezwzględnie Bring forward - Przesuń do przodu Send back - Przesuń do tyłu Rotate left - Obróć w lewo Rotate right - Obróć w prawo Flip horizontal - Przerzuć w poziomie Flip vertical - Przerzuć w pionie More contrast - Więcej kontrastu Less contrast - Mniej kontrastu Brighter - Większe rozjaśnienie Dimmer - Mniejsze rozjaśnienie Crop - Przytnij Line style - Styl linii Format picture - Formatuj obraz Set transparent color - Ustaw kolor przezroczysty Set color - Kolor Bevel border - Skos Resample picture - Przepróbkowanie Select - Wybierz Create hotspots - Stwórz punkty aktywne Add/remove buttons - Dodaj lub usuń przyciski Restore picture - Przywróć |
Formaty plików graficznych używanych na stronach internetowych Istnieje bardzo wiele formatów plików graficznych: BMP, TIFF, TGA, EPS, RAS itd. Jednak do tworzenia stron internetowych wykorzystuje się tak naprawdę tylko dwa formaty: GIF oraz JPEG. Format GIF (Graphical Interchange Format), stworzony przez firmę CompuServe, jest wykorzystywany do małych obiektów graficznych. Format JPEG, stworzony przez Joint Photographic Experts Group, jest wykorzystywanywykorzystuje się do średnich i dużych zdjęć. Format PNG (Portable Network Graphics) jest w centrum cieszy się zainteresowaniema użytkowników od kilku lat, z powodu kontrowersji wokół praw autorskich do formatu GIF ponieważ oraz dlatego że dobrze kompresuje obrazy bez utraty tak dużej ilości danych jak format JPEG oraz z powodu kontrowersji wokół praw autorskich do formatu GIF. Na rozwój i akceptację formatu PNG negatywnie wpływa fakt, że format ten jest obsługiwany tylko przez przeglądarki internetowe w wersji 4 oraz przez przeglądarki nowsze. Najlepszym rozwiązaniem są więc formaty GIF oraz JPEG. Więcej szczegółów zawiera podrozdział Konwersja formatu obrazu. Małe jest piękne Zanim umieścisz obraz na stronie internetowej, upewnij się, że jest on tak mały, jak to tylko możliwe. Obrazy o dużych rozmiarach mogą spowolnić działanie stron internetowych do tego stopnia, że zniecierpliwiony użytkownik po prostu zrezygnuje z oglądania Twojej witryny. Zrób wszystko, co w Twojej mocy, aby zmniejszyć rozmiar obrazu, i w ten sposób przyspieszyć działanie witryny. Z wyjątkiem przycięcia obróbkę obrazu należy wykonać w jednym z programów do tworzenia grafiki, takim jak Photoshop, DeBabelizer lub Fireworks. Obróbkę obrazu rozpocznij od przycięcia jego szerokości i wysokości, aby pozostawić tylko to, co w danym obrazie jest najistotniejsze. Kogo interesuje rozmazane tło lub parking na pierwszym planie? Tajemnica małych obrazów (tj. takich, które zajmują mało niewiele miejsca) kryje się w zastosowanej kompresji. Obrazy GIF zajmują mało miejsca, ponieważ liczba ilość wyświetlanych przez nie kolorów jest zredukowana do nie więcej niż 256. |
|
|
Obrazy JPEG uzyskują mały rozmiar dzięki kompresji stratnej: im większa kompresja, tym mniejszy rozmiar, ale również gorsza jakość, obrazu. Liczba Ilość kolorów w obrazie, czyli głębia bitowa, ma duży wpływ na rozmiar pliku (tabela 7.2). Wielu użytkowników Internetu nadal korzysta z monitorów 8-bitowych wyświetlających tylko 256 kolorów. Ponieważ do nawet 40 z tych kolorów jest zarezerwowanych dla systemu operacyjnego komputera, większość obrazów GIF używa tylko 216 kolorów palety kolorów bezpiecznych dla Internetu (przeglądarek internetowych). Konwersja obrazu o wysokiej rozdzielczości na obraz wykorzystujący paletę kolorów bezpiecznych dla Internetu jest czasem nazywana indeksowaniem lub mapowaniem obrazu - bierze się to stąd, dlatego że informacja o kolorze każdego piksela obrazu jest przechowywana w indeksie o wyglądzie siatki. Chociaż konwersja obrazu zawierającego miliony kolorów na w obraz zawierający kilkaset kolorów może wydawać się szalonym pomysłem, budując witrynę internetową, należy dążyć do tego, aby wyglądała ona tak samo bez względu na system operacyjny i monitor użytkownika. Aby znaleźć złoty środek między minimalną głębią bitową a przyzwoitą zadowalającą jakością obrazu, zapisz obraz kilka razy za pomocą programu graficznego, za każdym razem wybierając inną głębię bitową. Inaczej ma się sprawa jest ze zdjęciami: redukcja głębi bitowej daje tu nieciekawy zły rezultat - np. odcienie kolorówkolor skóry, na przykład, wyglądają okropnie brzydko po konwersji na format GIF. Do zdjęć należy używać formatu JPEG, który korzysta z zupełnie innej metody kompresji. FrontPage jest wyposażony w narzędzia do kontrolowania rozmiaru obrazu JPEG za pomocą różnych poziomów kompresji. Więcej szczegółów zawiera podrozdział Konwersja formatu obrazu. Minusem formatu JPEG jest jego nienajlepsza współpraca z narzędziem Ustaw kolor przezroczystości (po ustawiania ustawieniu koloru przezroczystości obraz wygląda jakby go uszkodziły termity). Jeżeli mimo starań obraz nadal jest duży, pomyśl o wykorzystaniu narzędzia Autominiatura - szczegóły w podrozdziale Autominiatury i galerie fotografii. |
Tabela 7.1.
GIF kontra JPEG: który format jest lepszy?
Element strony internetowej |
Najlepszy format |
przyciski, strzałki |
GIF |
ilustracje |
GIF |
animacje |
GIF |
bloki koloru |
GIF |
zdjęcia o rozmiarach przycisku |
GIF |
średnie i duże zdjęcia |
JPEG |
Tabela 7.2.
Głębia kolorów, liczba ilość kolorów i rozmiar pliku
Obraz oryginalny (nieindeksowany) |
||
24 bity |
17 milionów kolorów |
1,1 MB (rozmiar oryginalny) |
15 bitów |
32 768 kolorów |
816K |
Obraz zindeksowany (GIF) |
||
8 bitów |
256 kolorów |
417K |
7 bitów |
128 kolorów |
111K |
6 bitów |
64 kolory |
94K |
5 bitów |
32 kolory |
77K |
4 bity |
16 kolorów |
60K |
3 bity |
8 kolorów |
43K |
2 bity |
4 kolory |
17K |
1 bit |
2 kolory |
9K |
Wstawianie obrazów Po zredukowaniu obrazów do minimalnych rozmiarów za pomocą programu graficznego umieszczenie ich na stronie internetowej jest prostym zadaniem. Aby wstawić obraz:
lub Jeżeli wybierzesz pozycję Z pliku, FrontPage otworzy okno dialogowe Obraz (rysunek 7.4). Odszukaj obraz za pomocą przycisków dostępnych na pasku Szukaj w, a następnie, aby umieścić go na stronie internetowej, kliknij przycisk Wstaw, aby umieścić go na stronie internetowej.
|
Rysunek 7.2. Aby wstawić obraz, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję ClipArt lub Z pliku
Rysunek 7.3. Okienko zadań Wstawianie obiektu ClipArt umożliwia dostęp do bezpłatnych klipartów
Rysunek 7.4. Okno dialogowe Obraz umożliwia dostęp do obrazów umieszczonych na dysku twardym lub w Internecie
Rysunek 7.5. Okno dialogowe Zapisywanie plików osadzonych pozwala zmienić nazwę obrazu oraz wskazać folder, w którym chcesz go przechowywać |
Rysunek 7.6. Jeżeli okno dialogowe Obraz nie wyświetla podglądu zaznaczonego obrazu, kliknij strzałkę przycisku Widoki i z listy rozwijanej wybierz pozycję Podgląd
Rysunek 7.7. Aby wstawić obraz, kliknij przycisk Wstaw obraz z pliku dostępny na pasku narzędzi Obrazy
Rysunek 7.8. Jeżeli obraz został umieszczony na Liście folderów, kliknij i przeciągnij go na stronę internetową
Rysunek 7.9. Aby zmienić format obrazu, kliknij przycisk Opcje obrazu i w oknie dialogowym Opcje obrazu wybierz opcję JPEG lub GIF |
Wskazówki
|
Galeria klipartów FrontPage 2002 jest dostarczany z kolekcją klipartów. Program ten może również korzystać z bogatych kolekcji klipartów dostarczanych z pakietami Office 2000 i Office XP. Okienko zadań Wstawianie obiektu ClipArt umożliwia dostęp do klipartów umieszczonych na dysku twardym oraz w Internecie (rysunek 7.10). Aby otworzyć okienko zadań Wstawianie obiektu ClipArt, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję ClipArt.
|
Rysunek 7.10. Okienko zadań Wstawianie obiektu ClipArt umożliwia dostęp do klipartów umieszczonych na dysku twardym oraz w Internecie
Rysunek 7.11. Użyj list rozwijanych oraz pól wyboru do rozszerzenia lub ograniczenia zakresu poszukiwań |
Rysunek 7.12. Clip Organizer umożliwia dostęp do tych samych klipów co przycisk Wyszukaj - różnica polega na tym, że można tu przeglądać klipy według kategorii
Rysunek 7.13. Wybierz opcję Clips Online, aby uzyskać dostęp do internetowej kolekcji klipartów - Design Gallery Live
Rysunek 7.14. Internetowa kolekcja klipartów, Design Gallery Live, firmy Microsoft umożliwia dostęp do wielu plików multimedialnych |
|
Konwersja formatu obrazu Obraz umieszczony na stronie internetowej FrontPage może zapisać w formacie GIF lub JPEG. Jeżeli głębia bitowa obrazu nie przekracza 8 bitów, FrontPage zapisuje obraz w formacie GIF. , a jJeżeli głębia bitowa obrazu przekracza 8 bitów, FrontPage zapisuje obraz w formacie JPEG. FrontPage pozwala ponadto przekonwertować zmienić obraz GIF na JPEG i odwrotnie. Aby zmienić format obrazu:
|
Rysunek 7.15. Aby zmodyfikować obraz, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości obrazu
Rysunek 7.16. Aby zmienić format obrazu, wyświetl kartę Ogólne okna dialogowego Właściwości obrazu
Rysunek 7.17. Kliknij przycisk Opcje obrazu, aby ustawić opcje obrazu |
Rysunek 7.18. Aby zapisać obraz w formacie JPEG, określ jakość kompresji oraz liczbę ilość pobrań progresywnych |
Wskazówki
|
Tworzenie reprezentacji alternatywnych Użytkownicy, którzy mają dostęp do Internetu za pomocą powolnego modemu, nierzadko wyłączają funkcję wyświetlania obrazów w przeglądarkach internetowych. Dzięki utworzeniu tekstu alternatywnego dla każdego obrazu witryny internetowej użytkownicy ci będą mieli informację o obrazach umieszczonych na danej stronie. Zaleta tego rozwiązania polega również na tym, że tekst pojawi się na stronie prawie natychmiast, więc użytkownicy, którzy nie wyłączyli funkcji wyświetlania obrazów, a mają dostęp do Internetu za pomocą wolnego modemu, mogą zdecydować, czy chcą czekać na wyświetlenie obrazów (rysunek 7.19). Jeżeli użytkownik korzysta z przeglądarki Internet Explorer, tekst alternatywny jest wyświetlany jako etykieta, kiedy użytkownik umieści wskaźnik myszy nad obrazem (rysunek 7.19). Warto również zwrócić uwagę, że użytkownicy z wadami wzroku używają specjalnych programów odczytujących zawartość strony. Tekst alternatywny jest dla nich bardzo pomocny. Jest jeszcze jeden sposób na obrazy, Można również utworzyć które zbyt wolno wczytują się do przeglądarki: utworzenie obrazyu alternatywnego alternatywne o niskiej rozdzielczości. Obraz alternatywny o niskiej rozdzielczości pojawia Pojawia się on na stronie internetowej prawie natychmiast i pozostaje tam do czasu pojawiania pokazania się obrazu o zwykłej rozdzielczości. Więcej informacji na ten temat zawiera podrozdział Aby stworzyć obraz alternatywny o niskiej rozdzielczości. Aby utworzyć tekst alternatywny:
|
Rysunek 7.19. Dzięki utworzeniu tekstu alternatywnego dla każdego obrazu użytkownik posiada informację o zawartości obrazu zanim jeszcze przeglądarka wyświetli ten obraz. W przeglądarce Internet Explorer tekst alternatywny pojawia się w etykietach obrazów
Rysunek 7.20. W sekcji Reprezentacje alternatywne karty Ogólne wpisz krótki opis obrazu lub podaj instrukcje dla użytkowników, którzy wyłączyli funkcję wyświetlania obrazów w przeglądarkach |
Rysunek 7.21. Aby obejrzeć tekst alternatywny w działaniu, z menu Narzędzia przeglądarki Internet Explorer wybierz pozycję Opcje internetowe
Rysunek 7.22. Przeglądarka internetowa z wyłączoną funkcją wyświetlania obrazów wyświetla tekst alternatywny |
Wskazówka
|
Aby stworzyć obraz alternatywny o niskiej rozdzielczości:
|
Rysunek 7.23. Zanim utworzysz obraz alternatywny o niskiej rozdzielczości, zapamiętaj szerokość i wysokość obrazu oryginalnego podaną w polach Szerokość i Wysokość okna dialogowego Właściwości obrazu |
Rysunek 7.24. Użyj sekcji Reprezentacje alternatywne okna dialogowego Właściwości obrazu do skojarzenia obrazu o niskiej rozdzielczości z obrazem o zwykłej rozdzielczości |
|
Określanie położenia obrazu w stosunku do przyległego tekstu Podczas tworzenia strony internetowej czasem najwięcej problemów przysparza rozmieszczenie jest z właściwym rozmieszczeniem tekstu i obrazów. Aby określić pozycję obrazu w stosunku do tekstu:
|
Rysunek 7.25. Sekcja Układ karty Wygląd kontroluje pozycję obrazu w stosunku do przyległego tekstu, a także grubość krawędzi obrazu oraz odstępy wokół niego
Rysunek 7.26. Obraz u góry ekranu jest wyrównany do prawej; obraz u dołu jest wyrównany do lewej |
|
Do góry: Górna krawędź obrazu znajduje się na równi z górną krawędzią najwyższego elementu (w tym przypadku - przycisku Start).
|
|
Do góry tekstu: Górna krawędź obrazu znajduje się na równi z górną krawędzią tekstu.
|
|
Do środka: Środek obrazu znajduje się na równi z górną krawędzią tekstu. |
|
Do środka bezwzględnego: Środek obrazu znajduje się na równi ze środkiem najwyższego elementu (w tym przypadku - przycisku Start).
|
|
Do linii bazowej: Dolna krawędź obrazu znajduje się na równi z dolną krawędzią tekstu.
|
|
Do dołu: Tak samo jak Do linii bazowej.
|
|
Do dołu bezwzględnego: Dolna krawędź obrazu znajduje się na równi z dolną krawędzią najniższego elementu. |
|
Do osi: Oś obrazu znajduje się na równi z osią największego tekstu. |
Rysunek 7.27.
Opcje dostępne na liście rozwijanej Wyrównanie kontrolują pozycję obrazu w stosunku do tekstu i grafiki
Rysunek 7.28. Obraz w prawym górnym rogu ma krawędź o grubości 4 pikseli; obraz w lewym dolnym rogu ma krawędź o grubości 1 piksela
Rysunek 7.29. Wartość odstępów w poziomie obrazu w prawym górnym rogu wynosi 30 pikseli; wartość odstępów w pionie obrazu w lewym dolnym rogu wynosi 15 pikseli |
Aby ustawić grubość krawędzi obrazu:
Aby dodać odstępy wokół obrazu:
|
Wstawianie linii poziomych Linia pozioma nie jest oczywiście obrazem, ale omawiamy ją w tym rozdziale, ponieważ jest ona podstawowym elementem graficznym stron internetowych. Parę innych graficznych sposobów modyfikowania wyglądu strony - zmienianie koloru strony i dodawanie obrazu tła - omawia poruszamy w podrozdziałle Kolory hiperłączy w rozdziale 6., Dodawanie hiperłączy. Aby wstawić linię poziomą:
Aby edytować linię poziomą:
|
Rysunek 7.30. Umieść kursor w miejscu, w którym chcesz wstawić linię poziomą
Rysunek 7.31. Aby wstawić linię poziomą, z menu Wstaw wybierz pozycję Linia pozioma
Rysunek 7.32. Linia pozioma została umieszczona na stronie internetowej
Rysunek 7.33. Aby edytować linię poziomą, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości linii poziomej |
Rysunek 7.34. Okno dialogowe Właściwości linii poziomej służy do modyfikowania rozmiaru, wyrównania oraz koloru linii poziomej |
Okno dialogowe Właściwości linii poziomej Okno dialogowe Właściwości linii poziomej służy do modyfikowania rozmiaru, wyrównania oraz koloru linii poziomej (rysunek 7.34).
|
Edytowanie obrazów Choć do zaawansowanej obróbki obrazów graficznych najlepiej użyć dobrego programu graficznego, narzędzia dostępne na pasku narzędzi Obrazy programu FrontPage wystarczą do wykonania wielu podstawowych zadań edycyjnych (rysunek 7.1). Zwróć uwagę, że podczas edycji obrazu program FrontPage modyfikuje zmienia obraz oryginalny. Z tego powodu należy zapisać kopię oryginału poza witryną internetową. Jednym z najważniejszych narzędzi dostępnych na pasku narzędzi Obrazy jest przycisk Przywróć. Aby cofnąć edycję obrazu:
|
Rysunek 7.35. Aby cofnąć efekty modyfikowania obrazu, kliknij przycisk Przywróć |
Rysunek 7.36. Sekcja Rozmiar karty Wygląd służy do ustawiania szerokości i wysokości obrazu |
Zmiana rozmiaru obrazu Aby szybko zmienić rozmiar obrazu, należy kliknąć jeden z jego czarnych kwadratowych uchwytów i przeciągnąć wskaźnik myszy. Jeżeli chcesz mieć precyzyjną kontrolę nad rozmiarem obrazu, użyj opcji dostępnych na karcie Wygląd okna dialogowego Właściwości obrazu. Zobacz również podrozdział Przepróbkowanie Zmiana wielkości obrazu. Aby zmienić rozmiar obrazu:
Wskazówka
|
Przepróbkowanie Zmiana wielkości obrazu Jeżeli chcesz zmienić rozmiar obrazu w znacznym stopniu, najlepiej zrób to w osobnym programie graficznym. W przypadku zmiany nieprzekraczającej 10%, rozmiar obrazu możesz zmodyfikować w programie FrontPage, a następnie użyć narzędzia Przepróbkowanie dostępnego na pasku narzędzi Obrazy. Generalnie zmniejszanie rozmiaru obrazu powoduje mniej zniekształceń niż zwiększanie rozmiaru. Aby przepróbkować zmienić wielkość obrazu:
|
Rysunek 7.37. Aby przepróbkować zmienić wielkość obrazu, najpierw zmień rozmiar obrazu, przeciągając jego czarne kwadratowe uchwyty za pomocą wskaźnika myszy
Rysunek 7.38. Po zmodyfikowaniu rozmiaru obrazu kliknij przycisk Przepróbkowanie, aby Aby zastosować zmiany, po zmodyfikowaniu rozmiaru obrazu kliknij przycisk Przepróbkowanie. |
Rysunek 7.39. Aby dodać tekst do obrazu, zaznacz go i kliknij przycisk Tekst - na środku obrazu pojawi się pole tekstowe
Rysunek 7.40. Wpisz tekst w polu tekstowym. Jeżeli tekst nie mieści się w polu tekstowym, powiększ jego rozmiar, przeciągając jego uchwyty za pomocą wskaźnika myszy
Rysunek 7.41. FrontPage zastosował żądaną pozycję, czcionkę i kolor tekstu |
Aby dodać tekst do obrazu:
Wskazówki
|
Aby odbarwić obraz:
|
Rysunek 7.42. Zaznacz obraz, który chcesz odbarwić
Rysunek 7.43. Aby zredukować kontrast obrazu, kliknij przycisk Kolor i z menu wybierz pozycję Odbarw
Rysunek 7.44. Odbarwiony obraz może służyć jako tło dla tekstu lub dla innego obrazu |
Rysunek 7.45. Duży obraz wolno wczytuje się do przeglądarki internetowej
Rysunek 7.46. Aby stworzyć autominiaturę, kliknij przycisk Autominiatura lub z menu Narzędzia wybierz pozycję Autominiatura (Ctrl+T)
Rysunek 7.47. Miniatura zawiera hiperłącze do obrazu oryginalnego -wystarczy więc kliknąć miniaturę, aby wyświetlić oryginał |
Autominiatury i galerie fotografii Miniatura jest małą wersją obrazu oryginalnego, która ma tę przewagę nad oryginałem, że szybciej wczytuje się do przeglądarki. Aby zobaczyć obraz oryginalny, wystarczy kliknąć jego miniaturę. Dzięki miniaturom można tworzyć albumy fotografii, na przykładnp. w celu prezentacji produktów. FrontPage pozwala ustawić właściwości miniatury, na przykładnp. rozmiar, grubość krawędzi oraz krawędź ze skosem. Można tworzyć pojedyncze miniatury (autominiatury) oraz galerie fotografii. Dzięki galeriom fotografii można przekonwertować przetworzyć cały folder obrazów na album miniatur. Galerie fotografii są nowością programu FrontPage 2002. Aby stworzyć autominiaturę:
|
Aby ustawić właściwości autominiatury:
|
Rysunek 7.48. Aby ustawić właściwości autominiatury, z menu Narzędzia wybierz pozycję Opcje strony
Rysunek 7.49. Karta Autominiatura pozwala ustawić rozmiar, grubość krawędzi oraz krawędź ze skosem autominiatury |
Rysunek 7.50. Aby stworzyć galerię fotografii, z menu Wstaw wybierz pozycję Składnik sieci Web
Rysunek 7.51. Z listy Typ składnika wybierz opcję Galeria fotografii, a następnie wybierz jeden z układów galerii dostępnych w prawym panelu
Rysunek 7.52. Aby utworzyć galerię, kliknij przycisk Dodaj, a następnie wybierz pozycję Obrazy z plików lub Obrazy ze skanera lub aparatów fotograficznych |
Aby stworzyć galerię fotografii:
|
|
Rysunek 7.53. W oknie dialogowym Otwórz plik odszukaj i zaznacz obrazy, z których chcesz utworzyć galerię
Rysunek 7.54. Zaznaczone obrazy pojawią się na liście okna dialogowego Właściwości Galerii fotografii. Zmień porządek obrazów za pomocą przycisków Przenieś w górę lub Przenieś w dół |
Rysunek 7.55. W polu Podpis lub Opis wpisz informacje o zaznaczonym obrazie
Rysunek 7.56. Galeria fotografii na stronie internetowej |
Wskazówka
|
Aby zmodyfikować galerię fotografii:
|
Rysunek 7.57. Aby zmodyfikować galerię fotografii, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Galeria fotografii - właściwości
Rysunek 7.58. Aby zmodyfikować układ galerii, wyświetl kartę Układ i wybierz nazwę układu z listy Wybierz układ
Rysunek 7.59. Aby zmodyfikować obraz umieszczony w galerii (rysunek u dołu), kliknij przycisk Edytuj (rysunek u góry) |
Rysunek 7.60. Obraz przed obróceniem lub przerzuceniem
Rysunek 7.61. Pasek narzędzi Obrazy posiada cztery narzędzia do obracania i przerzucania obrazów
Rysunek 7.62. Po lewej, obraz obrócony w lewo; po prawej, obraz przerzucony w pionie |
Aby obrócić lub przerzucić obraz:
Wskazówka
|
Aby zmodyfikować kontrast obrazu:
Aby zmodyfikować jasność obrazu:
|
Rysunek 7.63. Obraz oryginalny przed zmianą kontrastu
Rysunek 7.64. Kliknij przycisk Więcej kontrastu lub Mniej kontrastu, aby zwiększyć lub zmniejszyć kontrast obrazu
Rysunek 7.65. Po lewej, obraz o maksymalnym kontraście; po prawej, obraz o minimalnym kontraście
Rysunek 7.66. Obraz oryginalny przez zmianą jasności
Rysunek 7.67. Kliknij przycisk Większe rozjaśnienie lub Mniejsze rozjaśnienie, aby zmienić jasność obrazu
Rysunek 7.68. Po lewej, obraz o dużej jasności; po prawej, obraz o niskiej jasności |
Rysunek 7.69. Aby przyciąć obraz, zaznacz go i kliknij przycisk Przytnij
Rysunek 7.70. Kliknij i przeciągnij dowolny uchwyt prostokąta, aby Aby zdefiniować określić obszar przycięcia obrazu, kliknij i przeciągnij dowolny uchwyt prostokąta
Rysunek 7.71. FrontPage przytnie obraz, kiedy Kiedy naciśniesz klawisz Enter lub ponownie klikniesz przycisk Przytnij, obraz zostanie przycięty
Rysunek 7.72. Aby ustawić kolor przezroczystośćy, kliknij przycisk Ustaw kolor przezroczysty
Rysunek 7.73. Umieść wskaźnik myszy nad kolorem obrazu, który chcesz ustawić jako przezroczysty, i naciśnij lewy przycisk myszy
Rysunek 7.74. Umieść zmodyfikowany obraz nad innym obrazem, aby się przekonać, że jeden z jego kolorów jest występuje przezroczystyprzezroczystość |
Aby przyciąć obraz:
Aby ustawić kolor przezroczystośćy:
|
Aby usunąć kolor obrazu:
Wskazówka
Aby dodać skos do obrazu:
|
Rysunek 7.75. Aby usunąć kolor obrazu, kliknij przycisk Kolor i z menu wybierz pozycję Skala odcieni szarości
Rysunek 7.76. Aby dodać skos do obrazu, kliknij przycisk Skos (rysunek z lewej). FrontPage doda skos do zaznaczonego obrazu (rysunek z prawej) |
|
Pozycja bezwzględna obrazu FrontPage wspiera obsługuje arkusze stylów kaskadowych 2.0 (CSS 2.0) obsługiwane rozpoznawane przez przeglądarki internetowe w wersji 4 i nowsze. Oznacza to, że Rrozmieszczając obrazy na stronie internetowej, możesz korzystać z nowych metod wcześniej niedostępnychich układania. Bez arkuszy stylów kaskadowych obrazy i inne obiekty można rozmieszczać wyłącznie jeden za drugim wzdłuż i w poprzek strony. Dzięki arkuszom stylów kaskadowych 2.0 obrazy można pozycjonować układać bezwzględnie, czyli na przykładnp. umieszczać je na wierzchuu góry lub na samym dole stosu obrazów i innych obiektów. Należy jednak pamiętać o dwóch ograniczeniach. Po pierwsze, obrazy, do których zastosowano pozycjonowanie bezwzględne, w starszych przeglądarkach są wyrównywane do lewej, co nie wygląda dobrze. Po pierwsze, obrazy, w których zastosowano tę funkcję, w starszych przeglądarkach nie będą właściwie wyświetlane. Po drugie, pozycjonowania bezwzględnego nie można jej używać z dynamicznym HTML'em HTML-em (DHTML). Ponieważ nNie wszystkie przeglądarki internetowe obsługują arkusze stylów kaskadowych 2.0, więc stosuj pozycjonowanie pozycję bezwzględnąe tylko wtedy, gdy projektujesz witrynę dla użytkowników korzystających z przeglądarek w wersji 4 i nowszych. Generalnie, nNajlepiej stosować arkusze stylów kaskadowych 1.0 (CSS 1.0), które mają wpływ jedynie na formatowanie. |
Aby nadać obrazowi pozycję bezwzględną:
Wskazówka
|
Rysunek 7.77. Aby nadać obrazowi pozycję bezwzględną, najpierw go zaznacz
Rysunek 7.78. Po zaznaczeniu obrazu kliknij przycisk Pozycjonuj bezwzględnie
Rysunek 7.79. Podczas przeciągania obrazu w nowe miejsce wskaźnik myszy przyjmie postać czterech strzałek skierowanych w cztery strony świata
Rysunek 7.80. Aby mieć większą kontrolę nad pozycją obrazu, w polach dostępnych na pasku narzędzi Pozycjonowanie wpisz wartości (w pikselach) określające pozycję bezwzględną obrazu |
Rysunek 7.81. Użyj przycisku Przesuń do przodu lub Przesuń do tyłu, aby Aby zaznaczony obraz przesunąć do przodu lub do tyłu w stosunku do innych obrazów, użyj przycisku Przesuń do przodu lub Przesuń do tyłu
Rysunek 7.82. Obraz z choinką został umieszczony pod obrazem z żarówką
Rysunek 7.83. Po lewej, obraz z choinką został umieszczony pod obrazem z żarówką; po prawej, obraz z choinką został umieszczony nad obrazem z żarówką
Rysunek 7.84. Zwróć uwagę, że dla każdego obrazu można ustawić jeden kolor jako przezroczysty, co można wykorzystać podczas pozycjonowania ustawiania obrazów |
Aby obraz przesunąć do przodu lub do tyłu w stosunku do innych obrazów:
Wskazówki
|
Rozdział 8. Tworzenie i edytowanie rysunków
|
Jeżeli kiedykolwiek użyłeś programu Microsoft PowerPoint do stworzenia schematu organizacyjnego, pracowałeś z grafiką wektorową. Obrazy GIF oraz JPEG są mapami bitowymi, co oznacza, że składają się one z różnokolorowych pikseli. Rysunki natomiast są obrazami wykorzystującymi grafikę wektorową. Ponieważ Oobraz wykorzystujący grafikę wektorową jest generowany tworzony matematycznie., jego Jego plik jest dużo mniejszy niż plik odpowiadającego mu pliku GIF lub JPEG, w wyniku czego grafika wektorowa szybciej wczytuje się do przeglądarki. Trzeba jednak pamiętać, że tylko przeglądarki internetowe w wersji 5 i nowsze mogą czytać kod VML (Vector Markup Language) używany do generowania grafiki wektorowej. Aby rozwiązać ten problem, FrontPage tworzy obraz GIF dla każdego rysunku wykorzystującego grafikę wektorową. Przeglądarka, która nie obsługuje kodu VML, zamiast oryginalnego rysunku wyświetla obraz GIF. Wada tego rozwiązania polega na tym, że obraz GIF jest większy i wolniej wczytuje się do przeglądarki internetowej niż oryginalny obraz wykorzystujący grafikę wektorową. Zatem grafika wektorowa, podobnie jak wiele innych technologii, ma wady i zalety. Zwróć uwagę, że jeżeli zastosujesz grafikę wektorową, tylko użytkownicy najnowszych przeglądarek, na przykład Internet Explorer 5, będą mogli w pełni wykorzystać docenić jej zalety. |
Prawie wszystkie narzędzia programu FrontPage 2002 do tworzenia rysunków znajdują się na paskach narzędzi Rysowanie (rysunek 8.1) i WordArt (rysunek 8.2). Rysunki można podzielić na trzy grupy: proste kształty, na przykładnp. linie, strzałki, kwadraty i okręgi;, autokształty oraz obiekty WordArt. Autokształty pozwalają narysować wiele predefiniowanych podstawowych kształtów za pomocą wskaźnika myszy. Menu Autokształty zawiera również narzędzia do rysowania dowolnych kształtów. Więcej informacji na ten temat zawiera podrozdział Aby narysować dowolny kształt. Dzięki obiektom WordArt można utworzyć transparenty oraz wiele wymyślnych efektów tekstowych. Więcej informacji na ten temat zawiera podrozdział Obiekty WordArt. FrontPage 2002 jest również wyposażony w narzędzia do stworzenia kanwy rysunku, która pozwala tworzyć skomplikowane rysunki złożone z wielu kształtów. Więcej informacji na ten temat zawiera podrozdział Kanwa rysunku. Do tworzenia złożonych układów stron można wykorzystać narzędzie Pole tekstowe dostępne na pasku narzędzi Rysowanie. Więcej informacji na ten temat zawiera podrozdział Tworzenie pól tekstowych. Aby wyświetlić pasek narzędzi Rysowanie:
|
|
Rysunek 8.1. Pasek narzędzi Rysowanie zawiera prawie wszystkie narzędzia do tworzenia rysunków
Draw tool - Rysuj Choose draw tool - Wybierz narzędzie Select object - Zaznacz obiekty AutoShapes tool - Autokształty Choose AutoShape - Wybierz autokształt Line - Linia Arrow - Strzałka Rectangle - Prostokąt Oval - Elipsa Text box - Pole tekstowe Insert WordArt - Wstaw obiekt WordArt Insert clip art - Wstaw ClipArt Insert file art - Wstaw obraz z pliku Fill color - Kolor wypełnienia Choose fill color - Wybierz kolor wypełnieania Line color - Kolor linii Choose line color - Wybierz kolor linii Font color - Kolor czcionki Choose font color - Wybierz kolor czcionki Line style - Styl linii Dash style - Styl kreskowany Arrow style - Styl strzałki Shadow style - Cień 3-D style - 3-W
Rysunek 8.2. Pasek narzędzi WordArt posiada narzędzia do tworzenia i modyfikowania wymyślnych efektów tekstowych
Apply WordArt effect - Wstaw obiekt WordArt Change text - Edytuj tekst Choose WordArt effect - Galeria WordArt Format WordArt - Formatuj WordArt Shape WordArt - Kształt obiektu WordArt Letter height - Jednakowa wysokość liter WordArt Vertical letters - Tekst pionowy WordArt Alignment - Wyrównanie obiektu WordArt Letter spacing - Odstępy między znakami WordArt |
Rysunek 8.3. Aby narysować prosty kształt, wybierz jeden z czterech prostych kształtów - linię, strzałkę, prostokąt lub elipsę
Rysunek 8.4. Nie ma znaczenia, czy rysujesz strzałkę, prostokąt czy okrąg - w każdym przypadku technika rysowania kształtu jest taka sama |
Aby narysować prosty kształt:
|
Aby dodać autokształt:
Wskazówki
|
Rysunek 8.5. Aby dodać autokształt, wybierz kategorię kształtów, a następnie konkretny kształt
Rysunek 8.6. Umieść wskaźnik myszy w miejscu, w którym ma się pojawić kształt, naciśnij lewy przycisk myszy i przeciągnij jej wskaźnik (rysunek z lewej). Zwolnij przycisk myszy, kiedy kształt osiągnie żądany rozmiar (rysunek z prawej)
Rysunek 8.7. Aby umieścić autokształt na stronie internetowej, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję Autokształty (rysunek z lewej). Po pojawieniu się paska narzędzi Autokształty wybierz kształt (rysunek z prawej)
Rysunek 8.8. Aby utworzyć oddzielny pasek narzędzi Autokształty, kliknij przycisk Autokształty i przeciągnij jego menu na pulpit |
Rysunek 8.9. Aby narysować krzywą, kliknij przycisk Autokształty, z menu wybierz pozycję Linie, a następnie - narzędzie Krzywa
Rysunek 8.10. Kliknij w miejscu, w którym krzywa ma mieć swój początek, narysuj krzywą do miejsca, w którym ma się znaleźć jej środek, i kliknij ponownie (rysunek po lewej). Rysuj dalej, aż dotrzesz do punktu, w którym krzywa ma mieć swój koniec - zwróć uwagę, że miejsce, w którymgdzie kliknąłeś poprzednio, jest punktem wierzchołkowym krzywej (rysunek w środku). Kliknij dwukrotnie - FrontPage zaznaczy narysowaną krzywą (rysunek po prawej)
Rysunek 8.11. Aby zmodyfikować łuk krzywej, umieść wskaźnik myszy nad jej środkowym uchwytem, naciśnij lewy przycisk myszy i przeciągnij
Rysunek 8.12. Aby stworzyć oddzielny pasek narzędzi Linie, kliknij i przeciągnij górną krawędź podmenu Linie na pulpit |
Aby narysować krzywą:
Wskazówka
|
Aby narysować dowolny kształt:
|
Rysunek 8.13. Aby narysować dowolny kształt, kliknij przycisk Autokształty, z menu wybierz pozycję Linie, a następnie kliknij przycisk Dowolny kształt
Rysunek 8.14. Kliknij w miejscu, w którym kształt ma mieć swój początek, i zacznij rysować, klikając w każdym miejscu, w którym linia kształtu ma zmienić kierunek (rysunek po lewej). Kiedy uznasz, że kształt jest gotowy, kliknij dwukrotnie - FrontPage zaznaczy kształt (rysunek po prawej)
Rysunek 8.15. Aby zmodyfikować kształt, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Edycja punktów
Rysunek 8.16. Kliknij i przeciągnij dowolny uchwyt kształtu, aby Aby zmodyfikować jego pozycję kształtu, kliknij i przeciągnij dowolny jego uchwyt |
Rysunek 8.17. Aby pracować z narzędziem Bazgroły, kliknij przycisk Autokształty, z menu wybierz pozycję Linie, a następnie kliknij przycisk Bazgroły
Rysunek 8.18. Kliknij w miejscu, w którym krzywa Beziera ma mieć początek, i rysuj bez klikania. Kiedy uznasz, że krzywa jest gotowa, kliknij dwukrotnie - FrontPage zaznaczy krzywą (rysunek po prawej)
Rysunek 8.19. Aby zmodyfikować kształt, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Edycję punktów |
Narzędzie Bazgroły Pod skromną nazwą Bazgroły kryje się narzędzie o dużych możliwościach, choć bywa czasaemi trudne w użyciu. Narzędzie Bazgroły służy do tworzenia kształtów - kombinacji linii prostych i krzywych - znanych w programach Adobe Illustrator i Macromedia FreeHand jako krzywe Beziera. Kształt wykonany za pomocą narzędzia Bazgroły można modyfikować, przeciągając jego uchwyty za pomocą wskaźnika myszy. Aby dobrze posługiwać się tym narzędziem, trzeba trochę potrenowaćpoćwiczyć. Aby pracować z narzędziem Bazgroły:
|
|
Rysunek 8.20. Kliknij i przeciągnij dowolny uchwyt kształtu, aby Aby zmodyfikować jego pozycję kształtu, kliknij i przeciągnij dowolny jego uchwyt
Rysunek 8.21. Aby zmienić sposób działania uchwytu, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz jeden z czterech typów
Rysunek 8.22. Sposób działania uchwytu zależy od jego typu:. Od lewej, typ Autopunkt, Punkt gładki oraz Punkt narożny |
Rysunek 8.23. Prawym przyciskiem myszy kliknij kształt w miejscu, w którym chcesz dodać nowy punkt, i z menu kontekstowego wybierz pozycję Dodaj punkt. FrontPage doda nowy punkt do kształtu
Rysunek 8.24. Prawym przyciskiem myszy kliknij punkt, który chcesz usunąć, i z menu kontekstowego wybierz pozycję Usuń punkt. FrontPage usunie punkt wraz z odcinkami po jego obu stronach
Rysunek 8.25. Aby usunąć odcinek (segment) kształtu, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Usuń segment
Rysunek 8.26. Segment prosty (rysunek po lewej) działa inaczej niż segment zakrzywiony (rysunek po prawej). Aby zmienić typ segmentu, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Segment prosty lub Segment zakrzywiony (rysunek w środku)
Rysunek 8.27. Aby zamknąć otwarty kształt, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Zamknij krzywą |
Wskazówki
|
Obiekty WordArt WordArt, nowość w programie FrontPage 2002, otwiera przed autorem stron internetowych dużo wiele możliwości. Obiekty WordArt wykorzystują grafikę wektorową, co oznacza, że można je zmodyfikować w dowolnym momencie. Obiekty WordArt mMożna je wykorzystać do tworzenia przycisków oraz innych elementów związanych z nawigacją,. np. jJeżeli, na przykład, zmieniasz strukturę witryny internetowej, dużo szybciej możesz zmodyfikować przycisk wykonany powstały z obiektu z szablonu WordArt niż przycisk wykonany zrobiony z pliku w formacieobrazu GIF. Chociaż galeria obiektów WordArt zawiera wiele wymyślnych skomplikowanych stylów, najlepiej zastosować styl prosty styl, ale za to który będzie łatwiejszy w czytaniu. Aby wyświetlić pasek narzędzi WordArt:
Aby dodać obiekt WordArt:
|
Rysunek 8.28. Aby dodać obiekt WordArt, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję WordArt (rysunek po lewej) lub kliknij przycisk Wstaw obiekt WordArt dostępny na pasku narzędzi Rysowanie (rysunek po prawej)
Rysunek 8.29. Okno dialogowe Galeria WordArt pozwala wybrać jeden z 30 stylów
Rysunek 8.30. W oknie dialogowym Edytowanie tekstu WordArt wpisz tekst obiektu WordArt, a także ustaw wybierz krój, rozmiar i styl czcionki
Rysunek 8.31. Obiekt WordArt na stronie internetowej |
Rysunek 8.32. Aby zmodyfikować tekst obiektu WordArt, kliknij przycisk Edytuj tekst dostępny na pasku narzędzi WordArt
Rysunek 8.33. Możesz wybrać jeden z kilkudziesięciu kształtów tekstu
Rysunek 8.34. Możesz zmienić orientację tekstu obiektu WordArt
Rysunek 8.35. Możesz wybrać jedną z pięciu opcji wyrównania tekstu
Rysunek 8.36. Możesz zdefiniować odstępy między znakami tekstu obiektu WordArt |
Aby zmodyfikować obiekt WordArt:
|
Wskazówki
|
Rysunek 8.37. Aby szybko zmodyfikować kilka efektów WordArt, kliknij obiekt WordArt prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Formatuj obiekt WordArt (rysunek po lewej) lub kliknij przycisk Formatuj obiekt WordArt dostępny na pasku narzędzi WordArt (rysunek po prawej)
Rysunek 8.38. Zmodyfikuj właściwości obiektu WordArt za pomocą okna dialogowego Formatuj obiekt WordArt |
Rysunek 8.39. Aby zmodyfikować rozmiar rysunku, umieść wskaźnik myszy nad jednym z jego uchwytów, kliknij ten uchwyt i przeciągnij go w nowe miejsce
Rysunek 8.40. Aby zmodyfikować rozmiar linii lub strzałki, kliknij jeden z jej uchwytów i przeciągnij go w nowe miejsce
Rysunek 8.41. Zaawansowane autokształty posiadają dodatkowy uchwyt o kształcie rombu, dzięki któremu można dostosować wewnętrzne proporcje autokształtufigury |
Modyfikacja rysunków Wszystkie trzy typy rysunków programu FrontPage - proste kształty, autokształty oraz obiekty WordArt - są generowane zapisywane jako obiekty matematyczne. Oznacza to, że w dowolnym momencie można zmienić ich rozmiar lub pozycję. Obiekty te można również obracać. Kolor, styl i inne właściwości kształtów można zmienić za pomocą narzędzi dostępnych na pasku narzędzi Rysowanie. FrontPage pozwala również grupować i wyrównywać rysunki. Więcej informacji na ten temat zawiera podrozdział Wyrównywanie, modyfikowanie kolejności i grupowanie rysunków. Aby zmodyfikować rozmiar rysunku:
Wskazówki
|
Aby przesunąć rysunek:
Aby obrócić rysunek:
Aby przerzucić zrobić odbicie lustrzane rysunku: rysunek:
Wskazówka
|
Rysunek 8.42. Aby przesunąć rysunek, kliknij go, przeciągnij w nowe miejsce i zwolnij przycisk myszy
Rysunek 8.43. Aby obrócić rysunek, umieść wskaźnik myszy nad zielonym uchwytem rysunku - wskaźnik przyjmie postać zakrzywionej strzałki (rysunek po lewej). Naciśnij lewy przycisk myszy i przeciągnij wskaźnik w kierunku zgodnym lub przeciwnym z ruchem wskazówek zegara lub przeciwnym (rysunek po prawej)
Rysunek 8.44. Aby przerzucić rysunek, zaznacz (kliknij) go. Zaznaczony rysunek posiada uchwyty
Rysunek 8.45. Kliknij przycisk Rysuj dostępny na pasku narzędzi Rysowanie, z menu wybierz pozycję Obróć lub przerzuć, a następnie - pozycję Przerzuć w poziomie lub Przerzuć w pionie
Rysunek 8.46. Rysunek został przerzucony. Teraz można go poddać dalszej obróbce |
Rysunek 8.47. Zaznacz rysunek, kliknij jeden z ośmiu ostatnich przycisków dostępnych na pasku narzędzi Rysowanie, a następnie wybierz efekt z rozwijanej palety
Rysunek 8.48. Narzędzie 3-W dostępne na pasku narzędzi Rysowanie zmienia płaski prostokąt w trójwymiarowy sześcian |
Aby zmodyfikować inne właściwości rysunku:
|
Wskazówki
|
Rysunek 8.49. Pasek narzędzi Rysowanie udostępnia ogromną ilościwiele efektów
Rysunek 8.50. Aby szybko zastosować kilka efektów, kliknij obiekt prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Formatuj Autokształt
Rysunek 8.51. W oknie dialogowym Formatuj Autokształt (po lewej) zmodyfikuj właściwości kształtu (po prawej) |
Rysunek 8.52. Zaznacz obiekty, których pozycję chcesz zmodyfikować - aby zaznaczyć więcej niż jeden obiekt, podczas ich zaznaczania (klikania) obiektów trzymaj wciśnięty klawisz Ctrl
Rysunek 8.53. Aby wyrównać lub rozłożyć rozsunąć obiekty, kliknij przycisk Rysuj dostępny na pasku narzędzi Rysowanie, z menu wybierz pozycję Wyrównaj lub rozłóż, a następnie wybierz jedną z opcji
Rysunek 8.54. Dwa obiekty WordArt wyrównane do środka |
Wyrównywanie, modyfikowanie kolejności i grupowanie rysunków FrontPage jest wyposażony w narzędzia do przesuwania i pozycjonowania układania rysunków. Zalety tych narzędzi są szczególnie widoczne podczas pracy z grupami obiektów. Obiekty mMożna je wyrównać wzdłuż wspólnej osi, a także rozłożyć ułożyć równomiernie w poziomie lub w pionie. Rysunek utworzony najpóźniej znajduje się na samej górze u góry stosu rysunków, co oznacza, że nie jest on zasłonięty przez inne rysunki. Ten stan rzeczy można zmienić za pomocą opcji podmenu Kolejność. Kolejność obiektów decyduje o tym, który obiekt jest widoczny w całości, a który jest zasłonięty przez inne. obiekty. FrontPage pozwala również zgrupować kilka obiektów, czyli stworzyć grupę. Dzięki utworzeniu grupy można modyfikować właściwości wielu obiektów jednocześnie, a także przesuwać kilka obiektów jako jedną całość. Można tworzyć grupy grup, czyli podgrupy, i w ten sposób budować złożone rysunki, a przy tym łatwe do modyfikowania, rysunki. Są one łatwe do modyfikowania. Aby wyrównać lub rozłożyć obiekty:
Wskazówka
|
Aby zmodyfikować kolejność rysunków:
Wskazówka
|
Rysunek 8.55. Zaznacz obiekt, którego kolejność chcesz zmienić
Rysunek 8.56. Aby zmodyfikować kolejność obiektuobiektów, kliknij przycisk Rysuj, z menu wybierz pozycję Kolejność, a następnie - jedną z opcji podmenu
Rysunek 8.57. Możesz również kliknąć obiekt prawym przyciskiem myszy i zmienić jego kolejność za pomocą menu kontekstowego
Rysunek 8.58. Aby uzyskać zadawalający zadowalający efekt, czasem trzeba zmodyfikować kolejność kilku obiektów |
Rysunek 8.59. Zaznacz obiekty przeznaczone do grupowania. Aby zaznaczyć więcej niż jeden obiekt, podczas zaznaczania (klikania) obiektów trzymaj wciśnięty klawisz Ctrl
Rysunek 8.60. Aby zgrupować obiekty, kliknij przycisk Rysuj dostępny na pasku narzędzi Rysowanie i z menu wybierz pozycję Grupuj
Rysunek 8.61. Zaznaczone obiekty są traktowane jak jeden obiekt, stały się jednym obiektem, o czym świadczy jeden zestaw uchwytów
Rysunek 8.62. Jeżeli spróbujesz zaznaczyć obiekt należący do grupy, w jego uchwytach pojawią się symbole x - to informacja, FrontPage informuje w ten sposób, że obiektu nie można zaznaczyć
Rysunek 8.63. Aby rozgrupować rozdzielić grupę obiektów, kliknij przycisk Rysuj dostępny na pasku narzędzi Rysowanie i z menu wybierz pozycję Rozgrupuj |
Aby zgrupować obiekty:
Wskazówka
|
Kanwa rysunku Tworząc rysunki, możesz to robić bezpośrednio na stronie internetowej lub na kanwie rysunku. Kanwa rysunku posiada ma kilka zalet. Po pierwsze, kanwę można ją przesunąć wraz z wszystkimi jej rysunkami - rysunków nie trzeba ich wtedy zaznaczać przed ich przesunięciem. Po drugie, można zmienić rozmiar kanwy lub nawet ją przeskalować wraz z wszystkimi jej rysunkami. Narzędzia potrzebne do pracy z kanwą zawiera pasek narzędzi Kanwa rysunku (rysunek 8.64). Aby wyświetlić pasek narzędzi Kanwa rysunku:
|
Rysunek 8.64. Pasek narzędzi Kanwa rysunku posiada narzędzia do modyfikowania rozmiaru kanwy, która może zawierać zaawansowany trudny rysunek
Fit canvas to drawings - Dopasuj rysunek do zawartości Enlarge canvas - Rozwiń rysunek Scale canvas up or down - Skaluj rysunek
Rysunek 8.65. Aby wyświetlić pasek narzędzi Kanwa rysunku, z menu Widok wybierz pozycję Paski narzędzi, a następnie - pozycję Kanwa rysunku (po lewej) lub prawym przyciskiem myszy kliknij istniejącą już kanwę rysunku i z menu kontekstowego wybierz pozycję Pokaż pasek narzędzi kanwy rysunku (po prawej) |
Rysunek 8.66. Aby utworzyć kanwę rysunku, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję Nowy rysunek
Rysunek 8.67. Aby zmienić rozmiar kanwy rysunku, kliknij i przeciągnij jeden z jej narożnych lub bocznych uchwytów
Rysunek 8.68. Rozmiar kanwy został zmodyfikowany
Rysunek 8.69. Kanwa rysunku może zawierać wiele kształtów |
Aby utworzyć kanwę rysunku:
|
Aby zaznaczyć kanwę rysunku:
Aby przesunąć kanwę rysunku:
|
Rysunek 8.70. Aby zaznaczyć kanwę, kliknij rysunek - w odpowiedzi pojawi się krawędź kanwy rysunku
Rysunek 8.71. Aby przesunąć kanwę rysunku, zaznacz ją i przeciągnij w nowe miejsce. Zwolnij przycisk myszy. Kanwa rysunku wraz z całą zawartością znajdzie się w nowym miejscu (rysunek u dołu) |
Rysunek 8.72. Aby zmienić rozmiar kanwy rysunku, kliknij i przeciągnij jeden z jej uchwytów
Rysunek 8.73. Aby stopniowo powiększać rozmiar kanwy rysunku, zaznacz ją i kliknij przycisk Rozwiń tyle razy, ile trzeba, aby osiągnęła ona żądany rozmiar do osiągnięcia przez kanwę żądanego rozmiaru |
Zmiana rozmiaru kanwy rysunku Kanwę rysunku można powiększyć, aby zmieścić na niej dodatkowe obiekty, lub zmniejszyć, aby uzyskać dodatkowe miejsce na stronie internetowej. Rozmiar kanwy rysunku można zmodyfikować na kilka sposobów bez naruszania rozmiaru obiektów umieszczonych na kanwie. Aby zmienić rozmiar kanwy rysunku za pomocą wskaźnika myszy:
Aby powiększyć kanwę rysunku za pomocą narzędzia Rozwiń:
|
Aby dopasować rozmiar kanwy rysunku do jej zawartości:
Wskazówka
|
Rysunek 8.74. Aby dopasować rozmiar kanwy rysunku do jej zawartości, zaznacz kanwę ją (rysunek po lewej) i kliknij przycisk Dopasuj. FrontPage dopasuje Rrozmiar kanwy zostanie dopasowany do jej zawartości (rysunek po prawej)
|
Rysunek 8.75. Zaznacz kanwę rysunku (rysunek po lewej) i kliknij przycisk Skaluj rysunek dostępny na pasku narzędzi Kanwa rysunku - uchwyty kanwy przyjmą postać małych okręgów (rysunek po prawej)
Rysunek 8.76. Aby przeskalować zmienić skalę kanwyę rysunku z zachowaniem proporcji, kliknij i przeciągnij jeden z jej narożnych uchwytów kanwy |
Skalowanie kanwy rysunku Różnica między skalowaniem a modyfikowaniem rozmiaru kanwy rysunku polega na tym, że w wyniku skalowania zmienia się rozmiar obiektów umieszczonych na kanwie. Kanwę rysunku można skalować z zachowaniem lub bez zachowania współczynnika proporcji obiektów stanowiących jej zawartość. Aby przeskalować zmienić skalę kanwyę rysunku z zachowaniem proporcji:
|
Aby przeskalować zmienić skalę kanwyę rysunku bez zachowania proporcji:
|
Rysunek 8.77. Jeżeli przeciągniesz jeden z bocznych uchwytów kanwy (rysunek u góry), obiektów umieszczonych na kanwie, FrontPage zmieni szerokość, ale nie wysokość, obiektów umieszczonych na kanwie |
Rysunek 8.78. Aby sformatować kanwę rysunku, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Formatuj kanwę rysunku
Rysunek 8.79. W oknie dialogowym Formatuj kanwę rysunku można zmodyfikować kilka właściwości kanwy jednocześnie
Rysunek 8.80. Standardowo styl pozycjonowania kanwy rysunku jest ustawiony na opcję Brak, dzięki czemu zawartość strony internetowej dopasowuje się do kanwy |
Formatowanie kanwy rysunku Standardowo zawartość strony internetowej zawija się wokół kanwy rysunku. Ma to tę zaletę, że po dodaniu kanwy do strony internetowej istniejąca zawartość strony dopasowuje się do niejkanwy. Aby sformatować kanwę rysunku:
|
Tworzenie pól tekstowych Na pasku narzędzi Rysowanie znajduje się narzędzie do tworzenia pól tekstowych, czyli ramek generowanych tak samo jak rysunki, tj. za pomocą kodu VML. Ramki tekstowe często występują w publikacjach drukowanych, ale mogą sprawiać problemy na stronach internetowych. W polach testowych można umieścić dodatkowy tekst artykułu lub tekst, który chcemy wyróżnić. Ich zZaletą pól testowych jest to, że można je umieścić na stronie, która jest już prawie gotowa. Ułatwia to tworzenie stron internetowych o złożonym układzie. Mimo swojej nazwy pola tekstowe mogą zawierać nie tylko tekst, ale i grafikę. Zwróć uwagę, że pola tekstowe, o których mowa w tym podrozdziale, nie mają nic wspólnego z polami tekstowymitymi od dawna używanymi w formularzach HTML (patrz rozdział 12., Tworzenie i przetwarzanie formularzy). Pola tekstowe, podobnie jak rysunki, działają prawidłowo w przeglądarkach internetowych w wersji 5 i nowszych. Aby na stronie internetowej umieścić pole tekstowe:
|
Rysunek 8.81. Aby na stronie internetowej umieścić pole tekstowe, kliknij przycisk Pole tekstowe dostępny na pasku narzędzi Rysowanie
Rysunek 8.82. Naciśnij lewy przycisk myszy i za pomocą wskaźnika myszy narysuj prostokąt wyznaczający rozmiar pola tekstowego
Rysunek 8.83. Aby ustawić właściwości pola tekstowego, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Formatuj pole tekstowe |
Rysunek 8.84. Standardowo w sekcji Styl pozycjonowania jest wybrana opcja Bezwzględne, co sprawia, że tuż po utworzeniu pole pola tekstowego unosi się nad istniejącaą zawartośćcią strony internetowej oblewa je
Rysunek 8.85. Jeżeli chcesz, aby zawartość strony internetowej dopasowała się do pola tekstowego, w sekcji Styl pozycjonowania wybierz opcję Brak oraz wybierz odpowiednią opcję w sekcji Styl otaczania
Rysunek 8.86. Istniejąca zawartość strony internetowej dopasowała się do pola tekstowego |
|
Wskazówki
|
Rysunek 8.87. Aby zmodyfikować tekst w polu tekstowym, zaznacz go i kliknij prawym przyciskiem myszy, a następnie z menu kontekstowego wybierz pozycję Czcionka
Rysunek 8.88. Po zmodyfikowaniu właściwości tekstu w oknie dialogowym Czcionka może się okazać, że trzeba zmienić rozmiar pola tekstowego
Rysunek 8.89. Pole tekstowe może zawierać tekst i grafikę. Jeżeli w polu tekstowym umieścisz obraz, dostosuj rozmiar pola lub obrazu |
Rozdział 9. Multimedia i składniki sieci Web
|
Multimedia mogą ożywić stronę internetową i przyciągnąć uwagę użytkowników. Jednak ze względu na fakt, że sSkładniki multimedialne spowolniają jednak działanie witryny internetowej., należy Należy więc za pomocą wskaźnika postępu pobierania strony sprawdzić czas wczytywania się strony ze składnikami multimedialnymi do przeglądarki internetowej za pomocą wskaźnika postępu pobierania strony (rysunek 2.1, rozdział 2, FrontPage 2002 - pierwsze kroki). FrontPage 2002 jest wyposażony w narzędzia do umieszczania na stronach internetowych trzech podstawowych typów multimediów: filmów wideo i animacji, podkładu dźwiękowego oraz składników sieci Web, m.in. transparentów reklamowych, neonów i liczników trafień. FrontPage udostępnia obecnie ponad 25 takich składników. Niektórymi z nich, na przykładnp. przyciskami aktywowanymi, zajmowaliśmy się już w poprzednich rozdziałach. Więcej informacji na temat innych składników multimedialnych zawiera podrozdział Składniki sieci Web. |
Filmy wideo i animacje Chociaż teoretycznie witryna internetowa może zawierać pełnometrażowy film wideo, istnieje niewiele połączeń internetowych wystarczająco szybkich do obsłużenia tak dużego pliku. Najlepiej więc używać filmów wideo i animacji o małych rozmiarach, na przykładnp. animowanych znaków firmowych lub strzałek. Pamiętaj: im mniejszy plik wideo, tym lepiej. Aby wstawić film wideo lub animację:
|
Rysunek 9.1. Aby wstawić film wideo lub animację, z menu Wstaw wybierz pozycję Obraz, a następnie - pozycję Wideo
Rysunek 9.2. Okno dialogowe Wideo, które wyświetla pliki wideo bieżącej witryny internetowej, służy również do wyszukiwania filmów wideo i animacji na dysku twardym lub w Internecie
Rysunek 9.3. FrontPage wyświetla pierwszą klatkę filmu wideo lub animacji umieszczonej na stronie internetowej |
Rysunek 9.4. Jeżeli film wideo lub animacja nie pochodzi z bieżącej witryny internetowej, FrontPage wyświetli okno dialogowe Zapisywanie plików osadzonych, dzięki któremu można zapisać nowy plik multimedialny
Rysunek 9.5. Clip Organizer udostępnia kolekcję bezpłatnych klipów multimedialnych |
Wskazówka
|
Aby określić liczbę ilość powtórzeń filmu wideo lub animacji:
|
Rysunek 9.6. Aby określić liczbę ilość powtórzeń filmu wideo lub animacji, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości obrazu
Rysunek 9.7. Na karcie Wideo okna dialogowego Właściwości obrazu możesz określić liczbę ilość powtórzeń filmu wideo lub animacji |
Rysunek 9.8. Przyciski kontrolujące odtwarzanie filmu wideo pozwalają użytkownikowi przerwać, przewinąć, zatrzymać lub odtworzyć ponownie film wideo
Rysunek 9.9. Aby dodać przyciski kontrolujące odtwarzanie filmu wideo, z menu Wstaw wybierz pozycję Składnik sieci Web
Rysunek 9.10. Po pojawieniu się okna dialogowego Wstawianie składnika sieci Web z listy Typ składnika wybierz pozycję Formanty zaawansowane, z listy Wybierz formant - pozycję Dodatek typu plug-in, a następnie kliknij przycisk Zakończ
Rysunek 9.11. Kliknij przycisk Przeglądaj okna dialogowego Właściwości dodatku typu plug-in, aby Aby odszukać plik wideo, kliknij przycisk Przeglądaj okna dialogowego Właściwości dodatku typu plug-in |
Przyciski kontrolujące odtwarzanie filmu wideo Dzięki przyciskom kontrolującym odtwarzanie filmu wideo użytkownicy strony internetowej mogą przerwać, przewinąć, zatrzymać lub odtworzyć ponownie film wideo (rysunek 9.8). W wielu przypadkach nie jest to konieczne, ale warto wiedzieć, że jest istnieje taka możliwość. Przed wykonaniem poniższych instrukcji wstaw film wideo, postępując według instrukcji podrozdziału Aby wstawić film wideo lub animację. Aby dodać przyciski kontrolujące odtwarzanie filmu wideo:
|
Wskazówka
|
Rysunek 9.12. Odszukaj i zaznacz plik wideo, a następnie kliknij przycisk Otwórz
Rysunek 9.13. Ścieżka wybranego pliku wideo pojawi się w polu Źródło danych okna dialogowego Właściwości dodatku typu plug-in. Podaj tekst alternatywny, określ rozmiar i układ filmu wideo, a następnie kliknij przycisk OK
Rysunek 9.14. W widoku Normalny FrontPage wyświetla symbol zastępczy (rysunek po lewej); w widoku Podgląd FrontPage wyświetla film wideo z przyciskami (rysunek po prawej)
Rysunek 9.15. Formanty ActiveX (rysunek u góry) umożliwiają dużą kontrolę nad wieloma elementami (rysunek u dołu), ale działają one tylko w przeglądarkach firmy Microsoft |
Rysunek 9.16. Aby dodać podkład dźwiękowy do strony internetowej, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości strony
Rysunek 9.17. Wyświetl kartę Ogólne okna dialogowego Właściwości strony, aby Aby uzyskać dostęp do sekcji Podkład dźwiękowy, wyświetl kartę Ogólne okna dialogowego Właściwości strony
Rysunek 9.18. Kliknij przycisk Przeglądaj, aby Aby odszukać plik dźwiękowy, kliknij przycisk Przeglądaj. Standardowo plik dźwiękowy jest odtwarzany w nieskończonej pętli. Aby ograniczyć liczbęilość odtworzeń, podaj wartość w polu Pętla |
Podkład dźwiękowy Podkład dźwiękowy może tworzyć miły nastrój lub doprowadzać denerwować użytkowników do szału - wszystko zależy od rodzaju witryny internetowej. Zanim dodasz podkład dźwiękowy do strony, zastanów się, czy naprawdę jest on potrzebny. Aby dodać podkład dźwiękowy do strony internetowej:
Wskazówki
|
Składniki sieci Web FrontPage 2002 oferuje ponad 25 składników multimedialnych, dzięki którym można tworzyć interaktywne strony internetowe. W porównaniu z poprzednią wersją tego programu zestaw multimediów składników sieci Web został znacznie rozszerzonyposzerzony. FrontPage 2002, oprócz składników dostępnych w poprzedniej wersji (transparentu reklamowego, licznika trafień oraz neonu) pozwala tworzyć spisy treści, pierwszą dziesiątkę najczęściej odwiedzanych stron witryny internetowej, dynamicznie uaktualnianą zawartość strony oraz a także takie strony, których zawartość zależy od daty i czasu. Zwróć uwagę, że niektóre składniki sieci Web działają prawidłowo tylko wtedy, gdy serwer, na którym umieszczono witrynę internetową, posiada rozszerzenia programu FrontPage 2002 (zestaw programów i skryptów wspomagających tworzenie witryn internetowych i rozszerzających zwiększających możliwości serwera internetowego). Składniki sieci Web, choć pozwalają tworzyć interesujące strony, czasem wykluczają użytkowników, którzy nie korzystają z produktów firmy Microsoft. |
|
Rysunek 9.19. Aby dodać transparent reklamowy, najpierw z menu Wstaw wybierz pozycję Składnik sieci Web
Rysunek 9.20. Po pojawieniu się okna dialogowego Wstawianie składnika sieci Web z listy Typ składnika wybierz pozycję Efekty dynamiczne, a z listy Wybierz efekt - pozycję Menadżer transparentów reklamowych |
Menadżer transparentów reklamowych Transparent reklamowy, niczym automatyczny pokaz slajdów, wyświetla obrazy w sekwencji czasowej. Transparenty reklamowe sStały się on nieodzownym elementem komercyjnych witryn internetowych z tego powodu tego, że przyciągają uwagę użytkowników. Transparent reklamowy nie musi jednak służyć tylko do reklamowania zachęcania do kupna produktów, np.. W w przypadku firmowego Intranetu, na przykład, transparent reklamowy może informować o sprawach istotnych dla firmy, czy to będzie nowy fundusz emerytalny, czy piątkowa impreza w pubie. Aby dodać transparent reklamowy:
|
Wskazówki
|
Rysunek 9.21. W oknie dialogowym Właściwości Menadżera transparentów reklamowych określ rozmiar transparentu, efekt przejścia między obrazami oraz obrazy wyświetlane obrazy w transparencie
Rysunek 9.22. FrontPage wyświetla tylko pierwszy obraz transparentu reklamowego (rysunek u góry); aby zobaczyć transparent w działaniu, uruchom przeglądarkę internetową (rysunek u dołu) |
Rysunek 9.23. Aby zmodyfikować transparent reklamowy, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości Menadżera transparentów reklamowych |
Aby zmodyfikować transparent reklamowy:
Aby usunąć transparent reklamowy:
|
Aby dodać licznik trafień:
Wskazówka
|
Rysunek 9.24. Aby dodać licznik trafień, z lewej listy okna dialogowego Wstawianie składnika sieci Web wybierz pozycję Licznik trafień, a z prawej listy wybierz styl licznika
Rysunek 9.25. W oknie dialogowym Właściwości licznika trafień wybierz styl licznika lub obraz niestandardowy
Rysunek 9.26. FrontPage umieścił na stronie symbol zastępczy. Aby zobaczyć licznik trafień w działaniu, stronę trzeba opublikować |
Rysunek 9.27. Aby zmodyfikować licznik trafień, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości składnika programu FrontPage |
Aby zmodyfikować licznik trafień:
Aby usunąć licznik trafień:
|
Aby dodać neon:
|
Rysunek 9.28. Aby dodać neon, z listy Typ składnika wybierz pozycję Efekty dynamiczne, a z listy Wybierz efekt - pozycję Neon
Rysunek 9.29. W oknie dialogowym Właściwości neonu wpisz tekst neonu oraz zdefiniuj jego ruch i wygląd
Rysunek 9.30. Wyświetl stronę w widoku Podgląd, aby Aby sprawdzić, czy neon trzeba zmodyfikować, wyświetl stronę w widoku Podgląd |
Okno dialogowe Właściwości neonu Aby otworzyć okno dialogowe Właściwości neonu (rysunek 9.29), zobacz podrozdział Aby dodać neon, lub prawym przyciskiem myszy kliknij istniejący neon i z menu kontekstowego wybierz pozycję Właściwości neonu.
Rysunek 9.31. Subtelna Niewielka różnica: w przypadku opcji Przewijanie (rysunek u góry) w pewnym momencie neon jest pusty; w przypadku opcji Wysuwanie (rysunek u dołu) neon nigdy nie jest pusty |
|
Aby zmodyfikować neon:
Wskazówka
Aby usunąć neon:
|
Rysunek 9.32. Aby zmodyfikować neon, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości neonu
Rysunek 9.33. Aby zmienić rozmiar neonu, zaznacz (kliknij) go, a następnie przeciągnij dowolny z jego uchwytów |
Rysunek 9.34. Aby dodać spis treści, z listy Typ składnika wybierz pozycję Spis treści, a z listyna liście Wybierz spis treści wybierz zaznacz pozycję Dla tej witryny sieci Web
Rysunek 9.35. Aby jako punktu początkowego spisu treści użyć innej strony niż index.htm, kliknij przycisk Przeglądaj i odszukaj ją |
Tworzenie spisu treści witryny internetowej FrontPage pozwala zbudować dynamicznie ciągle aktualizowany spis treści witryny internetowej. Spis treści jest mapą witryny internetowej, dzięki której użytkownik może odszukać interesujący go temat. Aby dodać spis treści:
|
Wskazówki
|
Rysunek 9.36. FrontPage umieścił na stronie internetowej zastępczy spis treści
Rysunek 9.37. Aby zobaczyć spis treści w działaniu, z menu Plik wybierz pozycję Podgląd w przeglądarce
Rysunek 9.38. Aby zmodyfikować spis treści, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości spisu treści |
Rysunek 9.39. Aby stworzyć pierwszą dziesiątkę, z listy Typ składnika wybierz pozycję Pierwsza dziesiątka, a zna liście listy Wybierz listę zastosowań wybierz zaznacz jedną z siedmiu pozycji
Rysunek 9.40. W oknie dialogowym Właściwości pierwszej dziesiątki podaj tytuł i wybierz styl listy
Rysunek 9.41. Aby zobaczyć pierwszą dziesiątkę w działaniu, witrynę internetową trzeba opublikować na serwerze. FrontPage wyświetla tylko element zastępczy |
Tworzenie pierwszej dziesiątki Składnik Pierwsza dziesiątka, nowość w programie FrontPage 2002, pozwala udostępniać informacje o witrynie internetowej jej użytkownikom. Można, na przykład, utworzyć stale uaktualnianą listę dziesięciu najczęściej odwiedzanych stron witryny internetowej. Aby stworzyć pierwszą dziesiątkę:
|
Rozdział 10. Tworzenie i formatowanie tabel
|
Tabele ułatwiają budowę przejrzystych stron internetowych zawierających tekst i obrazy. Tabelę Są złożone złożoną z wierszy i kolumn, a więc łatwo je formatować - np. można, na przykład, zmodyfikować wygląd obramowania tabeli lub kolor jej poszczególnych komórek. Dużą ich zaletą tabel jest to, że zachowują one swój wygląd we wszystkich przeglądarkach internetowych. Z tego powodu w projektach wielu komercyjnych witryn internetowych tabele odgrywają rolę siatki, dzięki której, podobnie jak w tradycyjnych publikacjach drukowanych, można rozmieścić tekst i obrazy w przejrzysty sposób. Zwróć jednak uwagę, że strona internetowa powinna zawierać nie jedną, ale kilka tabel - w ten sposób górna część strony, czyli tabela umieszczona najwyżej, pojawi się w przeglądarce najszybciej, przed pojawieniem się w niej dolnej części strony, czyli tabel umieszczonych niżej. Pracę z tabelami przyspieszają narzędzia dostępne na pasku narzędzi Tabele (rysunek 10.1). Aby go wyświetlić ten pasek narzędzi, z menu Widok wybierz pozycję Paski narzędzi, a następnie - pozycję Tabele. |
Rysunek 10.1. Aby utworzyć tabelę nie trzeba korzystać z menu Tabela - można użyć narzędzi dostępnych na pasku narzędzi Tabele
Draw table - Rysuj tabelę Erase - Gumka Insert rows - Wstaw wiersze Insert columns - Wstaw kolumny Delete cells - Usuń komórki Merge cells - Scal komórki Split cells - Podziel komórki Align top - Wyrównaj do góry Center - Wyśrodkuj pionowo Align bottom - Wyrównaj do dołu Spread rows evenly - Rozłóż wiersze równomiernie Spread columns evenly - Rozłóż kolumny równomiernie Autofill - Automatycznie dopasuj do zawartości Apply fill color - Kolor wypełnienia Choose fill color - Wybierz kolor wypełnienia Apply AutoFormat Combo - Pole kombi autoformatowania tabeli Choose AutoFormat Combo - Wybierz typ autoformatowania AutoFormat - Autoformatowanie tabeli Fill down - Wypełniaj w dół Fill right - Wypełniaj w prawo |
Tworzenie tabel Tabelę można narysować za pomocą wskaźnika myszy lub utworzyć za pomocą okna dialogowego. Aby narysować tabelęto zrobić, należy użyć narzędzia zmieniającego wskaźnik myszy w ołówek. Jest to prosty i ulubiony przez wielu użytkowników sposób tworzenia tabel. Jeżeli jednak trzeba utworzyć tabelę o precyzyjnych rozmiarach, najlepiej skorzystać z okna dialogowego do ich budowaniatworzenia tabel. Aby narysować tabelę:
Wskazówka
|
Rysunek 10.2. Aby narysować tabelę, z menu Tabela wybierz pozycję Rysuj tabelę (rysunek po lewej) lub kliknij przycisk Rysuj tabelę dostępny na pasku narzędzi Tabele (rysunek po prawej)
Rysunek 10.3. Naciśnij lewy przycisk myszy i przeciągnij wskaźnik ukośnie, aby Aby narysować prostokąt wyznaczający rozmiar tabeli (rysunek po lewej), naciśnij lewy przycisk myszy i przeciągnij wskaźnik ukośnie, a następnie zwolnij przycisk myszy (rysunek po prawej)
Rysunek 10.4. Wewnątrz tabeli narysuj linii pionowe lub poziome, aby Aby utworzyć jej kolumny lub wiersze, wewnątrz tabeli narysuj linii pionowe lub poziome
Rysunek 10.5. Aby zmienić rozmiar dowolnej części tabeli, umieść wskaźnik myszy nad krawędzią komórki - wskaźnik przyjmie postać dwukierunkowej strzałki. Naciśnij lewy przycisk myszy i przeciągnij wskaźnik w żądanym kierunku, a następnie zwolnij przycisk myszy |
Rysunek 10.6. Aby wstawić tabelę, z menu Tabela wybierz pozycję Wstaw, a następnie - pozycję Tabela
Rysunek 10.7. W oknie dialogowym Wstawianie tabeli zdefiniuj rozmiar i układ tabeli
Rysunek 10.8. Wpływ dopełnienia komórek, czyli obszaru wewnątrz komórek, na wygląd tabeli (rysunek u góry) oraz wpływ odstępów między komórkami, czyli obszaru między komórkami, na wygląd tabeli (rysunek u dołu)
Rysunek 10.9. Aby szybko utworzyć tabelę, kliknij przycisk Wstaw tabelę dostępny na pasku narzędzi Standardowy i . Zza pomocą wskaźnika myszy wskaż zaznacz liczbę ilość wierszy i kolumn, z których ma się ona składać tworzona tabela |
Aby wstawić tabelę:
Wskazówki
|
Aby w tabeli wpisać tekst:
Aby w tabeli umieścić obraz:
Wskazówka
|
Rysunek 10.10. Aby w tabeli wpisać tekst, najpierw kliknij wewnątrz jednej z jej komórek
Rysunek 10.11. Podczas pisania rozmiar komórki dopasowuje się do tekstu
Rysunek 10.12. Aby w tabeli umieścić obraz, kliknij przycisk Wstaw obraz z pliku
Rysunek 10.13. W oknie dialogowym Obraz odszukaj obraz, który chcesz wstawić do tabeli
Rysunek 10.14. Rozmiar komórki dopasował się do rozmiaru obrazu
Rysunek 10.15. Jeżeli zawartość nie mieści się w komórce, kliknij przycisk Automatycznie dopasuj do zawartości dostępny na pasku narzędzi Tabele |
Rysunek 10.16. Aby do tabeli dodać podpis, umieść w niej kursor i z menu Tabela wybierz pozycję Wstaw, a następnie - pozycję Podpis
Rysunek 10.17. Standardowo FrontPage umieszcza podpis na środku nad tabelą
Rysunek 10.18. Pozycję podpisu można zmienić w oknie dialogowym Właściwości podpisu |
Aby do tabeli dodać podpis:
Wskazówka
|
Wstawianie arkuszy programu Excel Program Microsoft Excel można wykorzystać podczas tworzenia stron internetowych na dwa sposoby. Po pierwsze, dane arkusza kalkulacyjnego programu Excel można umieścić na stronie internetowej, tworząc w ten sposób tabelę danych statycznych, czyli danych nieuaktualnianych. Druga metoda polega na używaniu programu Excel wewnątrz strony internetowej do wprowadzania dynamicznych danych i formuł. Zwróć uwagę, że z tej metody mogą korzystać tylko użytkownicy posiadający Microsoft Office 2000 lub Microsoft Office XP oraz Office Web Components. Jeżeli więc użytkownik oprócz przeglądarki internetowej nie posiada również pakietu Office, nie będzie mógł on oglądać strony z dynamicznym arkuszem kalkulacyjnym pakietu Office. Jednak w wielu firmach pakiet Office 2000 lub Office XP jest standardowym wyposażeniem - w takim przypadku użytkownicy firmowych Intranetów mogą wymieniać i dynamicznie ciągle aktualizować arkusze programu Excel w sieci. Aby na stronie internetowej umieścić statyczne dane programu Excel:
Wskazówka
|
Rysunek 10.19. Aby na stronie internetowej umieścić statyczne dane programu Excel, najpierw z menu Wstaw wybierz pozycję Plik
Rysunek 10.20. Aby odszukać plik programu Excel, z listy rozwijanej Pliki typu okna dialogowego Wybierz plik wybierz pozycję Skoroszyt programu Microsoft Excel
Rysunek 10.21. FrontPage umieścił na stronie internetowej dane programu Excel w postaci tabeli bez obramowania
Rysunek 10.22. Tabelę z danymi programu Excel można sformatować, aby nadać jej bardziej tradycyjny wygląd |
Rysunek 10.23. Aby dodać dynamiczny arkusz programu Excel, skorzystaj z okna dialogowego Wstawianie składnika sieci Web
Rysunek 10.24. Pusty arkusz programu Excel dodany do strony internetowej można wypełnić danymi i formułami
Rysunek 10.25. Aby zaimportować dołączyć istniejący arkusz programu Excel, kliknij przycisk Polecenia i opcje dostępny na pasku narzędzi pustego arkusza
Rysunek 10.26. Użyj karty Importowanie okna dialogowego Polecenia i opcje do wczytania danych z istniejącego arkusza do arkusza umieszczonego na stronie internetowej |
Aby na stronie internetowej umieścić dynamiczne zmienne dane programu Excel:
Wskazówka
|
Zaznaczanie elementów tabeli W przeciwieństwie do innych zadań wykonywanych w programie FrontPage, zaznaczanie komórek, wierszy i kolumn nie zawsze jest operacją typu kliknij-i-przeciągnij. Aby zaznaczyć komórkę:
lub
Aby zaznaczyć więcej niż jedną komórkę:
lub
|
Rysunek 10.27. Aby zaznaczyć komórkę, naciśnij klawisz Alt i kliknij wewnątrz tej komórki
Rysunek 10.28. Aby zaznaczyć dowolny element tabeli, z menu Tabela wybierz pozycję Wybierz, a następnie - jedną z pozycji podmenu
Rysunek 10.29. Aby zaznaczyć komórki, które do siebie przylegają, umieść kursor w jednej z komórek przeznaczonych do zaznaczenia, a następnie przeciągnij wskaźnik myszy, aby zaznaczyć dodatkowe komórki w celu zaznaczenia dodatkowych komórek
Rysunek 10.30. Aby zaznaczyć komórki, które do siebie nie przylegają, naciśnij klawisz Alt i kliknij jedną z wybranych komórek przeznaczonych do zaznaczenia, a następnie naciśnij kombinację klawiszy (Alt+Shift) i kliknij każdą z pozostałych komórek przeznaczonych do zaznaczenia |
Rysunek 10.31. Aby zaznaczyć wiersz, przesuń wskaźnik myszy do lewej krawędzi wiersza przeznaczonego do zaznaczenia (rysunek po lewej) - wskaźnik zmieni się w czarną strzałkę (rysunek w środku) - i kliknij. FrontPage zaznaczy wiersz (rysunek po prawej) |
Aby zaznaczyć wiersz:
lub
lub
Aby zaznaczyć kolumnę:
lub
lub
Aby zaznaczyć całą tabelę:
lub
|
Zmiana struktury tabeli FrontPage pozwala modyfikować tabelę w dowolnym momencie. Można na przykład dodać komórkę, wiersz lub kolumnę, a nawet wstawić tabelę do tabeli. Aby dodać komórkę:
Wskazówka
|
Rysunek 10.32. Umieść kursor w komórce, na lewo od której chcesz dodać nową komórkę
Rysunek 10.33. Aby dodać element do tabeli, z menu Tabela wybierz pozycję Wstaw, a następnie - jedną z pozycji podmenu
Rysunek 10.34. FrontPage dodał komórkę na lewo od komórki wybranej w punkcie 1. |
Rysunek 10.35. Zaznacz wiersz, nad którym albo pod którym chcesz dodać nowy wiersz
Rysunek 10.36. Kliknij przycisk Wstaw wiersze dostępny na pasku narzędzi Tabele
Rysunek 10.37. W oknie dialogowym Wstawianie wierszy lub kolumn podaj liczbę ilość wierszy do wstawienia
Rysunek 10.38. Nowy wiersz dodany do tabeli jest pusty
Rysunek 10.39. Aby szybko dodać wiersz (lub wiersze), zaznacz jeden z już istniejących wierszy, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Wstaw wiersze |
Aby dodać wiersz:
Wskazówka
|
Aby dodać kolumnę:
Wskazówka
|
Rysunek 10.40. Zaznacz kolumnę, obok której chcesz dodać nową kolumnę
Rysunek 10.41. Kliknij przycisk Wstaw kolumny dostępny na pasku narzędzi Tabele
Rysunek 10.42. W oknie dialogowym Wstawianie wierszy lub kolumn podaj liczbę ilość kolumn do wstawienia
Rysunek 10.43. Nowa kolumna dodana do tabeli jest pusta
Rysunek 10.44. Aby szybko dodać kolumnę (lub kolumny), zaznacz jedną z istniejących kolumn, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Wstaw kolumny |
Rysunek 10.45. Aby usunąć dowolną część tabeli, zaznacz ją i z menu Tabela wybierz pozycję Usuń komórki (rysunek po lewej) lub kliknij przycisk Usuń komórki dostępny na pasku narzędzi Tabele (rysunek po prawej)
Rysunek 10.46. Aby szybko usunąć element tabeli, zaznacz go i kliknij prawym przyciskiem myszy, a następnie z menu kontekstowego wybierz pozycję Wytnij |
Aby usunąć dowolną część tabeli:
Wskazówka
|
Dzielenie i scalanie komórek Do tworzenia i usuwania pojedynczych poszczególnych komórek bez naruszania struktury reszty tabeli służą narzędzia do dzielenia i ich scalania. komórek. Dzięki tym narzędziom można podzielić komórkę na dwie komórki lub z kilku komórek utworzyć jedną komórkę. Można, na przykład np., utworzyć dużą komórkę w środku tabeli poprzez scalenie kilku przylegających do siebie komórek bez naruszania struktury reszty tabeli. Aby podzielić komórkę:
Wskazówka
|
Rysunek 10.47. Aby podzielić komórkę, umieść w niej kursor i z menu Tabela wybierz pozycję Podziel komórki
Rysunek 10.48. Aby scalić komórki, kliknij przycisk Scal komórki; a. Aby podzielić komórki, kliknij przycisk Podziel komórki. Oba przyciski znajdują się na pasku narzędzi Tabele
Rysunek 10.49. W oknie dialogowym Dzielenie komórek wybierz sposób dzielenia komórki: pionowo - na kolumny lub poziomo - na wiersze |
Rysunek 10.50. Aby scalić komórki, z menu Tabela wybierz pozycję Scal komórki
Rysunek 10.51. Komórki możesz również scalić za pomocą narzędzia Gumka dostępnego na pasku narzędzi Tabele
Rysunek 10.52. Umieść wskaźnik myszy (gumkę) nad krawędzią, którą chcesz usunąć, n. Naciśnij lewy przycisk myszy i przeciągnij wskaźnik wzdłuż tej krawędzi, a następnie zwolnij przycisk myszy - FrontPage usunie krawędź |
Aby scalić komórki:
Wskazówki
|
Tworzenie wierszy o jednakowej wysokości oraz kolumn o jednakowej szerokości Jeżeli tabela zawiera wiersze o różnej wysokości lub kolumny o różnej szerokości, można użyć narzędzi do równomiernego rozkładania wierszy i kolumn. Zwróć uwagę, że w celu utworzenia wierszy o jednakowej wysokości należy zaznaczyć kolumnę, a w celu utworzenia kolumn o jednakowej szerokości - wiersz. Aby wszystkim wierszom nadać taką samą wysokość:
|
Rysunek 10.53. Aby wszystkim wierszom nadać taką samą wysokość, zaznacz kolumnę, która zawiera komórkę z każdego z tych wierszy
Rysunek 10.54. Aby wyrównać tabelę, z menu Tabela wybierz pozycję Rozłóż wiersze równomiernie (rysunek po lewej) lub pozycję Rozłóż kolumny równomiernie (rysunek po prawej)
Rysunek 10.55. Można również kliknąć przycisk Rozłóż wiersze równomiernie lub Rozłóż kolumny równomiernie dostępny na pasku narzędzi Tabele
Rysunek 10.56. Wiersze mają teraz tę samą wysokość |
Rysunek 10.57. Aby wszystkim kolumnom nadać taką samą szerokość, zaznacz wiersz, który zawiera komórkę z każdej z tych kolumn
Rysunek 10.58. Kolumny mają teraz tę samą szerokość |
Aby wszystkim kolumnom nadać taką samą szerokość:
Wskazówka
|
Formatowanie tabel i komórek Po umieszczeniu na stronie internetowej tabeli oraz wstawieniu do niej tekstu i obrazów nadszedł czas na wielki finał: formatowanie całej tabeli oraz jej poszczególnych komórek. Aby sformatować tabelę:
|
Rysunek 10.59. Aby sformatować tabelę, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości tabeli
Rysunek 10.60. W sekcji Układ okna dialogowego Właściwości tabeli zdefiniuj określ wyrównanie, szerokość, wysokość, dopełnienie komórek oraz odstępy między komórkami
Rysunek 10.61. Dzięki opcjom listy rozwijanej Przestawienie okna dialogowego Właściwości tabeli tabela może znajdować się po prawej lub po lewej stronie tekstu |
Rysunek 10.62. Aby utworzyć obramowanie jednokolorowe, wybierz zaznacz kolor z rozwijanej palety kolorów Kolor, . natomiast zZ palet kolorów Krawędź jasna oraz Krawędź ciemna wybierz opcję Automatyczny
Rysunek 10.63. Aby utworzyć obramowanie trójwymiarowe, wybierz kolory z palet kolorów Krawędź jasna oraz Krawędź ciemna
Rysunek 10.64. Kliknij przycisk Autoformatowanie tabeli, aby Aby otworzyć okno dialogowe z predefiniowanymi podstawowymi formatami tabel, kliknij przycisk Autoformatowanie tabeli
Rysunek 10.65. Kliknij strzałkę listy rozwijanej, aby Aby uzyskać dostęp do nazw predefiniowanych podstawowych formatów tabel, kliknij strzałkę listy rozwijanej |
Aby sformatować obramowanie tabeli:
Aby utworzyć obramowanie trójwymiarowe, wybierz kolory z palet kolorów Krawędź jasna oraz Krawędź ciemna (rysunek 10.63, u góry).
Wskazówki
|
Aby sformatować komórki:
Wskazówki
|
Rysunek 10.66. Aby sformatować komórki, zaznacz je i kliknij prawym przyciskiem myszy, a następnie z menu kontekstowego wybierz pozycję Właściwości komórki
Rysunek 10.67. W oknie dialogowym Właściwości komórki zmodyfikuj wyrównanie i rozmiar komórki. Określ również, ile wierszy i kolumn ma obejmować komórka |
Rysunek 10.68. Zaznacz komórki, które chcesz przekształcić na nagłówki
Rysunek 10.69. Po przekształceniu komórek na w nagłówki tekst w zaznaczonych komórkach zostanie pogrubiony
Rysunek 10.70. Aby wyłączyć funkcję zawijania przerzucania tekstu, zaznacz komórki, w których tekst jest zawijany przerzycany do następnej linii
Rysunek 10.71. Jeżeli w sekcji Układ zaznaczysz pole wyboru Bez zawijania, funkcja zawijania przerzucany tekstu zostanie wyłączona w zaznaczonych komórkach |
Przekształcanie komórek na w nagłówki Nagłówek zwykle służy jako etykieta wierszy lub kolumn tabeli. FrontPage pogrubia Ttekst w komórkach nagłówków jest pogrubiony. Aby przekształcić komórki na w nagłówki:
Aby wyłączyć funkcję zawijania przerzucania tekstu w komórce:
|
Aby zmienić kolor komórki:
Wskazówki
|
Rysunek 10.72. Aby zmienić kolor zaznaczonej komórki, kliknij strzałkę przycisku Kolor wypełnienia i wybierz kolor z rozwijanej palety kolorów (rysunek po lewej); ). Aaby szybko zastosować domyślny kolor wypełnienia - w tym przypadku oliwkowy - kliknij przycisk Kolor wypełnienia (rysunek po prawej)
Rysunek 10.73. Aby zmienić kolor komórki, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości komórki, a następnie skorzystaj z sekcji Tło okna dialogowego Właściwości komórki |
Rysunek 10.74. Aby wyrównać zawartość komórki wertykalnie, kliknij przycisk Wyrównaj do góry lub Wyrównaj do dołu dostępny na pasku narzędzi Tabele
Rysunek 10.75. Aby wyśrodkować zawartość komórki w pionie, kliknij przycisk Wyśrodkuj pionowo dostępny na pasku narzędzi Tabele
Rysunek 10.76. Aby wyrównać zawartość komórki w poziomie, kliknij jeden z czterech przycisków służących do wyrównywania zawartości dostępnych na pasku narzędzi Formatowanie |
Aby wyrównać zawartość komórki:
Wskazówka
|
Rozdział 11. Tworzenie i formatowanie ramek
Rysunek 11.1. Każda z czterech miniatur zawiera jedną ramkę wyróżnioną ciemniejszym kolorem (rysunek po lewej);. Rramki tworzą stronę z ramkami (rysunek po prawej) |
Jedną z największych zalet stron z ramkami jest to, że w jednej z ramek nich można umieścić łącza lub przyciski, które są zawsze widoczne, nawet kiedy użytkownik przewija stronę umieszczoną w ramce głównej. Dzięki temu użytkownik ma on stały dostęp do wszystkich hiperłączy i w każdej chwili może przejść do dowolnej strony witryny internetowej. Do oglądania stron z ramkami wystarczy przeglądarka internetowa w wersji 3, co oznacza, że prawie każdy użytkownik Internetu posiada oprogramowanie do oglądania takich stronmoże to robić. Niestety, ramki mają również kilka wad. Tytuł strony nie zmienia się podczas wyświetlania różnych ramek, co czasem może dezorientować użytkownika. Strony z ramkami dłużej wczytują się do przeglądarki niż zwykłe innestrony. Jeżeli chcesz utworzyć przejrzysty system nawigacji, ale bez opisanych wyżej problemów, zamiast umieszczać hiperłącza w osobnej ramce, możesz utworzyć pasek łączy (zobacz podrozdział Paski łączy i obramowanie wspólne w rozdziale 3., Tworzenie witryny internetowej). Z ramkami wiążą się dwa terminy: strona z ramkami oraz ramka docelowa. Strona z ramkami to specjalna strona wyświetlająca kolekcję ramek (rysunek 11.1); ramka docelowa to ramka, w której jest wyświetlana strona, do której prowadzi hiperłącze. |
Tworzenie ramek Każda ramka strony z ramkami wyświetla osobną stronę internetową. Od Ciebie zależy, czy najpierw utworzysz stronę, a dopiero potem ramkę, w której ta strona ma być wyświetlana, czy najpierw utworzysz ramkę, a potem stronę.odwrotnie. Najlepiej jednak zacznij od utworzenia strony, umieść w niej główne elementy, utwórz ramkę, która będzie tę stronę wyświetlać, a następnie uzupełnij zawartość strony. Zawartość ramki można wyświetlić w głównym oknie programu FrontPage. Więcej informacji na ten temat zawiera podrozdział Aby obejrzeć zawartość ramki w nowym oknie. Strona z ramkami może zawierać ich dowolną ilośćliczbę ramek. Zwróć jednak uwagę, że każda ramka to jedna strona, którą trzeba wczytać do przeglądarki. Oznacza to, że z im większej liczby ramek składa się strona z ramkami, tym dłużej trwa wczytywanie jej do przeglądarki. Aby sprawdzić czas wczytywania strony do przeglądarki, użyj wskaźnika postępu pobierania strony (zobacz rysunek 2.1. w rozdziale 2., FrontPage 2002 - pierwsze kroki). Aby stworzyć stronę z ramkami:
|
Rysunek 11.2. Aby stworzyć stronę z ramkami, z menu Plik wybierz pozycję Nowy, a następnie - pozycję Strona lub sieć Web
Rysunek 11.3. W okienku zadań Nowy plik strony lub sieci Web kliknij pozycję Szablony stron
Rysunek 11.4. Wyświetl kartę Strony z ramkami okna dialogowego Szablony stron, aby uzyskać dostęp do kolekcji stron z ramkami
Rysunek 11.5. Każda ramka nowej strony z ramkami jest pusta i zawiera dwie opcje: Strona początkowa, dzięki której można połączyć ramkę z istniejącą stroną, oraz Nowa strona, dzięki której w ramce można utworzyć nową pustą stronę |
Rysunek 11.6. Aby połączyć ramkę z istniejącą stroną, odszukaj ją za pomocą okna dialogowego Wstawianie hiperłącza
Rysunek 11.7. Wybrana strona internetowa pojawi się w ramce
Rysunek 11.8. Jeżeli klikniesz przycisk Nowa strona, w ramce pojawi się nowa pusta strona, którą można wypełnić |
Aby utworzyć nową pustą stronę dla ramki, kliknij przycisk Nowa strona. W ramce pojawi się nowa strona (rysunek 11.8). Teraz do strony niej można dodać zawartość. |
|
Rysunek 11.9. Jeżeli dla którejś z ramek utworzyłeś nową stronę, FrontPage zaznaczy tę ramkę w okienku podglądu w oknie dialogowym Zapisywanie jako
Rysunek 11.10. Podczas zapisywania strony z ramkami cała strona posiada ciemnoniebieskie obramowanie w okienku podglądu okna dialogowego Zapisywanie jako |
Rysunek 11.11. Aby obejrzeć zawartość ramki w nowym oknie, kliknij ją prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Otwórz stronę w nowym oknie |
Aby obejrzeć zawartość ramki w nowym oknie:
Wskazówka
|
Ramki docelowe Chociaż standardowo ramką docelową dla hiperłączy umieszczonych w podrzędnych ramkach strony z ramkami jest jej ramka główna, FrontPage pozwala Można wybrać dowolną ramkę docelową dla hiperłącza. Nie musisz zmieniać domyślnej ramki docelowej, ponieważ FrontPage zwykle prawidłowo ją wybiera ramkę docelową. Ale jeżeli chcesz to zrobić, zobacz podrozdział Aby zmienić domyślną ramkę docelową. Aby ustawić ramkę docelową:
|
Rysunek 11.12. Aby ustawić ramkę docelową dla hiperłącza, kliknij go je prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Hiperłącze
Rysunek 11.13. Kliknij przycisk Ramka docelowa okna dialogowego Wstawianie hiperłącza, aby Aby ustawić lub zmienić ramkę docelową, kliknij przycisk Ramka docelowa okna dialogowego Wstawianie hiperłącza
Rysunek 11.14. W oknie dialogowym Ramka docelowa można zmienić ramkę docelową dla hiperłącza |
Rysunek 11.15. Kliknij górną ramkę w sekcji Bieżąca strona z ramkami, aby wstawić jej nazwę do pola Ustawienie elementów docelowych
Rysunek 11.16. Jeżeli klikniesz hiperłącze Paryż (rysunek u góry), zawartość strony internetowej paryż.htm wybranej w punkcie 2. pojawi się w ramce docelowej (transparent) wybranej w punkcie 4. (rysunek u dołu)
Rysunek 11.17. Informacja o ramce docelowej jest wyświetlana u dołu okna dialogowego Wstawianie hiperłącza |
Wskazówka
|
Aby zmienić domyślną ramkę docelową:
|
Rysunek 11.18. Aby zmienić domyślną ramkę docelową, kliknij stronę prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości strony
Rysunek 11.19. W oknie dialogowym Właściwości strony wyświetl kartę Ogólne, a następnie kliknij przycisk Zmień ramkę docelową |
Rysunek 11.20. Okno dialogowe Ramka docelowa pozwala określić ramkę docelową dla hiperłącza
Rysunek 11.21. Jeżeli wybierzesz opcję Ta sama ramka, strona, do której prowadzi hiperłącze, pojawi się w tej samej ramce, w której znajduje się to hiperłącze
Rysunek 11.22. Jeżeli wybierzesz opcję Cała strona, stronę z ramkami zastąpi strona, do której prowadzi hiperłącze (rysunek po lewej); j. Jeżeli wybierzesz opcję Nowe okno, strona, do której prowadzi hiperłącze, pojawi się w oknie nowej przeglądarki internetowej (rysunek po prawej) |
Okno dialogowe Ramka docelowa Aby otworzyć okno dialogowe Ramka docelowa (rysunek 11.20), prawym przyciskiem myszy kliknij hiperłącze, z menu kontekstowego wybierz pozycję Hiperłącze, a następnie w oknie dialogowym Wstawianie hiperłącza kliknij przycisk Ramka docelowa.
Ustawienia domyślne strony (podstawowa): Strona, do której prowadzi hiperłącze, pojawi się w ramce domyślnej - w tym przypadku w głównej ramce bieżącej strony z ramkami. Ta sama ramka: Strona, do której prowadzi hiperłącze, pojawi się w tej samej ramce, w której znajduje się to hiperłącze (rysunek 11.21). Cała strona: Stronę z ramkami zastąpi strona, do której prowadzi hiperłącze (rysunek 11.22, po lewej). Nowe okno: Strona, do której prowadzi hiperłącze, pojawi się w oknie nowej przeglądarki internetowej (rysunek 11.22, po prawej). Zastosuj tę opcję, aby połączyć użytkownika ze stroną, która nie należy do Twojej witryny internetowej - Twoja witryna pozostanie widoczna w oryginalnej przeglądarce. Ramka nadrzędna: Opcja ta służy do tworzenia grup dyskusyjnych.
|
Strona z ramkami w roli strony startowej Strona startowa standardowo nosi nazwę index.htm. Jeżeli witryna internetowa posiada ją już stronę startową bez ramek, możesz ją zastąpić stroną startową z ramkami - wystarczy zmienić nazwę oryginalnej strony startowej na inną, a nazwę strony z ramkami na index.htm. Zwróć uwagę, że na niektórych serwerach strona startowa musi nosić nazwę default.htm. Aby stronę z ramkami ustawić jako stronę startową:
|
Rysunek 11.23. Aby stronę z ramkami ustawić jako stronę startową, w panelu Lista folderów odszukaj oryginalną stronę startową (rysunek po lewej) i zmień jej nazwę (rysunek po prawej)
Rysunek 11.24. Zmień nazwę strony z ramkami (rysunek po lewej) na index.htm (rysunek po prawej) |
Rysunek 11.25. Aby zaznaczyć ramkę, kliknij wewnątrz niej (rysunek u góry); a. Aby zaznaczyć stronę z ramkami, kliknij jej krawędź w prawym dolnym rogu (rysunek u dołu)
Rysunek 11.26. Aby usunąć ramkę, kliknij ją i z menu Ramki wybierz pozycję Usuń ramkę |
Formatowanie ramek Po utworzeniu ramek i ustawieniu ramek docelowych dla hiperłączy ramki można je sformatować lub zmodyfikować. FrontPage pozwala Można też zmienić rozmiar ramki, podzielić ramkę ją oraz zmodyfikować jej właściwości. Można również przygotować stronę do wyświetlania w przeglądarkach internetowych, które nie obsługują ramek. Aby zaznaczyć ramkę:
Aby zaznaczyć stronę z ramkami:
Aby usunąć ramkę:
|
Aby zmienić rozmiar ramki:
Wskazówka
|
Rysunek 11.27. Aby zmienić rozmiar ramki, umieść wskaźnik myszy nad jedną z jej ciemnoniebieskich krawędzi - wskaźnik przyjmie on postać dwukierunkowej strzałki (rysunek po lewej) - a następnie naciśnij lewy przycisk myszy i przeciągnij wskaźnik, aby zmniejszyć lub zwiększyć rozmiar ramki (rysunek po prawej) |
Rysunek 11.28. Ramka przed podzieleniem (rysunek po lewej) oraz po podzieleniu (rysunek po prawej)
Rysunek 11.29. Aby podzielić ramkę, z menu Ramki wybierz pozycję Podziel ramkę
Rysunek 11.30. W oknie dialogowym Podziel ramkę określ, czy FrontPage ma być ona podzielić ramkę podzielona na kolumny, czy na wiersze |
Dzielenie ramek Funkcja dzielenia ramek pozwala dodać nową ramkę do istniejącej strony z ramkami. Aby podzielić ramkę:
Wskazówki
|
Aby zmodyfikować właściwości ramki:
Aby zmodyfikować odstępy między ramkami i ukryć obramowanie ramek:
|
Rysunek 11.31. Aby zmodyfikować ramkę lub stronę z ramkami, prawym przyciskiem myszy kliknij ramkę lub stronę z ramkami i z menu kontekstowego wybierz pozycję Właściwości ramki
Rysunek 11.32. W oknie dialogowym Właściwości ramki zdefiniuj określ nazwę, rozmiar i marginesy ramki lub aby zmodyfikować stronę z ramkami, kliknij przycisk Strona z ramkami, aby zmodyfikować stronę z ramkami
Rysunek 11.33. Użyj karty Ramki okna dialogowego Właściwości strony do ustawienia odstępów między ramkami oraz do wyświetlania obramowania ramek lub jego ukrycia obramowania ramek |
|
Okno dialogowe Właściwości ramki Aby otworzyć okno dialogowe Właściwości ramki (rysunek 11.32), prawym przyciskiem myszy kliknij dowolną ramkę i z menu kontekstowego wybierz pozycję Właściwości ramki.
|
Strony z ramkami a starsze przeglądarki Aby oglądać strony z ramkami, użytkownik musi posiadać przeglądarkę internetową w wersji 3 lub nowszą. Mimo że większość użytkowników korzysta z takich przeglądarek, FrontPage pozwala utworzyć specjalną stronę dla użytkownikówtych, którzy nie mogą oglądać stron z ramkami. Strona ta może zawierać stosowny komunikat oraz hiperłącze do alternatywnej strony bez ramek. Aby utworzyć komunikat dla przeglądarek, które nie obsługujących ramek:
|
Rysunek 11.34. Aby utworzyć komunikat dla przeglądarek, które nie obsługujących ramek, kliknij kartę Bez ramek u dołu głównego okna programu FrontPage
Rysunek 11.35. Aby zmodyfikować standardowy komunikat wyświetlany w przeglądarkach, które nie obsługujących ramek (rysunek u góry), wpisz bardziej przyjazny tekst i utwórz hiperłącze do alternatywnej strony bez ramek (rysunek u dołu) |
Rozdział 12. Tworzenie i przetwarzanie formularzy
|
Formularz służy do zbierania i przetwarzania informacji podawanych przez użytkowników. Tworzenie formularza zZawierającego elementy takie jak, pytania, interaktywne przyciski opcji, pola wyboru i pola rozwijane, — jego tworzenie składa się z kilku etapów. Najpierw należy utworzyć pusty formularz i umieścić w nim pola służące do zbierania danych podawanych przez użytkowników. Dodając i edytując pola, można określić rodzaj dopuszczalnych danych dla poszczególnych pól formularza. Proces ten jest nazywany walidacją (sprawdzaniem poprawności) danych. Następnie można stworzyć stronę potwierdzenia, dzięki której użytkownik może sprawdzić poprawność wprowadzonych danych. Na koniecWreszcie należy wskazać miejsce zapisywania wyników wypełnionego formularza: plik, wiadomość e-mail, bazę danych lub inną lokalizację, do której dane przesyła się za pomocą skryptu niestandardowego. |
Tworzenie formularzy Aby szybko zbudować formularz, należy utworzyć go z szablonu i zmodyfikować jego pola. Wśród szablonów dostarczanych z programem FrontPage są Formularz opinii oraz Formularz potwierdzenia, a także Kreator strony formularza, który pomaga utworzyć formularz niestandardowy. Formularz można również zbudować od zerapoczątku. Aby utworzyć formularz z szablonu:
|
Rysunek 12.1. Aby utworzyć nowy formularz, z menu Plik wybierz pozycję Nowy, a następnie - pozycję Strona lub sieć Web
Rysunek 12.2. W okienku zadań Nowy plik strony lub sieci Web kliknij pozycję Szablony stron
Rysunek 12.3. W oknie dialogowym Szablony stron wybierz ikonę szablonu Formularz opinii, a następnie kliknij przycisk OK
Rysunek 12.4. W oknie dialogowym Zapisywanie jako podaj unikatową nazwę i tytuł dla strony z formularzem
Rysunek 12.5. Szablony programu FrontPage 2002 przyspieszają proces tworzenia stron z formularzami |
Rysunek 12.6. Aby utworzyć formularz od zerapoczątku, z menu Wstaw wybierz pozycję Formularz, a następnie - pozycję Formularz
Rysunek 12.7. Obszar formularza wyznacza przerywana linia. Formularz posiada przyciski Prześlij i Resetuj
Rysunek 12.8. Naciśnij kilka razy klawisz Enter, aby Aby powiększyć obszar formularza, naciśnij kilka razy klawisz Enter
Rysunek 12.9. Aby usunąć pole, kliknij je prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Wytnij |
Aby utworzyć formularz od zerapoczątku:
Aby usunąć pole:
lub
Aby zmodyfikować właściwości pola:
|
Dodawanie pól formularza Bez względu na to, czy utworzyłeś pusty formularz, czy formularz z szablonu, możesz dodać do niego dowolny zestaw pól. Aby dodać pole tekstowe:
|
Rysunek 12.10. Wpisz tekst opisujący pole tekstowe i umieść kursor w miejscu, w którym które chcesz wstawić to pole
Rysunek 12.11. Aby dodać jednowierszowe pole tekstowe, z menu Wstaw wybierz pozycję Formularz, a następnie - pozycję Pole tekstowe
Rysunek 12.12. Aby zmodyfikować pole tekstowe, kliknij go je prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości pola formularza
Rysunek 12.13. W oknie dialogowym Właściwości pola tekstowego zdefiniuj nadaj nazwę, wartość początkową, szerokość w znakach oraz kolejność dostępu do pola tekstowego. Określ również, czy pole tekstowe ma służyć do wpisywania hasła |
Rysunek 12.14. Aby utworzyć osobny pasek narzędzi Formularz, z menu Wstaw wybierz pozycję Formularz, umieść wskaźnik myszy nad górną krawędzią podmenu, naciśnij lewy przycisk myszy i przeciągnij wskaźnikgo |
Wskazówki
|
Pole obszaru tekstowego Pole tekstowe zawiera jeden wiersz tekstu; pole obszaru tekstowego może zawierać dowolną liczbę wierszy. W razie potrzeby FrontPage automatycznie dodaje pasek przewijania do pola obszaru tekstowego. Aby dodać pole obszaru tekstowego:
|
Rysunek 12.15. Aby dodać pole obszaru tekstowego, kliknij przycisk Obszar tekstu dostępny na pasku narzędzi Formularz
Rysunek 12.16. Aby zmienić rozmiar pola obszaru tekstowego, przeciągnij jeden z jego czarnych kwadratowych uchwytów |
Rysunek 12.17. W oknie dialogowym Właściwości pola obszaru tekstowego zdefiniuj nadaj nazwę, wartość początkową i rozmiar pola obszaru tekstowego |
|
Okno dialogowe Sprawdzanie poprawności pola tekstowego Okno dialogowe Sprawdzanie poprawności pola tekstowego służy do definiowania określania typu danych dopuszczalnych w polach tekstowych (rysunek 12.18). Aby je otworzyć okno dialogowe Sprawdzanie poprawności pola tekstowego, kliknij przycisk Sprawdź poprawność okna dialogowego Właściwości pola tekstowego lub Właściwości pola obszaru tekstowego (rysunek 12.19).
|
Rysunek 12.18. Okno dialogowe Sprawdzanie poprawności pola tekstowego służy do definiowania określania typu danych dopuszczalnych możliwych do użycia w jednowierszowych polach tekstowych oraz w polach obszaru tekstowego
Rysunek 12.19. Aby otworzyć okno dialogowe Sprawdzanie poprawności pola tekstowego, kliknij przycisk Sprawdź poprawność okna dialogowego Właściwości pola tekstowego lub Właściwości pola obszaru tekstowego |
Rysunek 12.20. Aby dodać pole wyboru, kliknij przycisk Pole wyboru dostępny na pasku narzędzi Formularz
Rysunek 12.21. Po pojawieniu się pola wyboru na stronie internetowej dodaj wyjaśniający tekst
Rysunek 12.22. Kliknij pole wyboru prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości pola formularza |
Pola wyboru i przyciski opcji Pola wyboru i przyciski opcji - w przeciwieństwie do pól tekstowych i pól obszaru tekstowego, do których użytkownik może wpisać różne rodzaje informacji - posiadają tylko dwa stanywystpują tylko w dwóch stanach: włączony/-zaznaczony lub wyłączony/-niezaznaczony. Różnica między polami wyboru a przyciskami opcji polega na tym, że można zaznaczyć więcej niż jedno pole wyboru w grupie tych pól wyboru, natomiast z grupy przycisków opcji można wybrać tylko jedenną opcję. Aby dodać pole wyboru:
|
|
Rysunek 12.23. W oknie dialogowym Właściwości pola wyboru podaj nazwę pola wyboru i określ jego stan początkowy |
Rysunek 12.24. Umieść kursor w miejscu, w którym które chcesz dodać jeden lub więcej przycisków opcji. Nie zapomnij o dodaniu tekstu, w którym prosisz proszącego użytkownika o wybranie jednej z opcji
Rysunek 12.25. Aby dodać przycisk opcji, kliknij przycisk Przycisk opcji dostępny na pasku narzędzi Formularz
Rysunek 12.26. Po pojawieniu się przycisku opcji w formularzu wpisz tekst identyfikujący ten przycisk
Rysunek 12.27. Po pojawieniu się okna dialogowego Właściwości przycisku opcji w polach Nazwa grupy i Wartość znajdują się standardowe wartości, a w grupie opcji Stan początkowy jest wybrana opcja Zaznaczony
Rysunek 12.28. Wpisz opisowe nazwy w polach Nazwa grupy i Wartość, a następnie ustaw stan początkowy oraz kolejność dostępu do przycisku opcji |
Aby utworzyć grupę przycisków opcji:
|
Wskazówka
|
Rysunek 12.29. W polu Nazwa wyświetlana okna dialogowego Sprawdzanie poprawności przycisku opcji wpisz tekst przypominający o konieczności wybrania jednej z opcji
Rysunek 12.30. Grupa opcji złożona z trzech przycisków opcji |
Rysunek 12.31. Aby dodać pole rozwijane, kliknij przycisk Pole rozwijane dostępny na pasku narzędzi Formularz
Rysunek 12.32. Kliknij przycisk Dodaj okna dialogowego Właściwości pola rozwijanego, aby Aby stworzyć element pola rozwijanego, kliknij przycisk Dodaj okna dialogowego Właściwości pola rozwijanego
Rysunek 12.33. W oknie dialogowym Dodawanie wyboru utwórz element pola rozwijanego, określ jego wartość oraz stan początkowy |
Aby dodać pole rozwijane:
|
|
Rysunek 12.34. Można zmienić porządek elementów pola rozwijanego i zezwolić na zaznaczanie wielu elementów |
Rysunek 12.35. Okno dialogowe Modyfikuj wybór pozwala zmodyfikować nazwę, wartość i stan początkowy elementu pola rozwijanego |
Okno dialogowe Właściwości pola rozwijanego Aby wyświetlić okno dialogowe Właściwości pola rozwijanego (rysunek 12.34), kliknij pole rozwijane prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości pola formularza (Alt+Enter) (rysunek 12.12).
|
|
Rysunek 12.36. Okno dialogowe Sprawdzanie poprawności pola rozwijanego pozwala zdefiniować określić rodzaj dopuszczalnych możliwych do użycia danych dla pola rozwijanego |
Rysunek 12.37. Umieść kursor w miejscu, w któreym chcesz dodać przycisk polecenia
Rysunek 12.38. Aby dodać przycisk polecenia, kliknij przycisk Przycisk polecenia dostępny na pasku narzędzi Formularz
Rysunek 12.39. W oknie dialogowym Właściwości przycisku polecenia zdefiniuj nazwę, etykietę i typ przycisku
Rysunek 12.40. Aby zobaczyć przycisk polecenia w działaniu, kliknij kartę Podgląd |
Przyciski poleceń Po utworzeniu formularza z polami tekstowymi, polami wyboru, przyciskami opcji i polami rozwijanymi należy jeszcze stworzyć mechanizm, dzięki któremu użytkownik będzie mógł przesłać informacje. Taki mechanizm mMożna go stworzyć za pomocą przycisków poleceń. Chociaż przycisk polecenia można je podłączyć do skryptu, w większości przypadków przyciski poleceń służą do przesyłania informacji lub resetowania formularza. Aby dodać przycisk polecenia:
|
Tworzenie strony potwierdzenia Strona potwierdzenia służy do wyświetlania niektórych lub wszystkich informacji wpisanych przez użytkownika do pól formularza, dzięki czemu użytkownik może potwierdzić ich poprawność. FrontPage pozwala utworzyć taką stronę lub niestandardową stronę potwierdzenia oraz stronę potwierdzenia z szablonu. W obu przypadkach strona potwierdzenia używa nazw pól formularza do wyświetlania wartości podanych w tych polach. Jeżeli użyjesz błędnej nazwy pola formularza, strona potwierdzenia nie będzie działać. Aby stworzyć stronę potwierdzenia:
|
Rysunek 12.41. W oknie dialogowym Szablony stron wyświetl kartę Ogólne, wybierz szablon Formularz potwierdzenia i kliknij przycisk OK
Rysunek 12.42. Pola potwierdzenia znajdują się w nawiasach. Wskaźnik myszy umieszczony nad polem potwierdzenia zmienia się w dłoń trzymającą kartkę
Rysunek 12.43. Aby zmodyfikować nazwę pola używaną w istniejącym polu potwierdzenia, kliknij je prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości pola potwierdzenia |
Rysunek 12.44. W oknie dialogowym Właściwości pola potwierdzenia wpisz nazwę pola formularza, które ma być do potwierdzoneenia
Rysunek 12.45. Nazwy pól używane na stronie potwierdzenia muszą odpowiadać nazwom pól użytym w formularzu
Rysunek 12.46. W oknie dialogowym Wstawianie składnika sieci Web z listy Typ składnika wybierz pozycję Formanty zaawansowane, z listy Wybierz formant - pozycję Pole potwierdzenia, a następnie kliknij przycisk Zakończ
Rysunek 12.47. Nadaj polu potwierdzenia łatwą do zapamiętania nazwę i kliknij przycisk OK
Rysunek 12.48. Nowe pola potwierdzenia, podobnie jak istniejące, znajdują się w nawiasach |
Wskazówka
|
Zapisywanie wyników wypełnionego formularza Wyniki Wypełniony formularza można zapisać w pliku, wiadomości e-mail, bazie danych lub w innej lokalizacjiinnym miejscu za pomocą skryptu niestandardowego. Do wskazania miejsca przechowywania wyników wypełnionego formularza służy okno dialogowe Właściwości formularza. W przypadku zapisywania wyników wypełnionego formularza w pliku, możesz wybrać jeden z ośmiu formatów pliku. Zwróć uwagę, że wyniki można zapisać w pliku i w wiadomości e-mail jednocześnie - jeden sposób zapisywania wyników nie wyklucza drugiego. FrontPage używa standardowego komponentu sposobu do zapisywania wyników formularza. Ponadto można wybrać opcję Obsługa formularza dyskusji, Obsługa formularza rejestracji oraz Niestandardowy skrypt ISAPI, NSAPI, CGI lub ASP. Aby zapisać wyniki wypełniony formularza w pliku:
|
Rysunek 12.49. Aby wskazać miejsce przechowywania wyników wypełnionego formularza, kliknij go prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości formularza
Rysunek 12.50. W oknie dialogowym Właściwości formularza wybierz miejsce przechowywania wyników: plik, wiadomość e-mail, baza danych lub inna lokalizacjainne miejsce |
Rysunek 12.51. Karta Plik z wynikami pozwala określić nazwę i format pliku z wynikami oraz inne szczegóły związane z zapisywaniem danych
Rysunek 12.52. Lista rozwijana Format pliku umożliwia wybór jednego z ośmiu formatów dla pliku z wynikami
Rysunek 12.53. Aby przetestować formularz, kliknij przycisk Podgląd w przeglądarce dostępny na pasku narzędzi Standardowy |
|
Okno dialogowe Właściwości formularza Aby wyświetlić okno dialogowe Właściwości formularza (rysunek 12.54), z menu Wstaw wybierz pozycję Formularz, a następnie - pozycję Właściwości formularza lub kliknij przycisk Właściwości formularza dostępny na pasku narzędzi Formularz (rysunek 12.55) lub kliknij formularz prawym przyciskiem myszy i z menu kontekstowego wybierz pozycję Właściwości formularza.
|
Rysunek 12.54. W oknie dialogowym Właściwości formularza wybierz miejsce przechowywania wynikówwypełnionego formularza: plik, wiadomość e-mail, baza danych lub inna lokalizacjainne miejsce
Rysunek 12.55. Aby wyświetlić okno dialogowe Właściwości formularza, kliknij przycisk Właściwości formularza dostępny na pasku narzędzi Formularz |
Rysunek 12.56. Karta E-mail z wynikami pozwala określić adres, format, wiersz tematu oraz wiersz odpowiedzi wiadomości e-mail |
Aby zapisać wyniki wypełniony formularza w wiadomości e-mail:
|
|
|
Rysunek 12.57. Karta Wyniki bazy danych pozwala zapisać wyniki formularza w istniejącej lub nowej bazie danych |
Aby zapisać wyniki wypełniony formularza w bazie danych:
|
Aby zapisać wyniki wypełniony formularza za pomocą skryptu niestandardowego:
|
Rysunek 12.58. Prawym przyciskiem myszy kliknij folder, w którym znajdują się skrypty, i z menu kontekstowego wybierz pozycję Właściwości
Rysunek 12.59. W oknie dialogowym Właściwości zaznacz pole wyboru Zezwalaj na uruchamianie skryptów lub programów
Rysunek 12.60. W oknie dialogowym Opcje obsługi formularzy niestandardowych podaj adres URL skryptu niestandardowego i wybierz metodę przesłania informacji do skryptu |
|
Wskazówki
|
Dodatek A. Instalowanie i konfigurowanie programu FrontPage 2002
Zanim zaczniesz budować witryny internetowe, poświęć trochę czasu na skonfigurowanie programu FrontPage 2002, aby strony, które będziesz tworzyć, były zgodne z różnymi przeglądarkami internetowymi. Możesz zainstalować FrontPage 2002 w systemie Windows 98 lub nowszym pod warunkiem, że nie planujesz korzystania z serwera lokalnego. Serwer lokalny jJest on bowiem niezbędny do przetestowania składników, (takich jak licznik trafień), przed opublikowaniem witryny na serwerze internetowym. Jeżeli oprócz programu FrontPage 2002 chcesz zainstalować serwer lokalny, potrzebujesz systemu Windows NT 4.0 (plus Service Pack 6) lub nowszego. W Książka książce „Po prostu FrontPage 2002” nie omawiamy instalowania takiego serwera lokalnego. |
Czego potrzebujesz, aby zainstalować FrontPage 2002
|
Instalowanie programu FrontPage Jeżeli na dysku twardym nie ma wystarczająco dużo wolnego miejsca, aby zainstalować wersję standardową programu FrontPage, zobacz podrozdział Aby zainstalować wersję niestandardową programu FrontPage. Aby zainstalować wersję standardową programu FrontPage:
|
Rysunek A.1. Wpisz 25-znakowy klucz produktu, który znajduje się na żółtej nalepce z tyłu opakowania płyty CD
Rysunek A.2. Zaznacz pole wyboru Akceptuję warunki Umowy Licencyjnej i kliknij przycisk Dalej
Rysunek A.3. W zależności od tego, czy uaktualniasz program FrontPage, czy instalujesz go po raz pierwszy, aby zainstalować wersję standardową programu FrontPage wybierz opcję Uaktualnij teraz lub Zainstaluj teraz, aby zainstalować wersję standardową programu FrontPage |
Rysunek A.4. Upewnij się, że ekran instalatora wyświetla wszystkie potrzebne składniki i kliknij przycisk Zainstaluj
Rysunek A.5. Podczas instalowania programu FrontPage 2002 instalator wyświetla się informacjaę o postępie instalacjipracy |
Wskazówka
|
Aby zainstalować wersję niestandardową programu FrontPage:
|
Rysunek A.6. Aby zainstalować wersję niestandardową programu FrontPage, wybierz opcję Niestandardowa, a następnie kliknij przycisk Przeglądaj, aby odszukać folder, w którym chcesz zainstalować umieścić program FrontPage
Rysunek A.7. Ekran Funkcje do zainstalowania umożliwia wybór składników programu FrontPage 2002, które instalator mają być zainstalowaneć
Rysunek A.8. Użyj menu dowolnego elementu do wybrania opcji instalacji dla tego elementu |
Tabela A.1.
Opcje instalacji niestandardowej
Ikona |
Tekst |
Opis |
|
Uruchamiaj z Mojego komputera |
Instaluje element i standardowe pod-elementy. |
|
Uruchamiaj wszystko z Mojego komputera |
Instaluje element i wszystkie pod-elementy. |
|
Uruchamiaj z dysku CD |
Uruchamia element, jeżeli dysk CD jest w napędzie. |
|
Uruchamiaj wszystko z dysku CD |
Uruchamia element i wszystkie pod-elementy, jeżeli dysk CD jest w napędzie. |
|
Niedostępne |
Element nie zostanie zainstalowany. |
|
Instalowane przy pierwszym użyciu |
Przy pierwszym użyciu tego elementu instalator poprosi o dysk CD i zainstaluje go. |
Rysunek A.9. Wartości Miejsce wymagane i Miejsce dostępne u dołu ekranu Funkcje do zainstalowania informują, czy na dysku twardym jest wystarczająco dużo wolnego miejsca do zainstalowania wybranych składników
Rysunek A.10. Rozwiń element, aby zobaczyć, czy wszystkie jego pod-elementy zostaną zainstalowane |
Wskazówki
|
Aby uaktualnić, naprawić lub odinstalować usunąć instalację programu FrontPage:
|
Rysunek A.11. Aby uaktualnić, naprawić lub odinstalować usunąć instalację programu FrontPage, uruchom płytę CD z programem i wybierz opcję
Rysunek A.12. Wybierz elementy, które instalator mają być dodać dodane lub usunąćusunięte, a następnie kliknij przycisk Aktualizuj |
Rysunek A.13. Kiedy Kreator aktywacji zostaniesz zapytany, czy chcesz aktywować program, kliknij przycisk Dalej
Rysunek A.14. Jeżeli chcesz, aby Twoich danych nie używano do celów marketingowych, musisz podjąć dodatkowe kroki
Rysunek A.15. Oprócz nazwy kraju lub regionu nie musisz podawać żadnych innych danych
Rysunek A.16. Winieta aktywowanego programu FrontPage 2002 wyświetli nazwę i numer użytkownika |
Aby aktywować program FrontPage:
|
Zgodność z przeglądarkami internetowymi Gdyby wszystkie przeglądarki internetowe interpretowały kod HTML w taki sam sposób, tworzenie stron internetowych byłoby dużo prostsze. Nie trzeba byłoby wtedy zastanawiać się, czy dany znacznik HTML działa zarówno w przeglądarce Internet Explorer, jak i w przeglądarce Netscape Navigator lub, czy dany znacznik HTML obsługują stare, czy tylko nowe, przeglądarki. Zanim nadejdzie dzień, w którym wszystkie przeglądarki będą obsługiwać wspólny standard miały takie same możliwości, FrontPage 2002 oferuje zupełnie przyzwoite dobre rozwiązanie. Wystarczy określić, dla których przeglądarek tworzy się strony, a FrontPage 2002 wygeneruje poprawny kod HTML. Nie jest to rozwiązanie idealne - nadal trzeba decydować, czy tworzy się strony dla większej grupy przeglądarek internetowych (i zapomnieć o arkuszach stylów kaskadowych oraz o dynamicznym HTML-u), czy też używa się nowych znaczników, ryzykując, że niektórzy użytkownicy nie będą mogli prawidłowo wyświetlić stron w swoich przeglądarkach - ale przynajmniejwtedy nie trzeba się martwić, jakie znaczniki HTML działają w poszczególnych przeglądarkach. |
|
Rysunek A.17. Aby ustawić zgodność z przeglądarkami internetowymi i określić, jak w jaki sposób FrontPage obsługuje kod HTML, z menu Narzędzia wybierz pozycję Opcje strony
Rysunek A.18. Użyj karty Zgodność okna dialogowego Opcje strony do wskazania przeglądarek, dla których będziesz tworzyć strony internetowe - FrontPage automatycznie wygeneruje poprawny kod HTML |
Aby ustawić zgodność z przeglądarkami internetowymi:
|
Format kodu HTML Ten podrozdział jest przeznaczony dla użytkowników, którzy zamierzają bezpośrednio pracować z kodem HTML bezpośrednio. Jeżeli planujesz od czasu do czasu modyfikować kod źródłowy strony internetowej, ustawienia Ustawienia dostępne na karcie Źródło HTML okna dialogowego Opcje strony pozwalają określić sposób formatowania kodu oraz wygląd znaczników HTML, więc czasami możesz. modyfikować kod źródłowy strony internetowej. Aby ustawić format kodu HTML:
|
Rysunek A.19. Użyj karty Źródło HTML do określenia wyglądu kodu HTML w widoku HTML |
Rysunek A.20. Użyj karty Kodowanie kolorami do określenia kolorów używanych w kodzie HTML i w skryptach |
Wskazówka
|
Spis treści 2
3 Front Page - Praktyczne projekty
Rozdział 1 ♦ Front Page 2002 - wprowadzenie 10
Rozdział 2 ♦ Front Page 2002 - pierwsze kroki 54
Rozdział 3 ♦ Tworzenie witryny internetowej 94
Rozdział 4 ♦ Wpisywanie i formatowanie tekstu 120
Rozdział 5 ♦ Formatowanie akapitów, list i nagłówków 132
Rozdział 6 ♦ Dodawanie hiperłączy 158
Rozdział 7 ♦ Wstawianie i edytowanie obrazów 192
Rozdział 8 ♦ Tworzenie i edytowanie rysunków 224
Rozdział 9 ♦ Multimedia i składniki sieci Web 242
Rozdział 10 ♦ Tworzenie i formatowanie tabel 266
Rozdział 11 ♦ Tworzenie i formatowanie ramek 280
Rozdział 12 ♦ Tworzenie i przetwarzanie formularzy 304
Dodatek A ♦ Instalowanie i konfigurowanie programu Front Page 2002 314