Продолжаем обучение вёрстке и дизайну. Сегодня, как я и писал ранее, мы рассмотрим книгу видео уроков по html, css и прочим сопутствующим технологиям. Итак, приступим.

Книга Евгения Попова "Все Технические Моменты Онлайн Бизнеса в Видеоформате"

Если вы пройдёте по вышеобозначенному линку, то получите довольно обширное описание курса с отзывами и всяческой статистикой. Однако я решил описать данный курс по-своему. Тут не будет материалов из курса (авторские права всё таки), а будет только перечень основных знаний, которые вы сможете почерпнуть из курса. Также будет высказано моё личное мнение относительно "полезности" того или иного курса.

Весь видео курс состоит из семнадцати отдельных курсов. Далее они перечислены.

1. Создание сайта
2. Курс по HTML
3. Курс по CSS
4. Macromedia DreamWeaver
5. Adobe Photoshop
6. Установка сервера
7. Электронные книги
8. Camtasia Studio
9. Flash Collection
10. Mind Manager
11. Установка форумов
12. Установка CMS
13. ShagIt
14. Navigation Collection
15. Graphic Collection
16. Всплывающие окна
17. Бонусный курс

Как всякий нормальный пользователь, я залез сразу в первый урок первого раздела. Послушал вступление и понял, что перед изучением первого курса нужно пройти практически все остальные курсы по обучению, так как курс Создание сайта основывается на знаниях, которые можно получить в остальных уроках.

Итак. Для начала нужно пройти Курс по HTML. Давайте сразу договоримся, в списке уроков я не буду указывать первый урок, который всегда называется Вступление и большой смысловой нагрузки не несёт. Автор обычно знакомит читателя слушателя с определённой технологией и указывает на её преимущества и возможности. В конце пункта указаны изученные в уроке тэги. Также в уроках изучаются и свойства тэгов.

1. Основы и каркас страницы. – Тут даётся понятие тэгов и их атрибутов, а также описана структура страницы и мета тэги. Тэги: html, head, title, body, meta (кодировка, keywords, description).
2. Работа с текстом. – Разбивка на абзацы, выравнивание, выделение заголовков. Тэги: p, h1.
3. Создание списков. – Виды списков и их атрибуты. Тэги: ul, ol, li.
4. Форматирование текста. – Шрифт, размер и цвет текста. Выделение текста жирным и курсивом. Тэги: font, strong, em.
5. Дальнейшее форматирование текста и вставка изображений. – Здесь рассматривается логическое выделение и вставка картинок. Также рассмотрена вставка линий. Тэги: div, img, hr.
6. Работа с гиперссылками. – Рассмотрена работа со ссылками. Конструкция ссылки, виды ссылок. Работа с якорями (линк для перехода внутри страницы). Теги: a.
7. Таблицы. – Работа с таблицами: создание, объединение ячеек и столбцов. Тэги: table, tr, td.
8. Фреймы. – Работа с фреймами. Тэги: frameset, frame, noframes.
9. Внешние объекты и JavaScript в html странице. – Вставка внешних объектов и javascript в html код. Вынос скриптов в отдельный файл.
10. Работа с формами. – Понятие форм. В данном уроке рассмотрено составление формы на примере формы отправки заказа на e-mail. Автор уделил особое внимание данному вопросу, поэтому элементы форм рассмотрены до мельчайших подробностей. Также вместе с автором читателю предстоит написать скрипт на php для отправки e-mail с помощью формы. Тэги: form.
11. Анализ сайта. – Данный урок полностью посвящён умению прочитать html код уже существующей страницы. Для примера использована главная страница сайта rupay.com. На данный момент сайта по этому адресу вы не увидите, поэтому просто смотрим ролик и внимаем.

В качестве вывода: данный курс будет очень полезен человеку, не знакомому с языком гипертекстовой разметки. Информация изложена максимально доступно и наглядно. В качестве бонуса могу добавить небольшой справочник тэгов HTML [] от Вадима Ласто. Упор при создании этого справочника/учебника делался на краткость и компактность. И хотя в нём рассматривается уже устаревшая 3.2 спецификация HTML, думаю, он будет вам полезен. А также выкладываю небольшой самоучитель по HTML[] от Влада Мержевича. Кроме уроков там есть вопросы и задания, которые нужно пройти для закрепления знаний.

Далее нам предстоит пройти вместе с автором Курс по CSS. Это очень интересная для меня технология, поэтому я лично довольно много внимания уделил именно ей. Изученные свойства здесь я решил не указывать.

