Видео: Как создать сайт мечты #1 - Adobe Dreamweaver CC (SMGroup) (Ноември 2024)
Adobe можеше да почива на лаврите си, когато актуализира Dreamweaver до последното си въплъщение в услугата Creative Cloud, базирана на абонамента, като Dreamweaver CC. В предишното си въплъщение като Dreamweaver CS6, част от Creative Suite 6 на Adobe, усъвършенстваният редактор на уебсайтове на Adobe вече имаше малка или никаква сериозна конкуренция като инструмент за създаване и поддържане на уебсайтове за многоплатформи днес. Dreamweaver CS6, например, въведе готови за използване "течно решетка" Уеб оформления, които използват CSS, за да прекрояват автоматично уеб страници според размера на екрана, което улеснява изграждането на използване на един сайт с телефони, таблети и настолни компютри без комплекса CSS ръчно кодиране, изисквано по-рано.
Новият Dreamweaver CC подобрява функцията на флуидната мрежа, като поддържа HTML5 структурни елементи като секции и статии. Той също така добавя също толкова спестяващ усилия инструмент, нов CSS дизайнер, който използва интерактивен графичен интерфейс за промяна на CSS свойства като сенки и извити ъгли, така че трябва само да щракнете и плъзнете, за да модифицирате сложен CSS код, докато виждате резултатите в реално- време. Пълната поддръжка на уеб-базирани шрифтове - изтеглени от сървърите на Adobe, докато браузърът зарежда страница - улеснява създаването на привлекателни дизайни. Също така, като останалата част от пакета Creative Cloud, Dreamweaver също получава опростен и по-лесно адаптивен интерфейс и работи идентично както в Windows, така и в OS X.
Pro и Semi-Pro
Dreamweaver е инструмент на професионално ниво, който си струва да имате - ако можете да си го позволите - дори и да сте непрофесионалист. Потребителите на Dreamweaver за първи път може да бъдат сплашени от множеството менюта и панели със свойства в подредбата по подразбиране, но скоро става ясно как да ги използвате, за да получите бърз достъп до разширени контроли над CSS елементи или бързо да превключвате между дисплеи, които показват как уеб страница ще изглежда при отпечатване или когато се показва на екрани с различен размер. Усъвършенстваните уеб дизайнери могат да кликнат върху менюто на базираните на JavaScript Uid джаджи в техния код, за да създадат изскачащи диалогови прозорци, инструменти за избор на дата, менюта в стил на акордеон и всичко останало в текущата репертория на UI ефекти. Но дори и по-малко напредналите потребители могат да създават гъвкави сайтове, съвместими с HTML5, които изглеждат добре на всяка платформа.
Започнете да тъчете мечти
Започвайки или от празна страница, или от примерно оформление, щракнете върху елементи в панела за вмъкване, за да добавите елементи като шаблони (с региони, които могат да се редактират и не могат да се редактират), мултимедия (HTML5 или Flash) и стандартни HTML функции. Екранът по подразбиране е разделен на кодов панел и WYSIWYG дизайн панел, но можете да изберете едно или друго, или да направите панела за дизайн „На живо“, за да преглеждате медийно съдържание като видео или съдържание, което ще се показва от база данни, когато страницата се показва в браузър. Едно нещо, на което се възхищавам при Dreamweaver, е, че той не предпочита предпочитаните от Adobe технологии като Flash над отворени стандарти като HTML5 видео, но предоставя еднаква подкрепа и за двете - и дори осигурява по-добре изглеждащ и по-използваем HTML5 видео плейър от вградения му Флаш плейър.
Когато създавате страница с функцията на течната мрежа на Dreamweaver, приложението първо създава страница, която съдържа мрежа от вертикални колони, които се виждат в Dreamweaver, но не и когато страницата се появи в браузър. По подразбиране страница, предназначена за телефони, се побира в четири от тези невидими колони. Когато една и съща страница се показва на таблет, тя запълва осем колони и дванадесет колони, когато се показва на настолна машина.
Когато превключвате между размерите на екрана в прозореца за редактиране на Dreamweaver, съдържанието на вашия сайт се пренарежда, за да пасне на ширината, която сте задали за конкретния тип екран, и можете да използвате панела CSS Designer, за да коригирате формата, размера и други свойства на отделни елементи, за да отговарят на различните размери на екрана.