10 prostych, ale przydatnych porad i wskazówek Dreamweaver dla początkujących

Adobe Dreamweaver to potężne narzędzie dla projektantów stron internetowych. Dreamweaver udostępnia wizualną powierzchnię projektową i edytor kodu do tworzenia witryn internetowych. Chociaż ma zarówno zalety, jak i wady, jego szeroki zakres funkcji pozwala skutecznie tworzyć strony internetowe.

Oto 10 prostych, ale przydatnych wskazówek i porad programu Dreamweaver dla początkujących.

1. Usuń podziały wierszy:

Podczas kopiowania tekstu z dokumentu, wiadomości e-mail lub pliku Word do programu Dreamweaver na końcu akapitów lub wierszy pojawiają się podziały wierszy. Znak łamania linku <br> sygnalizuje koniec linii, więc każdy tekst po nim będzie wyświetlany w linii poniżej. Te postacie są niewidoczne i dlatego trudno je usunąć. Chociaż program Dreamweaver zazwyczaj nie wyróżnia tych znaków, możesz zmienić ustawienia w menu preferencji, aby program wyświetlał małą żółtą ikonę wskazującą łamanie wierszy. Gdy łamania linii są widoczne, możesz je łatwo usunąć.

2. Pamiętaj, aby zdefiniować witrynę:

Ludzie często mylą pracę w programie Dreamweaver z pracą z dokumentem tekstowym. Jednak projektowanie witryny nie polega na budowaniu jednego pliku, ale na budowaniu witryny z kolekcją powiązanych ze sobą plików, takich jak obrazy, pliki JavaScript, strony internetowe i pliki CSS. Użytkownicy, którzy tego nie rozumieją, często zapominają, jak ważna jest konfiguracja witryny. Dreamweaver zapewnia łatwy do skonfigurowania proces witryny. Dostarcza informacji o lokalizacji plików serwisu i pozwala wybrać jedno z wielu narzędzi do zarządzania Dreamweaver. Narzędzia te przesyłają plik na serwer WWW, sprawdzają uszkodzone łącza i budują witrynę z szablonami.

3. Zwiększ rozmiar czcionki kodu:

Dzięki funkcji dostosowywania rozmiaru czcionki programu Dreamweaver możesz zwiększyć rozmiar kodu w kilku prostych krokach. Aby zwiększyć rozmiary czcionek, najpierw wybierz Dreamweaver > Preferencje, a następnie kliknij kategorię Czcionki, a następnie wybierz nowy rozmiar i kliknij OK. Pomoże Ci to uczynić kod czytelnym i będziesz mógł pracować nad rozwojem swojej witryny przez długi czas bez zmęczenia oczu.

4. Wyłącz tło CSS Skrót:

Jedną z cech CSS jest właściwość tła. Ta funkcja umożliwia dodawanie kolorów lub obrazów do tła. Skrócona właściwość tła w programie Dreamweaver skraca 3-wierszowy kod do tylko jednego wiersza, definiując właściwość obrazu, koloru i powtarzania. Może to z pewnością ułatwić definiowanie właściwości tła, ale jeśli zostawisz jedną właściwość w wersji skróconej, przeglądarka internetowa potraktuje ją jako „brak”. Na przykład podczas zmiany tła, jeśli określisz tylko właściwość obrazu, przeglądarka internetowa usunie istniejący kolor z poprzedniego tła. Dlatego lepiej jest wyłączyć skrót CSS tła, aby uniknąć tego problemu.

5. Skopiuj style za pomocą projektanta CSS:

Za pomocą projektanta CSS możesz wizualnie ulepszyć style na swojej stronie internetowej. Jeśli chcesz korzystać z większej liczby funkcji projektanta CSS, kliknij prawym przyciskiem myszy dowolny selektor, aby użyć operacji kopiowania lub powielania. Te opcje umożliwiają kopiowanie stylów z jednego selektora do drugiego. Te style obejmują tło, tekst, animację lub obramowanie. Jeśli chcesz skopiować cały selektor, użyj standardowego polecenia duplikuj lub duplikuj do zapytania o media, aby uzyskać ukierunkowane podejście. Te skróty pozwolą Ci zaoszczędzić sporo czasu, a także utrzymają spójną stylizację.

6. Wyeliminuj pasek nawigacyjny:

Adobe Dreamweaver CS5 jest dostarczany z paskiem narzędzi do nawigacji w przeglądarce. Ten pasek narzędzi jest przeznaczony do użytku z opcją podglądu na żywo programu Dreamweaver. Obie te opcje znajdziesz w oknie dokumentu. Podgląd na żywo służy do wyświetlania podglądu Twojej strony internetowej. Dzięki podglądowi na żywo możesz kliknąć łącze i przejść do określonej strony. Pasek nawigacyjny wyświetla lokalizację nowej strony i umożliwia łatwe nawigowanie między stronami. Możesz ukryć ten pasek narzędzi, gdy nie jest używany, odznaczając opcję nawigacji przeglądarki w sekcji Widok > Paski narzędzi.

7. Zarządzaj swoimi plikami:

Wszystkie pliki znajdują się w panelu Pliki podczas konfigurowania serwisu w programie Dreamweaver. Możesz użyć tego panelu plików do wielu funkcji, takich jak zmiana nazwy, przenoszenie i podświetlanie nazwy pliku. Jest to prawdopodobnie powszechne i możesz to wszystko wiedzieć, ale strony internetowe różnią się od zwykłych plików. Strony internetowe zawierają obrazy, łącza do innych stron internetowych i style CSS z zewnętrznego pliku arkusza stylów. Zmiana nazwy obrazu, strony internetowej lub pliku CSS normalnie za pomocą Eksploratora Windows może spowodować uszkodzenie łączy. Podczas gdy Dreamweaver umożliwia automatyczne aktualizowanie łączy, jeśli przeniesiesz plik lub zmienisz jego nazwę za pomocą panelu plików. W ten sposób nie ma uszkodzonych linków.

8. Wybierz selektor tagów:

Podczas stosowania stylu klasy CSS precyzyjne dodawanie lub usuwanie tagu może być trudne. Do zaznaczania precyzyjnych linii najlepszy jest selektor znaczników programu Dreamweaver. Selektor znaczników jest umieszczony w lewym dolnym rogu okna dokumentu. Ten selektor pokazuje wszystkie HTML i inne znaczniki obecne wokół tekstu. Możesz wybrać określone tagi, klikając tag dostępny na pasku wyboru tagów. Podświetlony znacznik oznacza, że ​​znacznik jest wybrany.

9. Użyj fragmentów:

Dreamweaver udostępnia fragmenty kodu, które są podstawowymi fragmentami kodu, które pozwalają zaoszczędzić dużo czasu. Fragmenty są synchronizowane za pośrednictwem usługi Creative Cloud, dzięki czemu są dostępne w każdym systemie. Możesz przypisać najczęściej używane jako skrót klawiaturowy. Jeśli chcesz edytować skróty, otwórz projekt skrótów klawiaturowych i zduplikuj standardowy zestaw. Następnie wybierz kategorię fragmentów poniżej sekcji poleceń, aby wybrać ulubione. Następnie znajdziesz listę wszystkich dostępnych fragmentów, w tym te, które utworzyłeś. Najtrudniejszą częścią jest ustalenie, które kombinacje klawiszy są nieużywane. Ale można to rozwiązać za pomocą modyfikatora.

10. Połącz WordPress i Dreamweaver:

Dreamweaver i WordPress tworzą świetny zespół. Możesz projektować i modyfikować strony WordPress za pomocą zestawu narzędzi do obsługi plików dynamicznych programu Dreamweaver. Ten zestaw narzędzi zawiera niestandardowe filtry, dynamicznie powiązane pliki i podpowiedzi do kodu specyficzne dla witryny. Trudne jest wymyślenie sposobu pracy z innymi stronami serwisu za pomocą programu Dreamweaver. Najpierw należy zacząć od pliku index.php znajdującego się w katalogu głównym witryny WordPress i stamtąd przejść. Możesz dodać ścieżkę bezpośrednio do adresu internetowego lub użyć funkcji programu Dreamweaver, aby kliknąć łącze. Po wyświetleniu strony masz kontrolę nad CSS i innymi narzędziami programu Dreamweaver.

Adobe Dreamweaver doskonale nadaje się do tworzenia witryn internetowych. Oprócz podstawowych funkcji, takich jak uzupełnianie kodu, zwijanie kodu i podświetlanie składni, zawiera kilka zaawansowanych funkcji, takich jak introspekcje kodu i sprawdzanie składni w czasie rzeczywistym. Te wymienione wskazówki pomogą Ci skuteczniej zbudować Twoją witrynę. Jeśli szukasz narzędzi do budowy strony internetowej bez dużej ilości kodowania, wypróbuj te narzędzia do tworzenia stron internetowych.