1. Знакомство с CSS. – Здесь вы научимся создавать таблицы и присоединять их к html файлам. Также дано понятие классов и основы применения стилей.
2. Усложняем конструкции CSS. – Применение стилей сразу к нескольким тегам, применение стилей к вложенным тегам, понятие псевдоклассов.
3. Оформление текста. – Учимся изменять параметры, влияющие на отображение текста. Шрифт, выделение, жирность и прочее.
4. Работа с фоном. – Свойства фона: повторение, позиционирование в любой точке экрана, фон с помощью цвета, фон с помощью изображения.
5. Работа с текстом. – Выравнивание, выделение, украшение и трансформация текста.
6. Работа с рамками. – Виды и свойства рамок.
7. Отступы, поля, обтекание элементов. – Свойства отступов, полей, обтекание элементов.
8. Списки с помощью CSS. – Свойства списков. Изменение отображения.
9. Позиционирование. – Учимся размещать объекты в любом месте экрана с помощью CSS.
10. Альтернатива и автоматизация. – Альтернативные методы вставки стилей в html код. Автоматизация CSS с помощью программ.

В качестве вывода: курс подробен и лёгок для понимания, как и прошлый. Наглядность - главный козырь Попова. Для более детального изучения синтаксиса CSS могу посоветовать вам этот линк. Там следует выбрать раздел CSS по шагам и внимать написанному. Для изучения всех свойств с примерами можете использовать данный линк. Там же можно узнать какими браузерами поддерживается конкретное свойство. Или можете скачать эту книжку [] для того, чтобы не быть привязанным к Интернету. Изложенная информация идентична.

На сегодня пожалуй хватит. На днях читайте о продолжении обучения. Будет рассмотрен курс о программе Macromedia Dreamweaver. А также будет представлен мой первый экзамен. Имеется в виду, применение на практике навыков, полученных в первых трёх курсах. Кстати этот пост тоже написан в Macromedia Dreamweaver ;) До новых встреч!

--------------------

Хочу обратить внимание на блог Alternative Internet Project. Там можно найти статьи на темы: PHP-скрипты, софт, программы, SEO.

Павел, автор блога "Продвинем вместе свои сайты" объявил Мини-Конкурс: Баннер-креатив.

Также хочу сообщить, что СЕОшник раздаёт постовые.

И напоследок, хотелось бы представить вам Блог о верстке, творчестве и фрилансе Ильи Житенёва.

Хотите обменяться постовыми? Пишите в мыло или аську.

Продолжаю главную тему блога - самообучение. В прошлый раз мы рассмотрели первую книгу Владимира Бывалова, теперь изучим вторую.

Книга 2: Курс веб-дизайнера и более глубокое освоение HTML

Книга рассказывает о веб-дизайне от составления макета в Adobe Photoshop, нарезки заготовки в Adobe ImageReady до вёрстки html в Adobe DreamWeaver. Также в качестве дополнения рассматриваются вопросы создания анимированных баннеров, работы с FTP и др. Что порадовало, так это то, что книге рассмотрена как табличная, так и блочная вёрстка.

Итак, приступим к изучению данного мануала. Я хотел опубликовать подробные примеры созданных по мотивам уроков картинок и страниц, однако автор запрещает даже частичную публикацию своей книги, поэтому за примерами можно стукнуть в ICQ 380540двести. В тексте я буду указывать, где должны быть примеры, однако доступ к ним получат не все.

Разновидности сайтов.

В начале автор рассматривает разновидности дизайна сайтов и наиболее распространённые схемы построения. Также попутно мы учимся делать "резиновый" дизайн. Имеется в виду, дизайн, который не зависит от разрешения монитора. То есть, при растяжении окна, растягивается и шаблон сайта. В конце урока каждый ученик будет иметь 2 подобных примера реализации эффекта "резины": примеры 1-2.

Основы дизайна.

Далее автор знакомит читателя с основами дизайна. Рассказывает о тёплых и холодных цетах, триколорах и наиболее подходящих цветовых схемах, контрасте...

Adobe Photoshop в примерах.

Вначале автор знакомит читателя с программой и её особенностями.

Далее шаг за шагом читатель вместе с автором создаёт свой дизайн. Каждое действие, каждая мелочь описана на пальцах. Автор знакомит читателя с программой Photoshop на практике. Показывает сначала инструмент или функцию, действие, а потом результат, попутно объясняя смысл происходящего. Так постепенно создавая дизайн своего сайта вы будете знакомиться с Фильтрами, Основными инструментами, Слоями.

Чему конкретно вы можете научиться? Иметь понятие, что такое Photoshop, как с ним работать, знать основные (точнее, нужные) функции, а также сможете создавать довольно неплохие дизайны сами. Автор публикует более менее универсальный алгоритм создания дизайна.

Я также нарисовал заготовок за время изучения урока по программе Photoshop (пример 3). И заверю вас, это вовсе не трудно, зная примерную последовательность действий.

Чему мы научимся (в общих чертах):

• работе со слоями (создание, комбинирование, редактирование)
• работе с форматированием (порезка, выделение, рисование)
• работе с текстом (форматирование)
• работе с цветом (форматирование контраста, цвета, заливка, градиент)
• работе с объектами (трансформирование, изменение свойств)

Последовательность создания заготовка я также не могу открыть. Для этого нужно ознакомиться с книжкой.

Порезка шаблона.

Далее вам предстоит научиться выполнять порезку макета на куски с помощью программы Adobe ImageReady. Кстати, программа выдаёт после порезки готовую html страницу, состоящую из кусков картинок.

Правка HTML.

После порезки можно приступить к правке html-кода страницы. Для этого в уроке используется программа DreamWeaver. Однако можно воспользоваться и обычным блокнотом.

На выходе из ImageReady и правки пары тэгов наш пример выглядит так, как html страница, состоящая и определённого количества картинок, оптимизированных для размещения в Internet (пример 4). Картинки лежат в отдельной папке images.

Далее оттачиваем html код. Режем верхнее меню и футер, добавляем текст, добавляем боковое меню и оснащаем наше творение цветами, бэкграундом и всяческой красотой (пример 5).

Однако наш сайт свёрстан одной таблицей, что грозит всяческими осложнениями в дальнейшей жизни. При не очень умелом подходе картинки будут разъезжаться, таблицы ломаться, а также при изменении одной части нашего сайта придётся обязательно редактировать и остальные. К примеру, изменив ширину бокового меню, получим вот такую некрасивость, как съехавшую влево шапку сайта (пример 6). Поэтому далее мы учимся делать сайт состоящий из нескольких таблиц, чтобы избежать подобных казусов (пример 7).

Конечно, мы получаем ещё не полноценный сайт, однако это уже готовый шаблон для добавления контента, ссылок в меню и прочего. Ну и конечно следовало бы немного приукрасить наше творение (добавить отступы и т.д.). Однако основное сделано.

CSS и блочная вёрстка.

Далее нам предстоит узнать, что такое CSS и с чем его едят, а также немного о блочной вёрстке. Это была наиболее интересная для меня часть, ведь я хочу постигнуть именно блочную вёрстку.

После первого же урока можно приукрасить свою страничку (пример 8). Мы всего лишь добавили таблицу стилей CSS, а также некоторые теги (заголовки, ссылки и параграф).

Далее идёт более подробное описание, как вставить таблицу CSS в html страницу, и какие операторы можно использовать. Ничего секретного. Тоже можно прочитать на любом сайте, посвящённом каскадных таблиц в разделе "Основы". Однако этот курс ориентирован на новичков, поэтому всё уместно.

После более детального изучения CSS, можно получить понятие, и сразу же попрактиковаться в создании своего первого блочного дизайна (Пример 9).

Вот собственно и всё. Далее идут бонусные статьи о создании анимированных баннеров, использовании FTP, наиболее частых ошибках в дизайне, дополнения у разделу о Photoshop, а также программы, бонусы, шрифты, фильтры, шаблоны. В общем целая куча всего.

Подводим итоги: Что можно сказать о данном ебуке. Для начинающего она очень даже будет интересна. Глубоких знаний знаний вы не постигнете, однако пинок под зад получите. И если вам действительно интересно изучение веб-дизайна и создание веб ресурсов, то курс не пройдёт для вас зря. Вы получите основы и стремление постигать и совершенствоваться. Напоминаю: данный курс стоит 24.95 $. Стоит ли он своих денег? Решать не мне. Каждому он будет полезен по разному. Если у вас уже есть понятие о тех вещах, которые там изложены, пожалуй не стоит покупать. Если же вам лениво искать информацию самому, то курс поможет вам понять основы. Но учиться дальше предстоит вам самим.

Далее мы будем рассматривать курс видео уроков от Евгения Попова. Это будет более серьёзный опус и потребует на обучение не один день. Также я постараюсь выкладывать статьи по SEO и манимейкерской тематике.

