Video: Как создать сайт мечты #1 - Adobe Dreamweaver CC (SMGroup) (September 2024)
Adobe kunde ha vilat på sina lagrar när hon uppdaterade Dreamweaver till sin senaste inkarnation i den prenumerationsbaserade Creative Cloud-tjänsten som Dreamweaver CC. I sin tidigare inkarnation som Dreamweaver CS6, en del av Adobes Creative Suite 6, hade Adobes avancerade webbplatsredigerare redan liten eller ingen allvarlig konkurrens som ett verktyg för att skapa och underhålla dagens multiplatformswebbplatser. Dreamweaver CS6, till exempel, introducerade färdiga att använda "fluid grid" webblayouter som använder CSS för att omforma webbsidor automatiskt beroende på skärmstorlek, vilket gör det enkelt att bygga en enda webbplatsanvändning med telefoner, surfplattor och stationära datorer utan komplexet CSS-handkodning tidigare krävs.
Den nya Dreamweaver CC förbättrar vätska-rutnätsfunktionen genom att stödja HTML5-strukturelement som avsnitt och artiklar. Det lägger också till ett lika ansträngningsbesparande verktyg, en ny CSS-designer som använder ett interaktivt grafiskt gränssnitt för att modifiera CSS-egenskaper som skuggor och böjda hörn, så att du bara behöver klicka och dra för att ändra komplex CSS-kod medan du ser resultaten i real- tid. Fullt stöd för webbaserade teckensnitt - nedladdade från Adobes servrar medan webbläsaren laddar en sida - gör det enkelt att skapa iögonfallande mönster. Precis som resten av Creative Cloud-sviten får Dreamweaver också ett förenklat och lättare anpassningsbart gränssnitt och fungerar identiskt under både Windows och OS X.
Pro och Semi-Pro
Dreamweaver är ett verktyg på professionell nivå som är värt att ha - om du har råd med det - även om du är en icke-professionell. Första gången Dreamweaver-användare kan skrämmas av mängden menyer och egenskapspaneler i standardlayouten, men det blir snart klart hur man använder dessa för att få snabb åtkomst till avancerade kontroller över CSS-element eller snabbt växla mellan skärmar som visar hur en webbsida kommer att se ut när den skrivs ut eller när den visas på olika storlekar. Avancerade webbdesigners kan klicka på en meny med JavaScript-baserade UI-widgets i sin kod för att skapa popup-dialogrutor, datumväljare, dragspel-menyer och allt annat i det aktuella repertoaret för UI-effekter. Men även mindre avancerade användare kan skapa flexibla HTML5-kompatibla webbplatser som ser bra ut på alla plattformar.
Börja väva drömmar
Börjar från antingen en tom sida eller provlayout, klickar du på objekt i en Infoga-panel för att lägga till element som mallar (med redigerbara och oredigerbara regioner), multimedia (HTML5 eller Flash) och standard HTML-funktioner. Standardskärmen är uppdelad i ett kodfönster och ett WYSIWYG-designfönster, men du kan välja det ena eller det andra eller göra designfönstret "Live" för att se mediainnehåll som video eller innehåll som kommer att serveras från en databas när sidan visas i en webbläsare. En sak som jag beundrar om Dreamweaver är att den inte gynnar Adobes egen teknik som Flash över öppna standarder som HTML5-video, men ger lika stöd för båda - och till och med ger en snyggare och mer användbar HTML5-videospelare än den inbyggda Flash spelare.
När du bygger en sida med Dreamweaver-funktionen för vätskerid skapar appen först en sida som innehåller ett rutnät med vertikala kolumner som är synliga i Dreamweaver men inte när sidan visas i en webbläsare. Som standard passar en sida som är designad för telefoner in i fyra av dessa osynliga kolumner. När samma sida visas på en surfplatta fyller den åtta kolumner och tolv kolumner när den visas på en stationär maskin.
När du växlar mellan skärmstorlekar i Dreamweavers redigeringsfönster, ordnar innehållet på webbplatsen sig så att det passar den bredd som du angav för den specifika skärmtypen, och du kan använda CSS Designer-panelen för att justera form, storlek och andra egenskaper av enskilda element för att passa de olika skärmstorlekarna.
