Рассылка начинающему web-мастеру.

Сегодня в выпуске:

• Новости
• Новая статья
• Рубрика "Интересные программы"
• Рубрика "Вопрос в рассылку"
• Новости форума

Новости:

(c) it4all
  _"Лучше поздно, чем никода…" - глядя вслед уходящего поезда.
 Несмотря на пору отпусков на меня свалилось немало работы, поэтому выпуск пришлось несколько отложить. Но постоянные демонстрации под моими окнами с плакатами "Рассылку!! Рассылку!!", заставили меня сесть и сделать вполне полноценный выпуск.

Продолжаем цикл статей по созданию сайта с нуля. Все замечания и предложения сюда: it4all@yandex.ru

   Прежде чем вы начнете читать очередную статью, хочу сказать следующее:
в мой адрес, пришло несколько писем с укорами в том, что сайт, который я описывал в последних статьях "International Football", покоящийся на "Народе", имеет некоторые огрехи в дизайне и верстке.
Дело в том, что я не занимался версткой всего ресурса, а только его единственной страницы, которую собственно и описываю. Сам сайт, который переехал на более качественный хостинг и теперь расположен по адресу - http://interfootball.net.ru/ , верстал его хозяин Jurgan. Большая просьба - пройтись по данному ресурсу, найти недочеты и указать на них его хозяину.
   Помогите парню превратить его хомячек в серьезный полноценный ресурс!

---

Практика web-дизайна. Часть пятая.

Полная версия статьи с иллюстрациями: http://www.it4all.h10.ru/int.php?cat=intro&num=9

   Ну вот мы и подобрались к самому главному - верстке нашей страницы, в редакторе.

   Как говорят нам с экрана телевизора разные потные мужики - "Я перепробовал много шариковых дезодорантов, но только один пришелся мне по вкусу. Теперь мой пот пахнет свежестью". Я вот тоже перепробовал много различных редакторов, но теперь пользую только различные версии "Dreamveawer" от Macromedia. Это совсем не реклама, просто этот редактор, более - менее удобен в использовании, имеет много различных средств ускоряющих создание сайтов (не страниц, а целых сайтов), генерит приличный HTML-код, и имеет еще множество полезностей, о некоторых из них я упомяну далее.

   Прежде чем начать верстку рекомендую снова открыть уже нарезанный эскиз в "Adobe ImageReady", делать с ним ничего не нужно, просто нам понадобится наглядное пособие. Нарезанные "слайсы" при нашей верстке займут свои места в ячейках таблиц, поэтому увидеть структуру этих таблиц можно, глядя на нарезанное изображение. Описывать всю нудистику верстки я не стану, это будет скорее краткий экскурс в возможности "Dreamveawer"(версий МХ или 4).

    Многие допускают ошибку, и делают страницу из нескольких независимых таблиц, в результате чего, нередко при "резиновом" дизайне, каждая таблица ведет себя по-разному. Создадим основную таблицу (таблица верхнего уровня) для нашей страницы - щелкнем по соответствующей пиктограмме в меню "Objects" или сочетанием клавиш "Ctrl+Alt+t", и в появившемся окне "Insert Table" введем необходимые параметры таблицы.

   Если посмотреть на нашу нарезку, то видно, что "шапка" у нас нарезана на две строки с разными столбцами, затем идут меню (вертикальное и горизонтальное), а также текстовой блок, со своим набором столбцов, и в низу будет еще одна табличка, образующая "footer" (на десигнерском жаргоне "подвал") страницы. Из этого следует вывод, что основная таблица будет состоять из 4 строк и 1 столбца, шириной 100%, и нулевыми размерами внутренних полей.

   Для первой строки нам понадобится таблица с 1 строкой и 8 столбцами, шириной 100 %. Крайний левый столбец у нас будет занимать картинка с именем "left_top_row.gif" и шириной в 396 пикселей, перейдем в "Dreamveawer", создадим табличку аналогичным способом, и зададим ширину столбца 396 пикселей.

    Щелчком по пиктограмме "Images" из окна инструментария "Insert", или сочетанием клавиш "Ctrl+Alt+i", откроем диалоговое окно и выберем картинку с нужным именем, а если имя вы забыли к вашим услугам "Image Preview", где будет показано нужное изображение.

   Далее у нас идет динамический столбец, в нем будет расположен фоновый фрагмент, и его ширину задавать не нужно. "Dreamveawer" автоматически создает в пустых ячейках спец символ " " (не разрывный пробел - "non-breaking space"), это необходимо, чтоб все типы браузеров не считали эту ячейку пустой и отображали ее.
Для вставки фонового изображения в окне "Properties" перейдите к полю "Bg" и щелкните по желтенькой папке, и в таком же окне выберите то, которое у вас пойдет в качестве фона к ячейке.

   Расскажу более подробно, как пользоваться окном "Properties" для задания параметров кнопкам из верхнего горизонтального меню. Итак, мы вставили в ячейку изображение кнопки (предположим "На главную"), оно у нас выделено, а также выделен тег "<img>" в строке иерархии тегов, а в окне свойств появились размеры изображения (окошки W и H), его источник "Src". Зададим еще несколько параметров, "Link" - здесь вводится URL страницы, на которую мы перейдем, нажав на эту кнопку, заметьте, что сразу после этого в поле "Border", программа услужливо поставила за нас "0", и теперь рамка вокруг изображения-ссылки не отразится в браузерах. Не забудьте ввести альтернативный текст в поле "Alt" (это относится ко всем изображениям), и тогда если данное изображение не загрузится у пользователя, по тексту будет понятно чего он не увидел.

   Поле "Align" (центровка) в данном случае можно оставить по умолчанию ("Browser Default"), потому как размеры ячейки и ее содержимого у нас совпадают.
   Поле "Target" (цель), которое указывает, в каком окне будет открываться страница по ссылке, тоже оставим по умолчанию, тогда новые страницы будут показываться в этом же окне. Но если нужно новое окно, тогда выберите из списка "_blank", остальные "_self, _parent, _top", нужны для страниц с фреймовой структурой.
   Все остальные поля (значения которых мы возможно рассмотрим в будущем) оставьте не заполненными.

Крошечный помощник.

   В папке, которая хранит наши нарезанные кусочки, вы может уже заметили файл с именем "spacer.gif"с изображением размеров 1х1 пиксель. Его услужливо нам создала программа "Adobe ImageReady", он очень помогает при верстке, когда нужно сделать ячейки в таблице строго определенных размеров (к примеру, пустая ячейка с символом "&nbsp;" не может быть меньше по высоте, чем размер шрифта выбранного для вашей страницы, т.е. приблизительно меньше 10 пикселей). Поясню на живых примерах

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

1. верхние и нижние три ячейки я объединил, выделив все три ячейки и нажав на пиктограмму "Merges selected cells using spans" в разделе "Cell" окна "Properties", тоже самое можно сделать, щелкнув правой кнопкой мыши на выделенных ячейках и выбрать "Table -> Merge Cells", в результате код столбца должен иметь вид - <td colspan="3">;
2. в объединенные ячейки (сверху и снизу) вставил таблички, с графикой предназначенной оформить эти блоки;
3. вот код центральной строки -
   <tr>
         <td bgcolor="#A7A7A7" width="3" ><img src="images/spacer.gif" width="3" height="1"></td>
         <td align="center" width="138">&nbsp;< /td>
        <td bgcolor="#A7A7A7" width="3" ><img src="images/spacer.gif" width="3" height="1"></td>
   </tr>
   из него следует, что крайние столбцы имеют серый цвет, и включают в себя нашего помощника заданной ширины в три пикселя. Как видите, я не пренебрегаю задавать все параметры ширины, и столбца и изображения, это позволит сохранить намеченные пропорции, даже если пользователь отключит загрузку изображений;
4. теперь мне остается только вставить готовую заготовку в те места, где это необходимо и заполнить информацией свободный столбец (который пока включает символ ""&nbsp;"), это может быть текст, или еще одна таблица с информацией.

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

Ударникам HTMLного труда посвящается !

    Весьма частенько приходится обращаться к коду верстаемой страницы, и править вручную некоторые "грешки" которые иногда допускает "Dreamveawer" (ой как не правы те, кто сказал, что можно не учить HTML). Для этого нужно переключить главное окно дизайна либо в положение "Show Code View", либо в "Show Code and Design View", тогда окно "верстака", разделится на два, и вы имеете возможность наблюдать визуально все вносимые вами изменения.

   Для введения тега, нужно в окне кода нажать "Shift+<" и перед вами предстанет большой список всех тегов из спецификации HTML 4.0., выбрали и вставили нужный тег, нажмите на пробел и имейте возможность выбрать все присущие только данному тегу атрибуты. Предположим нужно задать цвет для тега "<td>", пожалуйста, перед вами вся интерактивная палитра красок.
   Или сделать ссылку, выбрали "href=" и получите список всех доступных на сегодня протоколов. Закрыли тег клавишами "Shift+>" и программа сама добавит закрывающий, парный тег!! Такого нет в "CuteHTML" и во многих других более современных редакторах кода, "Dreamveawer МХ" прямо рай для верстальщика ;)

