Как установить adobe dreamweaver
Обновлено: 05.07.2024
Сегодня мы с вами познакомимся с программой для создания дизайна сайта, так же его редактирования Adobe Dreamweaver.
В прошлой статье « Photoshop вставка молнии на картинку » мы с вами научились создавать молнию и вставлять её в любое изображение.
Кроме этого в конце статьи я обещал показать, как можно в Photoshop создать солнце и шар, но друзья в последнее время я увлекся программой Adobe Dreamweaver и поэтому сегодня я расскажу вам о своем первом знакомстве со столь полезной программой.
Мне она интересна именно как средства для создания дизайна сайта.
В своих тренировках я использую версию CS6.
Для начала давайте в двух словах опишу программу и ее назначение:
Dreamweaver, является визуальным HTML-редактором, позволяет переключаться в режим ручного редактирования кода, осуществляя взаимосвязь между визуальным представлением страницы и ее исходным кодом.
Конечно, как и в любой другой программе изучение необходимо начинать с настроек и внешнего вида.
Настройка программы для создания сайта
Запустите редактор Adobe Dreamweaver:
Нажмите Пуск - Программы - Adobe - Adobe Dreamweaver. После запуска Dreamweaver откроется окно стартовой страницы. С его помощью можно открывать используемые файлы, создавать новые файлы, а также получить доступ к различным ресурсам программы .
В открывшемся окне с возможностью выбора дальнейших действий пользователя в разделе Создать выберите HTML
В окне программы для переключения между режимами отображения и редактирования HTML -документа предназначены три первые кнопки на панели инструментов.
Дизайн, отобразится поле документа. Все основные действия при создании и редактировании HTML-страницы производятся в поле документа.
Вот примерно так выглядит основное рабочее окно программы.
Чтобы Dreamweaver понимал русскую кириллицу необходимо сделать следующие действия:
Чтобы вызвать настройку некоторых параметров, в главном меню откройте пункт Правка , а в нем выберите пункт Настройки .
После этого на экране отобразится окно редактирования параметров. В левой части окна отображаются категории возможных настроек, а в правой – параметры выбранной категории.
Для корректного отображения HTML -документов необходимо указывать кодировку.
Теперь все вновь создаваемые HTML -документы будут поддерживать русские буквы.
Теперь давайте подготовим нашу программу для создания нового сайта:
Выполните команду Веб-сайт èНовый сайт . На экране появится диалоговое окно Настройка сайтов (менеджер сайтов) в нем содержится список созданных сайтов. Пока этот список пуст.
На вкладке Веб-сайт в поле Имя Веб-сайта введите имя сайта.
В поле Локальная папка сайта укажите путь к папке, в которой будут храниться все файлы этого сайта.
Введите название новой папки на английском языке .
При назначении имен файлам необходимо ограничиться цифрами и буквами латинского алфавита и использовать символы только нижнего регистра.
Два раза щёлкните левой кнопкой мыши на созданной папке.
Откроется окно редактора.
В верхней правой части редактора Дизайнер выберите из выпадающего списка вариант настройки рабочего окна Классический.
А теперь давайте приступим к тестовому заданию:
В поле Название введите название страницы для браузера, например, Авторское право
Сделайте разметку главной страницы сайта с помощью таблицы :
Выполните команду Вставка - Таблица. В окне Таблица введите:
В поле Строки количество строк таблицы = 3
В поле Столбцы – количество столбцов таблицы = 2
В поле Ширина таблицы – ширина таблицы = 100 %
Остальные параметры оставьте без изменений.
Объедините ячейки первой строки таблицы, режим HTML выделите всю строку и нажмите на кнопку Объединить выбранные ячейки в диапазон на панели свойств; (или выбрать одноименную команду из контекстного меню).
Или выберите команду меню Изменить - Таблица - Объединить ячейки . То же выбрать из контекстного меню.
Или нажать сочетание клавиш Ctrl+Alt+M.
Оформите строку в Панели свойств: (режим CSS )
В поле Высота – введите высоту строки таблицы = 40.
Выравнивание По горизонтали – По центру
Отметьте галочкой пункт Без переноса .
Введите текст заголовка в ячейку и отформатируйте его: Здравствуйте !
Оформите текст стилем Заголовок 1 . Выделите его или просто установите курсор в любое место
Выберите команду меню Формат - Формат абзаца - Заголовок 1 .
Эти действия можно выполнить из контекстного меню Форматирование абзаца. Или в Панели свойств перейти в режим HTML и выбрать из выпадающего меню Формат è Заголовок 1.
Чтобы выбрать цвет текста, откройте Свойства страницы внизу рабочего окна редактора, выберите категорию Внешний вид (HTML) и в строке Текст выберите желтый цвет для текста.
Заполните ячейку таблицы черным или темно-серым цветом:
На Панели Свойств в окне Фон для определения цвета фона ячейки таблицы, выберите черный цвет из палитры.
Сохраните страницу под именем index.
Посмотрите страницу в браузере.
Для этого в панели Документ щелкните на кнопке Просмотр и отладка в браузере . Можно также выбрать клавишу на клавиатуре F12
Заполните нижние ячейки таблицы ( сведения об авторских правах ):
По аналогии с верхними ячейками, оформите нижние ячейки таблицы, также объединив их в одну ( черный цвет – для фона и желтый цвет – для текста).
Введите текст : Иванов И И.
Цитирование опубликованных материалов на сайте без разрешения автора не допускается.
В поле Высота (на Панели свойств) – введите высоту строки таблицы = 40 (пикс).
Выравнивание По горизонтали - По правому краю.
Выделите фрагмент Иванов И И. Подчеркните текст, для этого выберите команду меню ФорматèСтильèПодчеркивание. Или воспользуйтесь одноименной командой контекстного меню.
Перед фамилией вставьте Специальный символ для обозначения авторских прав. Для этого:
- выберите команду меню Вставка - HTML - Специальные символыèАвторское право.
- на вкладке Текст панели Инструментария объектов кнопка Знакиè Авторское право.
Заполните левую ячейку таблицы (ссылки)
В поле Ширина введите ширину ячейки = 100 (пикс) . или отметьте ширину ячейки с помощью линейки, переместив ее на границу равную 100 пикс.
Выравнивание По горизонтали - По центру
По вертикали – По верхнему краю.
Вставьте в левый столбец ссылки Увлечения, Проекты, Ссылки, Обо мне
Для того, чтобы гиперссылки открывали соответствующие Web-страницы в нужном вам фрейме, надо правильно установить параметры Цель (цели гиперссылок).
В выпадающем списке Цель есть разные значения параметра:
Blank – загружает страницу в новом окне Web-обозревателя;
Parent и top - загружает страницу в само окно обозревателя, т.е. страница заменит собой весь набор фреймов.
Self - загружает страницу в текущий фрейм (в котором находится гиперссылка)
Заполните основное содержимое – средняя ячейка таблицы.
Выравнивание По горизонтали - По левому краю
По вертикали – По верхнему краю.
Меня зовут Иванов Иван Иванович. Я вольный Web-дизайнер. А это мой личный Web-сайт, который я сделал сам в программе Dreamweaver.
Оформите стилем Заголовок 2 , в Панели свойств перейти в режим HTML и выбрать из выпадающего меню Формат è Заголовок 2.
Введите приведённые ниже строки маркированного списка и оформите стилем Заголовок 3.
Сделайте выравнивание по левому краю
Создайте маркированный список (перечисления), предварительно выделив текст и нажав на кнопку Неупорядоченный список на Панели свойств :
На этом сайте вы можете прочитать:
§ о моих увлечениях
§ о выполненных мной проектах
§ подробнее обо мне, любимом
Чтобы изменить вид маркеров, выделите маркированный список и выберите команду меню Формат - Список - Свойства.
В окне Свойства списка в строке Стиль из выпадающего списка выберите один из вариантов маркера.
То же можно выбрать из контекстного меню маркированного списка.
Перед текстом: На этом сайте вы можете прочитать: вставьте горизонтальную разделяющую линию.
- выберите команду меню Вставка - HTML - Горизонтальная линия.
Или вставьте линию с помощью тега HR , выделите ее и на Панели с войства можно отредактировать ширину горизонтальной линии. (Цвет для линии можно задать с помощью опции тега HR – color).
Выровняйте линию по Центру , щелкнув по кнопке Align Center на панели Properties .
По аналогии с предыдущими ячейками, оформите среднюю ячейку таблицы (черный цвет – для фона и желтый цвет – для текста).
В итоге должно получится вот такое чудо:
Для тех кому мало текстовой части, и он хотел бы видеть больше скриншотов процесса обучения пишите в комментариях и если желающих наберется много, то я подготовлю статью с картинками.
Если Вам, как и мне интересно постоянно изучать новое подписывайтесь на мой канал и давайте учится вместе!
Есть много программ для написания и изменения кода веб-страниц. От банального windows'овского блокнота, до таких монстров, наподобие Adobe Dreamweaver CS4 . Об установке последнего мы и поговорим.
Предположим, что вы скачали программу от меня. Если она получена из других источников - все описанные процедуры установки должны совпадать, за исключением того, что у вас может быть только английская версия программы. Распаковываете содержимое архива в отдельную папку (подробно о том, как работать с архивами, читайте в этой статье). Запускаете файл " Setup.exe " (может отображаться просто как "Setup" , в зависимости от настройки windows) Слово " Setup " читается как " Сетап " и одним из переводов этого слова является " Установка ".
Ждём появления окна под заголовком "Приветствие", где отмечаем пункт "Я хочу установить и использовать Adobe Dreamweaver CS4 в ознакомительном режиме". Так вы сможете работать с этой программой первые 30 дней бесплатно. Разумеется, если у вас имеется ключ от этой программы, то отмечаете пункт (если он не отмечен) " У меня есть серийный номер для Adobe Dreamweaver CS4 " и вписываете в поля ниже ваш ключ. Затем нажимаете " Далее ".
Рассмотрим подробней, что нам предлагают (кстати, очень жаль что в самом установщике нету пояснений для компонентов - это, я считаю, огромный просчёт фирмы Аdobe) .
Adobe DreamWeaver - собственно, сама программа. Снять с неё выделение не получится - иначе зачем мы тогда начали установку этой программы?
Adobe media player (мидиэ плэйэ) - Словом media в компьютерном мире обозначаются различные видео и аудио материалы. Раньше существовали такое понятие, как медиакомпьютер, то есть более-менее навороченный по тем временам компьютер, оторый мог воспроизводить музыку и фильмы. Player - проигрыватель. Соответсвенно, эта программа я\вляется альтернативой Winamp'у и другим проигрывателям видео и аудио, если вы ещё не нашли себе подходящего программного медиа проигрывателя.
Adobe AIR ( AIR это сокращение для Adobe Integrated Runtime . Так как я взял за правило приводить произношение и перевод английских слов, используемых в статьях, пишу и об этом сложном сокращение. Итак, само слово air ( эйр ) означает воздух. Но оно тут используется лишь как созвучное буквосочетанию - всё-таки среди программистов и маркетологов есть романтики - ткач мечты, воздух. Узнать бы ещё от чего происходит слово "adobe", а то одно из главных слов всей статьи, а я его историю, каюсь, не знаю. Integrated - интегрированное, runtime - run ( ран ) - бегать, запускать, time ( тайм ) - время, а всё вместе это будет время прогона - термин, использующийся в основном программистами, для обозначения времени работты программы или её части. В результате получается, что даже у таких именитых разработчиков как Adobe в установщиках случаются логические ошибки - ведь если прочитать Aobe AIR полностью, то надо будет два раза произносить слово adobe - Adobe Adobe Integrated Runtime. Но этот случай, разумеется, не даёт никакого права другим пренебрежительно к чему-то относиться). Эта вещь использукется в основном программистами для переноса веб-программ на компьютеры.
Adobe Bridge ( Бридж ) - мост . Программа для объединен6ие продуктов серии Creative Suite, куда входит и DremWeaver.
Adobe Device Central ( Дивайс - устройтво, сентрэл - центральный ) . Программа для создания сайтов для мобильных телефонов
Adobe Extension Manager CS4 ( Экстэншон мэниджэ - менеджер расширений) - Облегчает установку дополнений для ДримУивера и некоторых других программных продуктов Adobe.
Поддерживающие компоненты - в этом разделе содержатся части программы, которые необзательны, но их установка добавляет в программу дополнительные возможности или содержимое. В разных программах из пакета CS4 тут разное количество пунктов. Например в DreamWeaver он один - Adobe ExtendScript CS4 ( ЭкстендСкрипт - Расширенный сценарий или скрипт ) - программа для написания сценариев для продуктов Adobe CS4.
После того, как закончите с этим экраном, нажимаете " Установить ".
Ждёте, пока программа установится. По окончанию появится окно, извещающее о успешной установке Adobe Dreamweaver CS4 и где будет одна кнопка - " Выход ". Её и нажимаете.
Всё, поздравляю, Adobe Dreamweaver установлена. Чтобы запустить эту программу, выбираете " Пуск - Все программы - Adobe Dreamweaver "
Сообщите об этой статье друзьям и знакомым - и вы этим поблагодарите автора.
Другие статьи на эту тему
Комментариев: 20
как скачать Dreamweaver люди добрые подскажите
Windows давно меняли? Скорее всего, это из-за него, если многие версии у Вас не идут. :(
Теперь стало всё ясно, большое спасибо за информацию. Вы мне очень помогли.
Два дня мучаюсь. Теперь ок, спасибо.
Вот, нарыл в википедии:
Название происходит от Adobe Creek — ручья в Калифорнии, лежащего между знаменитыми населёнными пунктами Palo Alto и Mountain View.
Эта речка , текла за домом основателя компании Джона Ворнока (John Warnock)
Хотя само слово adobe - в переводе означает "Саман"(кирпич из соломы и глины). В Молдове таких домов ещё много осталось.
Вот и получается, что-то вроде "Кирпичика мечты"
Maximus, спасибо за информацию.
ой,нужен пароль для зашифрованного файла =(
не подскажите какой?)
Доброго Вам! К сожалению, как это ни покажется странным, но у меня полноценно работающего крэка нету.
Ubuntu лучше. Хотя на первых порах так не покажется.
не получается установить
выходит ошибка На этой странице произошла ошибка сценария
мне понравилась статья
тут установил но он пишет что ваш серийный номер уже использован, как его поменять?
Программа для создания сайтов. Как скачать и установить. Об этом я и хочу рассказать. В интернете сейчас масса различных сервисов, платных плагинов и конструкторов для создания сайтов. Пользоваться ими конечно удобно и просто.
Только есть одно «Но», они же все на одно лицо, а некоторые люди (я например) делают музыкальные виртуальные открытки, редактируют изображения для блогов. А так же Вам может понадобиться шапка для видеоканала на YouTube. Можно конечно поискать фрилансера, но где гарантия что он сделает так как нужно Вам?
Или может это просто я такая недоверчивая, просто встречала такие варианты работ , что «Мама не горюй!», школьник сделает лучше, а они ещё деньги за это берут. Поэтому пока что делаю всё сама, говорят что эта болезнь называется перфекционизм. Но ничего не поделаешь, я несу свой крест.
Вот и пользуюсь программой Dreamweaver, которая сама генерирует коды и сохраняет пути к картинкам, чтобы ещё не тратить время на изучение html кодов, хотя некоторые коды всё равно пришлось изучить.
А что касается Дриамвивеера, то моё дело разместить красиво фон, картинки, надписи, аудио или видео. А программа сделает за меня всё остальное, даже выдаст список кодов и вставит, после того как я их выберу. Важно ещё то что программа на русском языке! И мне останется только сделать папочку и загрузить файлы на хостинг. Очень удобно, эта программа просто незаменима.
Эту программу можно найти в интернете бесплатно, а можно скачать с официального сайта и использовать пробный период в течении 30 дней, который предоставляет компания Adobe. И не только эту программу Вы сможете использовать, там предоставлено внушительное количество разнообразных приложений и программ.
Напишите в комментариях как Вы делаете свои одностраничные сайты, сами или заказываете фрилансерам или пользуетесь каким-то сервисом? Если сами, то какие программы используете, если пользуетесь сервисами, то какой Вам больше всего нравится.
(4,90 / голосов - 106)
Устанавливаем Adobe Dreamweaver бесплатно
Любой желающий, с позволения компании Адобе, может воспользоваться абсолютно бесплатно, без каких-либо ограничений и, что не менее важно, совершенно законно, в течение 30 дней мощным пакетом для создания сайтов Adobe Dreamweaver.
Для этого необходимо скачать подходящий для Вашей системы дистрибутив Адобе Дримвивер, по ссылкам приведенным в конце страницы.
Для установки понадобиться подключение к интернет и учетная запись Adobe ID, в случае если у Вас ее нет, то получить ее можно непосредственно в процессе инсталляции программы.
Установка Adobe Dreamweaver CS6
После запуска инсталлятора, необходимо выбрать пункт Пробная версия, ознакомиться с Лицензионным соглашением и принять его. При наличии учетной записи Адобе, ввести данные, если таковой нет, то нажать на кнопку Создание Adobe ID.
Для создания учетной записи Adobe ID необходимо ввести в соответствующие поля электронную почту, пароль и его подтверждение, имя и фамилию, регион, а так же отметить получать новостную рассылку на электронную почту или нет.
После завершения установки пользователь может либо закрыть инсталлятор, либо запустить программу немедленно. После запуска программы появляется окно отображающее количество дней бесплатного использования Дримвивер. После истечения бесплатного испытательного срока, для дальнейшего использования ее будет необходимо приобрести.
Количество дней бесплатного использования Дримвивер
Во время первого запуска, появится окошко с предложением ассоциировать некоторые типы файлов для редактирования по умолчанию в программе Dreamweaver.
Ассоциации с программой Dreamweaver
Стартовое окно программы Адобе Дримвивер содержит меню в котором пользователь может выбрать какого типа документ он планирует создать, программа автоматически подгрузит макет для соответствующего типа документа.
Запуск Adobe Dreamweaver
Из альтернативных бесплатных визуальных редакторов HTML, Вы можете ознакомиться с проектом с открытым исходным кодом openElement, представленном на соответствующей странице нашего ресурса.
Читайте также: