Все кто устанавливал форум phpBB, знают как быстро его находят спам-боты и начинают постить свои непристойные объявления по 50 - 100 сообщений за сутки   Не помогает даже капча и подтверждение регистрации через мыло - все это боты прекрасно умеют делать.

Надеоело!!!?

Предлагаю вам 100% -ое средство для защиты от вредителей - Anti Bot Question Mod v.3.0.0.

(далее…)

Как-то мне нужно было сделать баннер с мигающим текстом, как работать с фотошопом я еще толком не знал, попалась мне такая программка Gif Animator. В этой программе можно быстро сделать анимированную картинку, но вот только нужны покадровые снимки -это минус этой программы в остальном программа очень проста.

Рабочее окно программы:

Скачать Gif Animator Скачали 67 раз

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

Форма состоит из 2-х файлов. В одном файле форма для ввода сообщения, второй файл предназначен для отправки сообщения на ваш e-mail.

Форма абсолютно простая и легко вставивается в любой дизайн.

Скачать форму обратной связи Скачали 344 раз

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

(далее…)

Почему дивный? В хтмл есть такой тег, поэтому и дизайн стали называть дивным DIV-ный дизайн отличается от табличного тем, что в данном случае используются слои (блоки), которые располагаются на странице в определенном порядке. Порядок, положение и размеры слоев задает отдельный файл .css

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

На рисунке ниже видно, что использовано 4 блока:
1 - основной, вмещает в себе три остальных
2 - шапка сайта
3 - меню
4 - контент
По сравнению с рисунком выше видно, что блоки независимы в размерах друг от друга, их размеры и положение можно изменять независимо от других блоков (слоев), чего не скажешь о таблице, где каждая ячейка зависит от рядом стоящей.

Дивный дизайн имеет ряд преимуществ в отличие от табличного:

- дизайн всего сайта можно менять в одном файле .css (размеры, положение, цвета и др.)
- код страницы:
а) не содержит лишних тегов, что облегчает вес файла страницы (кб)
б) легко находить нужные фрагменты страницы
в) способствует лучшему индексированию поисковыми системами

Посмотрим на хтмл-код страницы с табличным дизайном:

<table border=0 cellpadding=0 cellspacing=0 width=500 height=295>
<tr>
<td height=75 valign=top colspan=3 bgcolor=#FDE2CC>Шапка сайта</td>
</tr>
<tr>
<td height=19 colspan=3></td>
</tr>
<tr>
<td width=140 valign=top bgcolor=#EEB6B6>Меню</td>
<td width=25></td>
<td valign=”top” bgcolor=#B9BBF1>Контент</td>
</tr>
</table>

А теперь посмотрим хтмл-код с дивным дизайном:

<link rel=stylesheet href=style.css type=text/css>
<div id=page>
<div id=logo>Шапка сайта</div>
<div id=menu>Меню</div>
<div id=content>Контент</div>
</div>

Как видите хтмл-код с дивным дизайном намного проще, а результат ощутим! Но, обратите внимание, что в коде дивного дизайна присутствует строчка:

<link rel=stylesheet href=style.css type=text/css>

Эта строка говорит о том, что все стили для этой страницы хранятся в файле style.css (таблица стилей). То есть, если в табличном дизайне для таблицы высота и ширина задаются так:

<table width=500 height=295>

то в дивном дизайне они задаются в файле style.css, в таблице стилей. Для кода дивного дизайна приведенного выше файл style.css содержит следующие строки:

/* таблица стилей */
/* задаем размер страницы */
#page { width:500px; height:100% auto; margin: 10px; }
/* задаем размещение блоков */
#logo { float:left; width:500px; height:50px; background:#FDE2CC }
#menu { float:left; width:150px; height:170px; background:#EEB6B6; margin-top: 10px }
#content { float:right; width:340px; height:200px; background:#B9BBF1; margin-top: 10px }

или если без сточек с пояснениями, то так:

#page { width:500px; height:100% auto; margin: 10px; }
#logo { float:left; width:500px; height:50px; background:#FDE2CC }
#menu { float:left; width:150px; height:170px; background:#EEB6B6; margin-top: 10px }
#content { float:right; width:340px; height:200px; background:#B9BBF1; margin-top: 10px }

Разберем что значит первая строка:

#page { width:500px; height:100% auto; margin: 10px; }

#page - идентификатор слоя (блока)
{ } - в скобках указывают все параметры для данного слоя
width:500px - задание ширины слоя
; - точка с запятой разделяют параметры
height:100% auto - задание высоты слоя
margin: 10px - задание отступов со всех сторон

в других строках таблицы стилей использованы:

float:left - выравнивание слоя по левому краю
background:#FDE2CC - задание цвета для фона слоя
margin-top: 10px - отступ сверху 10 пикселей

Таким образом в дивном дизайне все параметры отображения слоев, текста, изображений, цвет гиперссылок, размеры заглавных букв и других объектов можно задать в одном файле. Если у вас сайт состоит из 100… страниц, и вам вдруг срочно нужно меню сделать на пару пикселей больше, то вы без проблем сделаете это, изменив всего один файл style.css. Для табличного дизайна в таком случае придется изменить все ваши 100… страниц, на это уйдет минимум 100… минут

Как видите DIV-ный дизайн имеет ряд преимуществ, именно поэтому сегодня большинство сайтов строятся именно в таком формате.

Что такое дивный дизайн
Урок 1. Делаем сайт на div-ах (дивный дизайн)
Урок 2. Создание таблицы стилей и привязка к страницам сайта
Урок 3. Задаем цвет фона для слоев
Урок 4. Ширина и высота слоев (div)
Урок 5. Собираем 3 блока в один (в 4-й)
Урок 6. Положение слоев относительно горизонтали
Урок 7. Задание отступов (полей, отбивок) для слоев
Урок 8. Форматирование шрифтов (CSS)Памятка вебмастеру по CSS

Сборник параметров по CSS предназначен скорее для начинающих и содержит основные параметры для форматирования html-страниц с помощью таблиц стилей.

Сборник в разработке…

CSS - справочник
Что такое дивный дизайн
Уроки CSS для новичков
Видеоуроки

Программа Dreamweaver позволяет загружать файлы, созданного на компьютере сайта, на ваш хостинг, для этого достаточно указать ftp-данные. Также в видеоуроке будет рассказано как запретить Дримвеару закачивать файлы и папки, скрывать их.

Скачать видеоурок 4.7 МБ. Скачали 280 раз

В программе Dreamweaver предусмотрена функция автоматического обновления файла на хостинге сразу после того как вы внесли в него какие-либо изменения. Об этой чудесной функции и будет рассказано в этом видеоуроке:

Скачать видеоурок по Dreamweaver 3.3 МБ. Скачали 116 раз

Начинающим и бывалым вебмастерам, создающим темы для WordPress, пригодится наш сборник функций.

Сборник также содержит теги шаблонов ВордПресс.

Скачать сборник функций Скачали 328 раз

Обсудить сборничек можно на форуме

Хотите научиться делать свои темы для ВордПресс - читайте уроки:

Как создать тему для WordPress
Урок 1. Создаем тему для WordPress
Урок 2. Создаем файл index.php
Урок 3. Тег head для блога
Урок 4. Редактирование таблицы стилей
Урок 5. Скриншот для темы WordPress
Урок 6. Тестируем самодельную тему
Урок 7. Функции файла index.php
Урок 8. Функции файла comments.php

Тему для WordPress сделай сам