Не подумайте только, что я призываю к мазохизму - верстать страницы вручную, в следующих статьях мы продолжим обзор удобств программы "Dreamveawer МХ", рассмотрим особенности работы с текстом, создание стилей для сайта, введем ключевые слова и некоторые другие метаданные.

Я, чтоб вы особо не скучали до выхода следующей части, рекомендую скачать и поизучать "Справочник по DreamWeaver MX v0.3"
по адресу - http://rupor.net/DW.

 

---

Интересные программы

    Хочу предупредить, что в данном выпуске даны, только последние поступления программ, на самом деле их намного больше, намного. Скорость, с котрой Джуди находит и поставляет на "Вэбстудент" интересные программы, сравнима со скоростью, с которой Анка-пулеметчица раздавала пули белогвардейцам из своего пулемета.
Заходите, смотрите, скачивайте, программ туча от игрушек до весьма сурьезных и полезных.

Business Card Designer Plus 7.5.5.0
Хорошая прога для быстрой разработки визиток. Мастер по изготовлению визиток проведет Вас от самого начала, до печати визитки . За 5 минут можно сделать полноценную визитную карточку, что характерно - бесплатно.
3.03 MB Win 9*/ME/NT/2K/XP, Free, RU
Скачать :http://webstudent.net.ru/modules/mydownloads/visit.php?cid=63&lid=416

FlashFXP 3.0.0 RC4 Build 1010
FTP-клиент, работающий в многозадачном режиме с
поддержкой докачки, перекачивания файлов с сервера на сервер, синхронизации каталогов, работой по протоколам SSL/TLS, поиском по удаленному FTP-серверу, возможностью импортировать списки любимых серверов из большинства распространённых программ и очень многими другими полезными опциями.
Русификатор:
http://e2ard.narod.ru/download/FlashFXP_v3.0_RC4_Build_1010_Rus.rar
2.20 MB Win 9*/ME/NT/2K/XP, Shareware, RU/EN
Скачать :http://webstudent.net.ru/modules/mydownloads/visit.php?cid=76&lid=415

FTP To Text v. 1.0.0.1b
Сканирует директории на ftp сервере и создаёт список файлов в виде текстового файла.
330.00 KB Win 9*/ME/NT/2K/XP, Free, EN
Скачать :http://webstudent.net.ru/modules/mydownloads/visit.php?cid=12&lid=414

SpirDial
Звонилка для Windows 95/98
Особенности:
1. Имеет небольшой размер и занимает немного места в памяти
2. Умеет прятаться в tray
3. Перезванивает, если линия занята
4. Пересоединяется, если произошел разрыв связи
Только на английском языке
85.00 KB Win 9*/ME/NT/2K/XP, Free, EN
Скачать : http://webstudent.net.ru/modules/mydownloads/visit.php?cid=12&lid=413

Tarma Installer Pro v.2.77.1590
Это, хорошая программа для создания инсталляционных пакетов для ваших программ. Огромное количество опций по настройке установки, возможность подключения DLL, хорошая компрессия. Программа имеет очень простой интерфейс в виде мастера. Работает с win.ini и реестром. Можно добавить в инсталлятор Readme. Выставить обязательную перезагрузку - пользователь на финише получит окно с предложением либо перезагрузиться, либо отложить перезагрузку на потом. Есть проверка правильности написания инсталлятора перед компиляцией. Можно не регистрировать инсталляцию в Установке и удалении программ Windows.
1.23 MB Win 9*/ME/NT/2K/XP, Shareware, EN
Скачать : http://webstudent.net.ru/modules/mydownloads/visit.php?cid=19&lid=412

Blindwrite v.5.1.7.135
Это пакет программ для копирования CD. Blindread поддерживает создание образов CD следующих форматов :ISO, CUE, BWT, поддерживает запись "на лету" WAV и MP3 файлов, а также запись образов CD следующих форматов : ISO, CUE, BWT, WAV, MPG, MP2, MP3. Данная программа позволяет создавать и копировать практически любые CD диски, в том числе и защищенные. Пакет состоит из двух модулей - BlindRead и BlindWrite,соответственно отвечающих за чтение и запись. Программой поддерживаются большое количество IDE, SCSI, USB, USB 2.0 и 1394 пишущих приводов, а благодаря использованию драйвера Patin-Couffin обеспечивается работа PNP и горячее подключение/отключение устройств. Blindwrite Suite может работать в DAO, SAO и RAW режимах, а также производить запись On-The-Fly. Модуль BlindRead умеет работать с образами дисков типа ISO, CUE и BWT. Есть возможность создания аудио CD напрямую из MP3 файлов и совместной работы с программами-эмуляторами CD, такими как Daemon Tools. Включает русские языковые модули.
2.04 MB Win 9*/ME/NT/2K/XP, Shareware, EN
Скачать : http://webstudent.net.ru/modules/mydownloads/visit.php?cid=64&lid=411

