\n Der Dreamweaver ist die Mutter aller webbasierten Aktivit\u00e4ten im Internet. F\u00fcr die meisten Menschen ist Dreamweaver nur ein Tool zum Erstellen von Websites, aber nur die Profis wissen, dass Dreamweaver das Kraftpaket ist.\n<\/p>\n
\n Dreamweaver hat viele Funktionen und Optionen, die es zum beliebtesten Tool der Webentwickler machen. Zweifellos verf\u00fcgt diese Software \u00fcber die bekannteste IDE (Integrated Development Environment), die keine andere Webentwicklungssoftware auf dem aktuellen Markt hat. Entweder die Entwicklungs-, Kollaborations- und Codierungswerkzeuge, der Dreamweaver bietet den Webentwicklern eine anst\u00e4ndige Auswahl zum Spielen. Aus diesem Grund ist es f\u00fcr Webentwickler-Anf\u00e4nger wichtig zu wissen, wie sie die Nutzung von Dreamweaver maximieren k\u00f6nnen.\n<\/p>\n
\n Alle Aspekte, die erfahrene Webentwickler von gew\u00f6hnlichen Webentwicklern unterscheiden, sind unter Schichten von bedauerlichen intuitiven Men\u00fcs verborgen, weshalb es neuen Webentwicklern schwer f\u00e4llt, ihre F\u00e4higkeiten zu verbessern. In diesem Artikel werde ich Ihnen jedoch die verborgenen und leistungsstarken Funktionen von Dreamweaver zeigen, die sehr wichtig sind, um die Anforderungen des heutigen Marktes zu erf\u00fcllen. Dieser Artikel hilft Ihnen, schnell auf diese Funktionen zuzugreifen, und stellt Ihnen die zehn hilfreichsten Hacks zur Verf\u00fcgung, die die Qualit\u00e4t Ihrer Arbeit und Ihre Codierung erheblich verbessern.\n<\/p>\n
\n Jeder wei\u00df, dass der Dreamweaver die statische Ansicht unserer ge\u00f6ffneten Dateien anbietet. Allerdings bleibt die Frage nach den dynamischen Ansichten einer Anwendung wie WordPress unbeantwortet. Um die dynamische Ansicht festzulegen, m\u00fcssen wir Dreamweaver die Einstellungen mitteilen, die f\u00fcr die dynamischen Ansichten verwendet werden sollen. Um dies einzustellen, gehen Sie zu den HTTP-Anforderungseinstellungen, indem Sie auf Ansicht > Live-Ansicht > Optionsmen\u00fc klicken, und geben Sie dann das GET oder POST ein, das erforderlich ist, um Ihre Anwendung korrekt anzuzeigen.\n<\/p>\n
\n Schalten Sie danach die Live-Ansicht in Dreamweaver um, die das Design-Ansicht-Bedienfeld in das Live-, pixelgenau gerenderte WebKit Ihrer Seite ersetzt. Vervollst\u00e4ndigen Sie es dann mit Live-Javascript, DOM-Manipulationen, Datenbankabfragen, serverseitigem Code und gerendertem CSS anstelle des Platzhaltersymbols aus der Design View-Oberfl\u00e4che.\n<\/p>\n
\n Die Navigation ist die eine Seitenkomponente in der responsiven Website, die die Anpassungsf\u00e4higkeit haben sollte, um die Anforderungen kleinerer Bildschirme zu erf\u00fcllen, f\u00fcr die Bootstrap sehr hilfreich sein kann. Mit Bootstrap k\u00f6nnen Sie Ihre Navigationsleiste einfach einrichten und vom horizontalen Streifen zum vertikalen Panel wechseln. Der Grund daf\u00fcr ist, dass Dreamweaver die gesamte Navigationsflexibilit\u00e4t von Bootstrap unterst\u00fctzt und die Funktion einfach zu verwenden ist, wenn es darum geht, eine effektive, reaktionsschnelle Website zu entwickeln.\n<\/p>\n
\n Um Ihnen einen schnellen \u00dcberblick zu geben, folgt eine kurze Demo zur Verwendung von Bootstrap in Ihrer Entwicklung.\n<\/p>\n
\n Die Beschleunigung der Navigation mit Bootstrap beginnt mit dem neuen Dokumentdialog von Dreamweaver. Klicken Sie einfach auf die Schaltfl\u00e4che Bootstrap Framework im Dialogfeld \u201eNeues Dokument“ und aktivieren Sie auch das Kontrollk\u00e4stchen f\u00fcr die Option \u201ePre-Build-Layout“, um die voll funktionsf\u00e4higen Navigationsoptionen zu verwenden, z.\n<\/p>\n
\n Wenn Sie es schwierig finden, gibt es eine andere Option. Mit Dreamweaver k\u00f6nnen Sie die benutzerdefinierte Navigationsleiste erstellen. Wenn Sie die dunkle Palette bevorzugen, f\u00fcgen Sie einfach die Klasse .navbar-inverse zu Ihrer hinzu\n<\/p>\n
\n Schild. Damit kann man sogar spielen. Wenn Sie Ihre Navigation immer \u00fcber der Seite anzeigen m\u00f6chten, geben Sie .navbar-fixe-top ein. Wenn Sie es unten anzeigen m\u00f6chten, geben Sie .navbar-fixed-bottom ein. Alle diese Bootstrap-Klassen sind Standard, und die Dreamweaver-Codehinweise unterst\u00fctzen diese Codierung ebenfalls, sodass Sie nicht die gesamte Codierung im Auge behalten m\u00fcssen. Sie m\u00fcssen nur .navbar in die Elementanzeige eingeben, und Sie erhalten die Popup-Liste, in der Sie Ihre gew\u00fcnschte Option ausw\u00e4hlen k\u00f6nnen.\n<\/p>\n
\n Der Ajax hat eine sehr dynamische Natur. Aus diesem Grund m\u00fcssen wir oft mit der Seite mit nicht verf\u00fcgbaren oder nicht gerenderten Elementen beim Laden der ersten Seite interagieren. Diese Elemente k\u00f6nnten nach einiger Zeit des Ladens in die Seite eingef\u00fcgt werden, weshalb sie beim ersten Laden nicht angezeigt werden. Wenn Sie beispielsweise das Design des Tooltips \u00e4ndern m\u00f6chten, der vollst\u00e4ndig in JavaScript implementiert ist, haben Sie sich fr\u00fcher methodisch durch Ihre Skripts gesucht, um herauszufinden, welches Element wo erstellt wurde. Anstatt die Skripte zu durchsuchen, versuchen Sie Folgendes.\n<\/p>\n
\n Bringen Sie Ihren Dreamweaver in die Live-Ansicht und rendern Sie Ihre Seite. Dr\u00fccken Sie dann die F6-Taste, um das JavaScript jederzeit einzufrieren, sodass Sie jeden Code eines beliebigen dynamischen Elements auf der Seite analysieren und anvisieren k\u00f6nnen. Dies hilft Ihnen nicht nur dabei, den genauen Code des dynamischen Elements zu ermitteln, sondern beschleunigt auch Ihre Entwicklung, indem die Zeit f\u00fcr die Suche nach Code innerhalb der dynamischen Website verk\u00fcrzt wird.\n<\/p>\n
\n Ein Skript zum Codieren kann sehr verwirrend sein, wenn Sie nicht daran gew\u00f6hnt sind, jeden Tag und jede Nacht komplexe Codierungen zu sehen. Hier hilft Ihnen die Hervorhebung der Codes, Trennungen im gesamten Skript zu erstellen. Anstatt Ihre Augen mit der Blutung zu bewegen, hat Dreamweaver eine Funktion, die die Codierung hervorhebt, die Ihnen hilft, sie zu lesen. \u00d6ffnen Sie dazu die Voreinstellungen von Dreamweaver und schalten Sie den Abschnitt \u201eTechnologievorschau“ ein. Klicken Sie dann auf die Option zum Aktivieren der Codehervorhebung und lassen Sie Dreamweaver seine Arbeit tun. M\u00f6glicherweise m\u00fcssen Sie jedoch Ihre Dreamweaver-Version aktualisieren, da diese Funktion nur in der neuesten Version verf\u00fcgbar ist.\n<\/p>\n
\n Sobald Sie die Hervorhebungsoption aktiviert haben, doppelklicken Sie einfach auf ein beliebiges Tag, und es werden alle Instanzen des Tags auf der aktuellen Seite hervorgehoben. Die Parameter sollten jedoch definiert werden. Dieses Tool eignet sich hervorragend zum schnellen Identifizieren und Aufrufen \u00e4hnlicher Elemente. Sobald Sie ein beliebiges Element markiert haben, verwenden Sie die Tastenkombinationen f3 auf dem PC, CMD-G auf dem Mac), um von einem markierten Element zum n\u00e4chsten Element zu springen. Au\u00dferdem kann der Verschiebungsmodifikator zum vorherigen Abschnitt zur\u00fcckgehen. Dar\u00fcber hinaus funktioniert die Codehervorhebung auch mit den Attributen und Werten der HTML-Tags, sodass Sie die spezifischen Klassen leicht erkennen k\u00f6nnen.\n<\/p>\n
\n Dreamweaver ist eine gro\u00dfartige Plattform mit intelligenten und vollst\u00e4ndigen HTML- und CSS-Codes. Einige Leute glauben jedoch, dass JavaScript nicht vollst\u00e4ndig ist. Im Fall von jQuery oder Prototype sollten Sie in Dreamweaver wissen, dass es API-Erweiterungen gibt, die Javascript-Vervollst\u00e4ndigungscodes bereitstellen. Diese Codes beschleunigen den Entwicklungsprozess, da durch die Verwendung dieser Codes keine ganzen Skripte eingegeben werden m\u00fcssen und f\u00fcr schnelle Programmierer ziemlich praktisch sind.\n<\/p>\n
\n Dreamweaver ist die einzige Webentwicklungssoftware, mit der Sie solche jQuery- und Prototyp-Vervollst\u00e4ndigungscodes verwenden k\u00f6nnen, die jedem Webentwickler helfen, seine Aufgabe zu beschleunigen und mit minimalem Aufwand das bestm\u00f6gliche Produkt zu produzieren.\n<\/p>\n
\n CSS und JavaScript sind die Namen unabh\u00e4ngiger Dateien, die Sie sehen, wenn Sie die HTML- und PHP-Dateien \u00f6ffnen. W\u00e4hrend Sie die PHP-Datei \u00f6ffnen, k\u00f6nnen Sie sie oben im Fenster sehen. Da diese alle Optionen im Vordergrund platziert sind, k\u00f6nnen Sie einfach zu diesen Dateien wechseln und \u00c4nderungen vornehmen, die gespeichert werden k\u00f6nnen, ohne sie \u00fcberhaupt zu \u00f6ffnen. Wenn Sie auf eine beliebige Datei in der Leiste f\u00fcr zugeh\u00f6rige Dateien klicken, wird deren Quelle in der Codeansicht und die \u00fcbergeordnete Seite in der Entwurfsansicht angezeigt.\n<\/p>\n
\n Dar\u00fcber hinaus k\u00f6nnen Sie jedes beliebige Codenavigator-Tool verwenden, um schnell auf den CSS-Quellcode zuzugreifen, der sich auf Ihre aktuelle L\u00f6sung auswirkt. Dieser schnelle Zugriff auf den CSS-Quellcode verk\u00fcrzt die Programmierzeit und erm\u00f6glicht es dem Webentwickler, sich auf die verschiedenen Aspekte seines Entwicklungsprozesses zu konzentrieren.\n<\/p>\n
\n Unorganisierte und chaotische Codezeilen zeigen, dass der Entwickler dieser Codierung nicht professionell und geschickt genug war, um die Codes in der richtigen Reihenfolge zu schreiben. Dies ist auch etwas, das bei der Suchmaschinenoptimierung der Website viel z\u00e4hlt. Es ist jedoch nicht so schwierig, Ihre Codes zu organisieren und zu versch\u00f6nern, wie die Leute glauben. Mit der richtigen Kenntnis der Dreamweaver-Optionen k\u00f6nnen Sie Ihre Codes spontan organisieren. Verwenden Sie einfach die Option \u201eQuellformatierung anwenden“ und reformieren Sie sie genau nach Ihren W\u00fcnschen. Um Ihre Codierung sauber und ordentlich zu gestalten, klicken Sie unten in der Codierungssymbolleiste auf \u201eQuellcode formatieren“ und gehen Sie dann zu \u201eBearbeiten > Symbolleisten > Codierung“. und w\u00e4hlen Sie dann die \u201eCodeformateinstellungen“, um Ihre bevorzugte Einstellung festzulegen.\n<\/p>\n
\n Eine andere M\u00f6glichkeit, Ihr Skript zu organisieren, besteht darin, auf die Formatierungsoption \u00fcber Befehle > Quellformatierung anwenden zuzugreifen oder sie nur auf einen Codierungsblock anzuwenden, indem Sie die Option Quellformatierung auf Auswahl anwenden ausw\u00e4hlen.\n<\/p>\n
\n Unabh\u00e4ngig davon, wie sehr Adobe den Dreamweaver mit leistungsstarken Tools und Funktionen ausstattet, je mehr Sie an den Websites arbeiten, desto mehr Arbeit m\u00fcssen Sie auf der Codierungsseite erledigen. Dieses Ding kann Ihre F\u00e4higkeiten verbessern, aber es wird auch die T\u00fcren f\u00fcr endlose Fehler \u00f6ffnen, da zu viel Schreiben von Codierungen keine leichte Aufgabe ist. Dreamweaver wei\u00df das, und deshalb gibt es in der neuesten Version von Dreamweaver, der Creative Cloud (CC), eine Funktion namens Linting-Unterst\u00fctzung. Linting ist ein grundlegendes Tool zur \u00dcberpr\u00fcfung der Programmiersyntax, das f\u00fcr CSS, HTML und JavaScript verf\u00fcgbar ist. Dadurch sendet Dreamweaver jedes Mal, wenn es ein Problem oder einen Fehler identifiziert, eine Reihe allgemeiner und spezifischer Meldungen.\n<\/p>\n
\n Um den Test auszuf\u00fchren, \u00f6ffnen Sie eine Seite voller Codes in Dreamweaver und Sie sehen ein kleines gr\u00fcnes H\u00e4kchen in einem Kreis auf der rechten Seite der Statusleiste. Wenn nur ein kleines gr\u00fcnes H\u00e4kchen eingekreist ist, ist mit Ihrem Code alles in Ordnung. Wenn ein rotes Kreuz rot eingekreist ist, gibt es einige Probleme mit Ihrer Codierung, und Sie m\u00fcssen sie \u00fcberarbeiten, damit Ihre Website ordnungsgem\u00e4\u00df ausgef\u00fchrt wird. Dar\u00fcber hinaus k\u00f6nnen Sie durch Klicken auf die Markierung des Fehlers zu der Spalte und Zeile gelangen, in der Sie den Fehler mit der Fehlerbeschreibung gemacht haben. Das Beste daran ist, dass es f\u00fcr diese Funktion keine Begrenzung gibt und Sie sie verwenden k\u00f6nnen, bis Sie die gr\u00fcne Markierung nicht mehr erhalten.\n<\/p>\n
\n Die Browsing-F\u00e4higkeit ist eines der grundlegendsten Dinge jedes Webentwicklungsprozesses. Aus diesem Grund hat Dreamweaver es Ihnen einfacher gemacht, damit Sie diese grundlegenden Dinge nie verpassen k\u00f6nnen, bevor Sie mit der Webentwicklung beginnen. \u00d6ffnen Sie das Dokument in Dreamweaver, f\u00fcr das Sie die Kompatibilit\u00e4t \u00fcberpr\u00fcfen m\u00f6chten. In der Men\u00fcleiste, in der die Symbole f\u00fcr Code-, Teilungs- und Entwurfsansichten platziert sind, gibt es eine weitere Option, die als \u201eSeite pr\u00fcfen“-Schaltfl\u00e4che bezeichnet wird.\n<\/p>\n
\n Beim Klicken \u00f6ffnet sich ein Dropdown-Men\u00fc, w\u00e4hlen Sie darin Browser-Kompatibilit\u00e4t pr\u00fcfen und sehen Sie das Ergebnis Ihrer Kompatibilit\u00e4t in einem separaten Fenster.\n<\/p>\n
\n Beim Codieren f\u00fcr die gro\u00dfe Website kommt es oft vor, dass Sie ein St\u00fcck Code auf dem Bildschirm irritiert. Nur sehr wenige Menschen wissen, dass sie diesen Kodierungsblock minimieren k\u00f6nnen, indem sie einfach eine Taste auf der Tastatur dr\u00fccken. Wenn Sie sicher sind, dass keine \u00c4nderungen an dem Codierabschnitt vorgenommen werden m\u00fcssen, w\u00e4hlen Sie einfach diesen Block aus und klicken Sie auf \u201e-“ neben der Codezeilennummer. Dieser Brocken wird minimiert und st\u00f6rt Sie nicht, bis Sie ihn erweitern.\n<\/p>\n<\/p>\n