--------------------

Хочу обратить внимание на дайджест полезняшек от Virtual Lab.

А также напоминаю, что Vitashok предлагает сносить нафиг блогролл.

Также хочу упомянуть сервис, который предлагает SEO продвижение статьями. Сервис предоставляет услуги по написанию, размножению и размещению статей в сетках.

"Учиться, учиться, ещё раз учиться!", как завещал Великий Ле.

Как и писалось здесь я начал обучение с обзора электронных книг Ольги Александровой и Владимира Бывалова. В данном посте стиль повествования в основном будет сухой и скудный, потому как это не что иное, как выписки из моей рабочей тетради.

Итак, рассмотрим проекты Ольги Александровой. Назовём подпункт "Основы инфо бизнеса"

Сайт автора: lentay.net
Кратко о книгах: Теория и практика элементарных вещей для ПОЛНЫХ нубов! Написано ОЧЕНЬ просто и понятно.

Книга "Где живёт ваш сайт". – Понятия домена, хостинга, примеры размещения сайта на бесплатном (hotbox.ru) и платном хостингах (jino.ru).

Книга "Как в интернете заработать лентяю" 1 – 2 тома.

1 том – Основы и понятия одностраничных сайтов, "умных" рассылок, платёжных систем, сетевого маркетинга, финансовых пирамид. Вдобавок получите кучу реф. ссылок, рекламу своих и прочих "полезные" проектов.

2 том – Понятие и компиляция электронных книг, автоматизация электронных платежей посредством сервиса RoboKassa, размещение файлов на бесплатном хостинге (hotbox.ru), организация "умных" рассылок посредством сервиса smartresponder.ru, установка на сайт счётчика (на примере счётчика от Mail.ru), основы рекламы ресурса (регистрация в поисковых системах, размещение объявлений на досках, реклама в почтовых рассылках сходной тематики, системы обмена посетителями, реклама в бесплатных электронных книгах, общение в форумах, дискуссионных листах, группах новостей, подпись в письме, ведение собственной почтовой рассылки, массовая рассылка поздравительных открыток).

Вывод: книгу стОит покупать и читать, если хочется быстро научиться основам инфо бизнеса. Книга максимально проста, разобраться с ней сможет любой.

В качестве примера, могу показать тестовый сайт, героически созданный во время изучения данного ебука. Только RoboKassa не работает, к сожалению (платежи принимать не могу). Нужен персональный аттестат Webmoney. Честно говоря, на практике сделал не все шаги, ибо было лениво. Элементарные вещи так не хочется делать. В общем, на сайте примере, подписавшись на рассылку, получите книгу от самой Ольги, и денежку ей платить будите, если надумаете покупать вторую часть. Мне этот бизнес не интересен.

Далее рассмотрим книги Владимира Бывалова. Подпункт под названием "Первое знакомство с html"

Сайт автора: moneymaster.ru
В разделе вёрстки рассмотрены будут книги 1 и 2. В книгах идёт речь о заработке на СВОИХ сайтах. Написано довольно просто и незамысловато.

Книга 1 (бесплатная): "Общие моменты электронной коммерции и заработка в интернете. Основы HTML".

В книге действительно идёт речь об основах заработка на СВОИХ сайтах. Также опровергается тезис о том, что в интернете можно заработать на халяву и без каких-либо знаний. После чего на примерах объясняются основы HTML, а именно структура страницы и базовые теги (html, body, head, title, br, font, center, img, b, i, h1-6, a, table, tr, td) с некоторыми их параметрами. Далее идёт объяснение базовых понятий об электронных платёжных системах.

Чему можно научиться из этой книги относительно вёрстки:

• Создать каркас будущего сайта
• Раскрасить страницу и текст
• Выровнять текст по центру
• Форматировать текст жирным и курсивом
• Изменить размер шрифта
• Вставить картинку
• Вставить ссылку
• Использование таблиц
• Создать двухстраничный сайт.

Для более наглядного примера далее приведём некоторые странички, которые вы создадите в течении 5-10 минут за время обучения.

• Пример 1 - Ваша первая страничка в интернете. В ней для наглядности использованы различные теги.
• Пример 2 - Создание макета будущего сайта с помощью таблиц.
• Пример 3 - Оформление макета.
• Пример 4 - Результат. Двухстраничный сайт о заработке в интернете.

Читайте о второй книге Бывалова в следующих выпусках. Подробно с примерами.

--------------------

форум раскрутка сайта

Бенгальские котята, продажа кошек