Dreamweaver MX walidacja i czyszczenie kodu źródłowego

Poradnik webdesignera

Strona główna
Uwagi ogólne
Błędy
Przykazania
Artykuły
Linki
Słowo od autorki
Email

Dreamweaver MX - walidacja i czyszczenie kodu źródłowego

WALIDACJA ZNACZNIKÓW KODU

Program Dreamweaver MX ma wbudowany specjalny walidator, dzięki któremu możemy sprawdzić poprawność kodu źródłowego i poprawić ewentualne błędy. Sprawdzanie obejmuje kilka wersji języka HTML, XHTML, ColdFusion Markup Language (CFML), JavaServer Pages (JSP) oraz Wireless Markup Language (WML).

Ustawianie opcji walidatora

Wybierz Edit > Preferences > Validator. Na liście "Validate Against" zaznacz, z których bibliotek ma korzystać program przy sprawdzaniu dokumentu.

Następnie klikamy na "Options", gdzie mamy do dyspozycji następujące opcje:

Display (wyświetlaj w wynikach sprawdzania):
- Errors - błędy
- Warnings - ostrzeżenia
- Custom Messages - inne podpowiedzi, dzięki którym możemy ulepszyć nasz kod źródłowy
- Nesting Errors - błędy zagnieżdżenia znacznikówprzykładowo: Uwaga: - znacznik pogrubienia tekstu został zamknięty wcześniej niż znacznik kursywy

Check for (sprawdzaj w zakresie)
- High ASCII Errors - występowanie w kodzie źródłowym znaków ASCII o wartości powyżej 127. Między innymi polskie litery ze znakami diakrytycznymi znajdują się w tym zakresie. Ponieważ w nagłówku dokumentu deklarujemy sposób kodowania znaków rozszerzonych jako ISO8859-2, więc lepiej odznaczyć tą opcję, by nie otrzymywać ogromnej ilości błędów
- Quotes in Text - cytaty w tekście
- Line Spanning Quotes - cytaty dłuższe niż jedna linia
- Entities in Text - występowanie błędnie zapisanych znaków specjalnych (tzw. encji) w źródle dokumentu (nie dotyczy to oczywiście znaczników), czyli zapisanie znaku & zamiast &amp, < zamiast &lt, > zamiast &gt oraz symbolu cudzysłowu zamiast &quot

Po ustawieniu żądanych opcji uruchamiamy walidator: File > Check Page > Validate Markup. W oknie Results/Validation wyświetlą się wyniki sprawdzania dokumentu. Podwójne kliknięcie na danym błędzie/ostrzeżeniu spowoduje wyświetlenie odpowiedniego fragmentu kodu źródłowego.

CZYSZCZENIE KODU ŹRÓDŁOWEGO

Po procesie tworzenia kodu często zostają w nim różne niepotrzebne elementy, takie jak na przykład puste, czy źle zagnieżdżone znaczniki. Wybierz: Commands > Clean Up HTML
Pojawi się okno dialogowe, w którym ustawiamy żądane opcje:

Remove Empty Container Tags - usunięcie znaczników, które nie mają żadnej zawartości, na przykład czy .

Remove Redundant Nested Tags - usunięcie znaczników, które się niepotrzebnie powtarzają - przykładowo: Chciałabym podkreślić, że jest to moje prywatne zdanie - znacznik pogrubienia tekstu otaczający słowo "podkreślić" zostanie usunięty.

Remove Non-Dreamweaver HTML Comments - usunięcie wszelkich komentarzy, które nie zostały dodane do kodu przez program Dreamweaver. Przykładowo <!tutaj zaczynam skrypt--> zniknie, ale komentarz  pozostanie, gdyż zaznacza on początek edytowalnego obszaru szablonu.
Remove Dreamweaver Special Markup - usunięcie fragmentów kodu stworzonych przez program Dreamweaver sterujących szablonami, takich jak np.: . Uwaga! Użycie tej opcji spowoduje, że jakiekolwiek zmiany wprowadzone w szablonach nie zostaną uwzględnione w danym pliku.