Power Video Converter v.1.1.3
Прога конвертирует из одного видео формата в другой, поддерживаются следующие операции преобразований: AVI в DVD, MPEG1, MPEG2, VCD, SVCD все форматы так же можно преобразовывать в MPEG4, AVI, PAL-TO-NTSC и наоборот. Так же программа позволяет конвертировать ваши мультимедийные файлы в последовательность изображений или наоборот, из картинок сделать видео файл.
2.40 MB Win 9*/ME/NT/2K/XP, Shareware, EN
Скачать : http://webstudent.net.ru/modules/mydownloads/visit.php?cid=48&lid=410

Ace Video Workshop v.1.4.19
Прога для конвертирования AVI файлов в VCD/DVD/SVCD/DIVX, MPEG файлов в AVI, DIVX, "склеивание" AVI, MPEG файлов, изменение формата у MPEG файлов, экспорт из AVI, MPEG файлов аудио и сохраненение его в WAV или OGG формате, возможность снятия скриншота с видео-файлов с сохранением в JPG,BMP,TGA,PNG,TIF,PCX форматах, кроме того, есть 10 различных видеоэффектов.
2.38 MB Win 9*/ME/NT/2K/XP, Shareware, EN
Скачать : http://webstudent.net.ru/modules/mydownloads/visit.php?cid=50&lid=409

---

Вопрос в рассылку

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

Присылайте свои вопросы на адрес it4all@yandex.ru

вопрос № 22.

Как склеивать и резать файлы *.mpeg не конвертируя формат, а сохранять в том же формате? С форматом *.avi прекрасно работает программа Virtualdub. Какую программу использовать для *.mpeg, если можно, то подскажите ссылку на неё?

Ответ от it4all: Возможно вам поможет последняя программа из списка новых поступлений, приведенного выше, я имею в виду Ace Video Workshop v.1.4.19. Судя по описанию это то, что вам нужно.

Новый вопрос № 23.
Имеется домен: domain.ru и сайт на определенном хостинге. Внезапно я меняю хостинг, как мне прикрепить сайт на новом хостинге к уже имеющемуся домену.
Ответить.

Новый вопрос № 24.
У меня на сайте установлена поисковая форма (есть форма по сайту, есть форма книжного магазина). Как мне сделать, чтобы результаты поиска выводились в отдельном окне?
Ответить.

Новый вопрос № 25.
1. У меня есть своя рассылка. Как её раскрутить (увеличить количество подписчиков) ?
2. Третий выпуск подряд пытаюсь сделать FAQ - побудить подписчиков присылать в рассылку свой вопросы и, соответственно, ответы на другие вопросы. Ни одного вопроса, ни одного ответа. Как быть в этой ситуации ?
Ответить.

Хочу задать вопрос!

---

Последние темы форума:

Форум Тема Ответов Просмотров Последнее сообщение Обсуждение сайтов Оцените сайтик:)) 10 54 22/07/2004 4:34 dzudi Теория Web-design'a Как найти инфу раньше других ??? 3 11 22/07/2004 0:15 Islander Мастерская по ремонту и изготовлению сайтов Помогите улучшить сайт 38 85 22/07/2004 0:06 it4all ICQ Правда про ICQ 7 114 21/07/2004 19:45 Crystall Хостинг Ищу бесплатный хост с MySql!!!СРОЧНО!!! 2 8 21/07/2004 19:38 Crystall Мастерская по ремонту и изготовлению сайтов Что надо Internet'у? 9 25 21/07/2004 12:40 maler Графические редакторы То, чего никто не знает в Photoshop... 1 11 21/07/2004 12:03 it4all Online-учебники Кирсанов 3 17 21/07/2004 10:59 illukman Мастерская по ремонту и изготовлению сайтов Правила. И не говорите потом, что не читали. 2 82 20/07/2004 22:15 Crystall Обсуждение сайтов http://www.jobsearcher.ru 1 10 20/07/2004 16:24 it4all Посмотреть новые сообщения Найти непрочитанные сообщения