ПоделитьсяTweetПоделитьсяGoogle
Всем доброго здравия и времени суток. Начинаем сериал «Дримвивер». Один из самых популярных HTML редакторов компании Adobe — в переводе глинобитный кирпичь, саман. Редактор на котором можно сделать практически всё, от мелкой редакции до тяжёлого сайта.
Начнём с азов. Первый урок познакомимся с программой , кто знаком может переходить к следующим.Сразу предупреждаю, я не особо профессионал, что освоил тем и делюсь.
На шибко умные и насмешливые коменты стреляю без предупреждения.
«Смеётся тот, кто стреляет первым.»
Джон Вэйн (король вестерна)
От простого описания мы перейдём к созданию сайта воронки, или как говорят, страничке захвата.
Итак первый урок описание программы Adob Dreamweaver CS6 и создание папки будущего сайта. В нашем случае — Странчки захвата. Или лучше Сайт Воронка.
Для начала надо просмотреть программу, можете просмотреть на официальном сайте разработчика>>
Или уже крякнутую версию в конце поста . Крякнутая — лопнувшая. давшая трещину 🙂 . То есть бывшая платная стала безплатной в результате некоторых действий.
Скачав установив, открываем программу и сразу же перейдём из «Дизайнер» в вид «Классический»
для удобства. В правом нижнем экране появился интерфейс «Локальные файлы«. Здесь мы видим наш компьютер. Этот менеджер удобен для создания папки будущего сайта, что мы и сделаем, кликаем «Управление вебсайтами» появляется ещё одна панель «Управление сайтами»
ЧИТАТЬ: Форма связи в всплывающем окне
жмём «Новый сайт», появится ещё одна панель «Настройка сайта…» и переименовываем в свой сайт допустим » Сайт Воронка » и папку прописываем ту же, скопируем название сайта и вставим в путь к папке
вместо «Сайт без названия…»
Папка создадится автоматически, естественно она пустая, можете указать другой диск или флеш накопитель. Начало положено…
Вот теперь кликаем на основном разделе интерфейса иконка и подпись» HTML», вверху под «Создать» . Мы в редакции «Дизайн», если переключить в режим «Код» увидим начало документа и мигающий курсор в том месте где и будут все наши надстройки и база, то есть тело документа, сайта всё содержимое между тегами …
Итак, для нашего сайта воронки потребуется создание блока div, в котором и будет содержатся все элементы, прежде всего wrapper — обёртка, создаём…
Перейдём в визуальный вид редактора кликнув по кнопке «Дизайн», далее сохраним наш будущий сайт и теперешний файл в index.html, для этого откроем файл/сохранить как
теперь название нашего документа поменялось (вверху слева) и мы можем двигаться дальше. Создаём блок div иконкой вверху, задаём индификатор ID — wrapper и правило css, по кнопке «Создать правило CSS»
ЧИТАТЬ: Закрытый раздел сайта или только для подписчиков
Появилось ещё одно окошко программы, для нашего одностраничного сайта мы создадим отдельный CSS файл и жмём «Ок»
открывается ещё одно окошко проги и здесь нам надо сохранить наш файл, для этого мы создадим папку css
в котором будет файл ( таблица стилей ) style, пропишем
выпало следующее окно ( надо стекольщиков вызывать 🙂 ) . Здесь зададим все правила. Прежде всего
- фон выберим белый, кликнув по серому квадратику появится таблица цветов, в ней берём белый и «Применить»
размеры задаём в «Рамка«, обычно это до 800 пикселей, сделаем 760, высота до 4000. Пусть будет 3000 , потом всегда можно изменить. Далее отступы пишем так как на скрине, когда по эксперементируете можете писать свои…
галочку уберём (Галину Ивановну убрать 🙂 ) в «Одинаково для всех» . Кликаем Применить,»Ок», ещё раз «Ок» и смотрим нашу рамку, мы всегда можем перейти в редакцию иконкой карандаш
или кликнув внутри блока и потом на иконку внизу CSS , затем на «Изменить правило» мы так же перейдём в редакцию. Что и проделаем сейчас, для того чтоб обозначить рамку границу
ставим solid и 2 пикселя и цвет серый — рамка готова, теперь создадим ещё одно правило, для тега body. Откроем окошко «Создать правило CSS» иконкой страничка с +
выберим «Тег (преопределяет элемент HTML)» и «body«, жмём «Ок».
ЧИТАТЬ: Как получить доступ по FTP
Далее , чтоб наша воронка была по симпатичнее предлагаю сделать фон (background) текстурой, зайдём в ресурсы картинок и выберим изображение текстуры. Можно просто в Гугл картинки набрать «Текстуры», допустим эту
Если картинка весит много, можете перевести в формат jpg и уменьшить вес. Далее создадим папку images в нашем файле «Сайт воронка»
и положим изображение с текстурой туда. Теперь в Дримвивере укажем наш bacground во вкладке «Фон» кликнем на «Обзор»
Кликаем «Ок», «Применить» и сразу пропишем для тега body базовые шрифты, зайдём в «Тип» в Font-family изберём —
- Arial, Helvetica, sans-serif
- Font-size — 14
- цвет #333
Жмём » Применить» , «Ок»
И получаем вот такой начальный вид
Можете просмотреть в браузере, кликнуть по иконке глобуса и выбрать ваш текущий обозреватель.
На этом первый урок закончен , далее вы можете перейти в раздел Уроки и выбрать в главе Adob Dreamweaver CS6 — уроки, тот урок который вас больше интересует.
Не волнуйтесь при закрытии Дримвивер попросит разрешение сохранить текущий документ, сохраняйте и в следующих уроках продолжим дальше.
Всем всего и больше. Пока.
P.S. просмотреть Адоб Дримвивер CS6>> Скачайте и откройте Crack/Keygen там текстовый файл «Читать»
Внимательно пользуйтесь инструкцией и устанавливайте.
Упс… Ошибка 404
Извините, но страница, которую Вы ищете, не существует.
ПоделитьсяTweetПоделитьсяGoogle