Remove Specific Tag(s) - usunięcie konkretnych znaczników np.: font. W przypadku gdy chcemy usunąć więcej niż jeden znacznik - wpisujemy je kolejno rozdzielając przecinkami: font, blink.

Combine Nested Tags When Possible - połączenie znaczników sterujących kolorem i wielkością czcionki. Przykładowo: przykładowy tekst zostanie zamienione na: przykładowy tekst. Jako że powyższych znaczników nie powinno się już stosować, gdyż do wszelkich tego typu ustawień możemy użyć stylów CSS, opcja jest zasadniczo zbędna.

Show Log on Completion - wyświetlenie raportu z przeprowadzonych zmian.

Czyszczenie kodu po eksporcie do HTML z programu Microsoft Word

Dreamweaver oferuje nam ogromnie cenną możliwość jaką jest czyszczenie kodu HTML wygenerowanego przez program Microsoft Word (w wersjach 97 i późniejszych). Otwieramy plik używając File > Open lub File > Import > Import Word HTML. W pierwszym przypadku musimy wybrać Commands > Clean Up Word HTML, przy imporcie okno dialogowe pojawi się automatycznie. Mamy w nim dostępne opcje podstawowe (basic) oraz ustawienia szczegółowe (detailed).

Opcje podstawowe:

Remove all Word specific markup - usunięcie wszystkich charakterystycznych dla programu Word (i tylko dla niego) znaczników HTML, META oraz wszelkich niepotrzebnych dodatków, które Word generuje w kodzie.

Clean up CSS - usunięcie powtarzających się w każdym możliwym momencie (taka uroda eksportowania do HTML z Worda) znaczników stylów - tych zaczynających się od deklaracji mso, znaczników niekompatybilnych z CSS oraz dziwacznych ustawień w tabelach i nagłówku dokumentu.

Clean up Tags - usunięcie znaczników - w opcjach szczegółowych ustalamy jakie zmiany mają być dokonane w przypadku rozmiaru czcionki. Jeżeli Word zapisał również styl czcionki konieczne jest dodatkowe przeczyszczenie kodu.

Fix invalidly nested tags - usunięcie nieprawidłowo zagnieżdżonych znaczników.
Set background color - ustawienie koloru tła dokumentu. W przypadku, gdy kolor ten nie zostanie oznaczony domyślnym kolorem jest szary.

Apply source formatting - formatowanie kodu źródłowego. Ustawienie opcji: Edit > Preferences > Code Format.

Show Log on Completion - wyświetlenie raportu z przeprowadzonych zmian.

Czyszczenie kodu przy otwieraniu dokumentów (Code rewriting)

Kolejne usprawnienie, które mamy do dyspozycji, to możliwość poprawiania kodu w chwili otwierania dokumentu. Celem ustawienia opcji wybierz: Edit > Preferences > Code Rewriting.

Fix invalidly nested and unclosed tags - poprawienie błędnie zagnieżdżonych znaczników, dodanie brakujących zakończeń znaczników i znaków cudzysłowu.

Rename form items when pasting - zmiana nazwy powtarzających się jednakowych obiektów w formularzach.

Remove extra closing tags - usunięcie zakończeń znaczników, które nie były wcześniej otwarte.

Warn when fixing or removing tags - wyświetlenie listy błędów w znacznikach, które będą poprawione.

Never rewrite code in files with extensions - lista rozszerzeń plików, dla których żadne poprawki nie mogą być wprowadzane.

Encode special characters in URL using % oraz Encode <, >, &, and " in attribute values using & - przekodowanie znaków specjalnych do wartości, które będą zawsze poprawnie wyświetlane.

Agnieszka Richter

Artykuł został napisany dla Optimus Pascal S.A. Publikowanie całości lub fragmentów niniejszego artykułu jest zabronione bez zgody właściciela.

[ Strona główna ] [ Uwagi ogólne ] [ Błędy przy tworzeniu stron ]
[ Przykazania webdesignera ] [ Artykuły ] [ Linki ] [ Słowo od autorki ]