Раздел "Веб-мастеру". Содержание:

Веб-мастеринг:

 Практика web-дизайна. Часть третья
 Что такое и зачем вам нужна своя WEB-BBS?
 Печатаем по-умному или ещё один способ защиты информации
 Счетчик для вашего сайта
 Список бесплатных хостеров

Веб-кодинг:

 Замечания о некоторых директивах в php.ini

Раскрутка:

 Обмен ссылками: новые объявления

Раздел "Веб-мастеру". Веб-мастеринг:

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

	it4all
	ВебСтудент
	it4all@yandex.ru
	08/01/05

Продолжение. Начало в AboutPC+ #34-35

Как и обещал, расскажу, как делал последнее творение, а именно о переделке дизайна сайта "International Football" (прежде чем читать далее, сходите посмотрите, вам будет намного понятнее), который поступил в нашу "Web-мастерскую".

Так как сайт уже был создан, и имел уже большое количество страниц, то собирать информацию, о нем мне не пришлось, я уже имел практически все "кирпичи" для обновления дизайна:

1) Лого на сайте не было, зато было название - "International Football", и слоган "Футбол в России и за рубежом", отсюда уже было понятно, что сайт посвящен футболу вообще, не привязываясь к конкретной команде.

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

3) На ресурсе было очень большое меню, поэтому мы разбили его на три независимых блока. Блок меню типа "горизонтальный список", содержащий ссылки - "На главную", "Контакты", "Сделать стартовой", "Добавить в избранное", "Карта сайта". По негласному правилу вэб-дизайна, такие ссылки обычно представляют в виде кнопок (иконок), поэтому мы решили не отходить от этого правила.

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

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

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

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

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

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

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

Далее предлагаю вам шампунь - два в одном, статья по дизайну, совмещенная с уроками по "Фотошоп".

Так как на странице особых витееватостей не предусматривалось, я сразу открыл "Adobe Photoshop 7.0." , намереваясь прямо в нем нарисовать все необходимое.Я создал новый файл 780 х 450 пикселей (780 пикселей - ширина страницы для экрана с разрешением 800 х 600), с цветом RGB и прозрачным фоном. В первом же слое дал прямоугольное выделение (780 х 128) и залил его #00902C цветом, получился темно-зеленый прямоугольник предназначенный для шапки страницы. Вы по прошлым статьям знаете, мое отношение к банальным прямоугольникам, ну вот я решил его немного "покорежить", вырезать в нем несколько "гнезд", в которых будут расположены блоки меню.

Итак, у нас три блока меню, и нам нужно равномерно "разбросать" их по странице, главный блок будет расположен в левой нижней части коллажа, сервисное меню (кнопки), я решил дать в правом верхнем углу страницы, и чтоб выделить его еще больше сместил поле для коллажа вниз на 23 пикселя. Как было видно из старого дизайна, "меню чемпионатов" вполне помещалось в экран 800 пикселей по горизонтали и даже оставалось свободное место, решено было разместить этот блок на фиксированном расстоянии от главного меню, при малом разрешении оно выглядит прижатым к правому краю экрана, а при большем, по центру.

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

Рисуем оформление для меню

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

Для этого понадобится 5 слоев (лучше делать его в отдельном окне).

• Слой 5 (самый верхний). Нарисуем зеленый прямоугольник шириной в 132 пикселя (необходимая ширина для вмещения самого длинного пункта меню),высотой в 200 пикселей (высота в данном случае роли не играет). Для этого выберем прямоугольное выделение, фиксированного размера ("Fixed size") и зальем его нужным цветом. Не снимая выделения, выберем инструмент "Карандаш" и зададим нужную толщину (в данном случае один пиксель), затем зажимаем "Shift" и чертим идеальные прямые линии по самому краю прямоугольника. Выделение не позволит случайно выйти за его границы.
• Слой 4. На нем дан прямоугольник с закругленными углами, (а на каждом следующим слое будет аналогичная фигура, большая предыдущей приблизительно на 3 пикселя с каждой стороны) зеленого, белого ,серого и снова белого цветов (последний цвет фона, чтобы отделить блоки от шапки). Итак , выбираем инструмент "Rounded Rectangle Tool" ("Прямоугольник с закругленными углами") и из трех опций выбираем "Fill pixels" ("Залитое краской"), дальше жмем на стрелочку выпадающего меню "Geometry options", и в нем выберем "Fixed Size". В активизировавшихся окошках введем 138 в ширину (больше предыдущего на 3+3 пикселя по бокам) и 230 пикселей в высоту, не забудьте поставить галочку в чекбоксе "Snap to Pixels", тогда фигура будет иметь более четкие края. Выставляем радиус - 0,78 сантиметра и щелкаем мышью в верхнем левом углу рабочего окна, нужная фигура, появилась мгновенно. Осталось выровнить ее относительно изображения на первом слое, и повторить эту же операцию на остальных слоях.

Вот параметры для других фигур:

• Слой 3- ширина 144, высота 236, радиус 0,8 см., цвет белый
• Слой 2- ширина 150, высота 242, радиус 0,9 см., цвет серый
• Слой 1- ширина 156, высота 248, радиус 1 см., цвет белый

Когда все фигуры идеально расположились одна под другой, можно обьеденить все слои ("Ctrl + E") в один, скопировать и вставить изображение меню в основное окно, где мы создаем эскиз нашего сайта. Рамочки, обрамляющие блоки информации были сделаны аналогично.

Рисуем кнопки.

Для этого тоже лучше открыть новый файл, с теми же параметрами, любого размера (но никак не маленького, 100х100 в самый раз будет). Для создания именно тех кнопок, я пользовался плагином "Eye Candy 3.0", опцией "Cutout…", это очень старый плагин, он у меня очень давно, но очень удобный и с хорошим набором фильтров (если кому надо могу выслать по почте или дать ссылку на скачивание [размер 1,04 Мб] ). Я расскажу, как сделать похожую, пользуясь стандартными инструментами.

Выбираем инструмент "Овальное выделение" ("Elliptical Marquee Tool") и рисуем круг (предварительно зажав "Shift"), затем заливаем его нужным цветом. Не снимая выделения, выбираем в меню "Select" -> "Transform Selection" (трансформация выделения), в секции изменения размеров ("Scale") жмем на кнопочку "цепь", это означает, что мы будем менять ширину и высоту пропорционально. Вводим 85 %, применяем трансформацию, и заливаем уменьшенную область цветом потемнее. Повторив туже операцию еще раз (но теперь уже 95%, от уменьшенного выделения),заливаем область первоначальным цветом, теперь внутри большого круга у нас появилась каемка из темно-зеленого цвета.

Теперь пришла пора придать кнопке псевдо - объемность, дать на ней блик света. Для этого снова трансформируем выделение снова на 85%, зададим "Foreground color" чуть по светлее и выберем наш любимый инструмент - "Градиент". Свет у нас якобы падает на кнопку с левого верхнего угла изображения (приблизительно под углом в 45 градусов), вот также и проведите градиент - от края ыделения до середины круга. Как не надоела эта операция, но придется вновь уменьшить выделение на 90%, затем создайте новый слой (Ctrl+Shift+N), и залейте область первоначальным цветом. Нажмите "Ctrl+D" и избавьтесь наконец от выделения, осталось сместить кружок на новом слое, от центра к правому нижнему углу картинки, и все, заготовка для копки готова.

Вот вам несколько другой способ рисования - выделением и заливкой. Перед тем как, рисовать на ней символические изображения, нужно склеить все слои ("Ctrl+E"), и уменьшить заготовку до нужного размера. Символы эти рисуются карандашом, но если у вас не получится, то можно воспользоваться готовыми фигурами -"Custom Shape Tool", кнопки "Сделать стартовой" и "Добавить в избранное" были сделаны именно так.

По Феньке и шапка

Скажу, что коллаж в нашей шапке, до безобразия прост, но как показало наше обсуждение на форуме в "Мастерской", придется дать описание его создания.

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

Второй представляет собой жесткую картинку, но имеющую очень большую ширину ("width"), равную ширине самого большего на сегодня разрешения экрана 1600 пикселей, обычно ее дают фоном к столбцу. Не самый лучший способ удовлетворения потребностей любителей больших разрешений, ибо "вес" такой картинки обычно очень велик и будет сильно оттягивать загрузку. Хотите пример? Пожалуйста - http://www.21vek.ua/.

Самый оптимальный это третий тип, который может быть выполнен по-разному. Можно сделать две ячейки таблицы, одна фиксированной ширины - в ней будет основная картинка, а другая "резиновая" - где в качестве фонового рисунка дана картинка шириной в 1 пиксель, которая повторяясь, дает некое продолжение вашей основной картинки.

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

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

Чего-то мы отвлеклись, итак откроем картинку предназначенную стать фоном и уберем ее цвета - "Image ->Mode -> Grayscale", затем выделим ("Ctrl+A") и скопируем ее всю в память ("Ctrl+C"). Перейдем в окно, где мы ваяем наш коллаж к слою где нарисован широкий зеленый прямоугольник, выделим его тоже. Затем жмем "Ctrl+Shift+V" (вставить в выделение) и наша черно-белая картинка вставилась внутрь выделения , а новообразованный слой стал включать в себя маску созданную из выделения. Если подвигать вставленное изображение, то оно будет видно только в области маски. Если вы определились в том , как должно быть расположено изображение внутри маски, можно обрезать не нужные края изображения, щелкнув правой кнопкой мыши по пиктограмме маски и выбрать опцию "Apply Layer Mask".

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

Мне показалось этого не достаточным для фона, и снова выделив зеленый прямоугольник, я заштриховал его - "Edit -> Fill->Use->Pattern -> Custom Pattern", выбрал заранее сделанный "Паттерн".

Что такое "Pattern" (образец)? Это обычный рисунок в "Фотошоп". Откройте новый файл (с прозрачным фоном) произвольно размера и карандашом в 1 пиксель нарисуйте горизонтальную линию (зажав "Shift" естественно), затем ниже еще одну на расстоянии 3 пикселя. Нет необходимости зарисовывать все поле таким способом, можно скопировать все ("Ctrl+A") и вставить, затем подогнать под нужное расстояние, склеить слои ("Ctrl+E"), теперь мы имеем на ондном слое уже 4 линии. Повторите эту операцию, до тех пор, пока все поле не будет заполнено линиями, затем выберете "Edit -> Define Pattern", и создайте "паттерн" собственного производства.

Теперь можно было приступить к размещению на этом фоне других элементов. Выбрав несколько картинок, я сперва их "зачистил" отделил от фона. Для этого нужно скопировать изображение в новое окно с прозрачным фоном, выбрать инструмент "Polygonal Lasso" (), и очень кропотливо, кусочек за кусочком, вырезать и удалять не нужные ее части.

Делаем желтый след

Для этого, перейдем на слой с изображеием и нажмем "Ctrl+A" (выделить все), затем выбрав в инструментах "стрелку" ("Movie Tool") , один раз нажмем любую управляющую кнопку на клавиатуре (со стрелочками которые =), выделение сразу охватит ваше изображение по контуру, это нам и нужно. Создадим ниже новый слой и зальем выделение желтым цветом, не снимая выделения, идем в фильтры, там выбираем "Eye Candy 3.0 -> Motion Trail", и вся любовь.

Изогнутая надпись

Сначала пишем текст, затем в меню выбираем "Layer -> Type - > Wrap Text", и начинаем издеваться над ним. Конкретно для этой надписи был выбран стиль "Flag".

Статья получилась огромная, материала для осмысления много, и я естественно понимаю, что многое может быть непонятно, поэтому жду ваших писем или отзывов, от которых будет зависеть о чем будет следующая статья. Либо она будет с более подробным описанием рисования в программе "Фотошоп", либо пойдем дальше и я опишу нарезку в "Image Ready" и верстку в "Dreamweaver".

Продолжение следует...

	Что такое и зачем вам нужна своя WEB-BBS?

	ToshibaNT
	web-bbs.narod.ru
	toshibant@mail.ru
	08/08/04

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

Сейчас будет небольшое вступление:

Для начала я задам вам такой вопрос "Знаете ли вы что такое BBS ?"

Если вы знаете что представляют из себя ББСки и были на них
уже не один раз, вам можно пропустить этот абзац и читать дальше.

Если же вы не знаете, что такое ББС, я вам сейчас про это поведаю :)

Цитата из древней рукописи "РУКОВОДСТВО HАЧИHАЮЩЕГО ПОЛЬЗОВАТЕЛЯ СЕТИ FidoNet" (датируется 1991 г. н.э) ...

"... Как известно, всякий человек издревне стремился к общению с себе подобными. С этой целью были созданы почтовая система, телефон, телеграф и прочие блага цивилизации. Hо, как правило, такое общение ограничивалось двумя собеседниками. А всякий человек, как правило, в душе оратор: ему нужна аудитория, которой он смог бы высказывать свои мысли, с которой он мог бы спорить, в общем, такое положение вещей в наш век, когда космические корабли бороздят бескрайние просторы Вселенной, многих не устраивало. И вот группе гибнущих от тоски по общению владельцев компьютеров пришла в голову гениальная мысль: а что нам мешает устроить что-либо наподобие доски объявлений, где всякий мог "повесить объявления" со своими умными мыслями и почитать умные мысли других. Тем более, что в техническом плане особых сложностей не возникало. Сказано - сделано. Результат превзошел все ожидания! Помимо возможности "поболтать" появилась уникальная возможность сообща решать важные проблемы, обсуждать новые идеи, обмениваться информацией. Так появились BBS. BBS расшифровывается как Система Электронных Досок Объявлений ..."

С тех пор много воды утекло и бум терминальных ББСок в России прошел где-то в 1998-2000 годах, как раз после появления "системы для домохозяек" - Windows'a 98-го и общедоступного Интернета (доступного и для домохозяек).

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

Появление WEB-BBS-ок.

Но, это еще не сказка, а только присказка. А вот тут и начинается то самое, из-за чего я и написал эту статью:

В последнее время, в силу появления новых технологий, люди начали переделывать ББСки в WEB-ББСки.

Вы спросите: "Что это значит ?"

На BBS пользователи обычно заходят с помощью терминальной программы (например, такой как HyperTerminal). Кроме скачивания файлов и чтения почты BBS практически ничего из себя не предоставляет.

WEB BBS - это расширение обычной BBS, основанное на стандартах интернета.

Работая с WEB BBS пользователь использует уже не терминальную программу, а браузер (например, такой как Internet Explorer).

Перемещение по WEB BBS напоминает вам путешествие по интернету, т.е. вы вводите нужный URL в браузер и просматриваете полученную информацию. WEB BBS, в отличие от BBS, может быть оформлена в виде сайта или портала.

Зачем вам своя W-B?

А теперь ПОДУМАЙТЕ ничего вам эта WEB-BBS не напоминает? Еще не вкупаете? А как же ваша домашняя страничка, которую вы делали неделю (месяц, год) назад.

WEB-BBS это та же домашняя страничка для друзей. Только для того, чтобы зайти на нее, вам не нужно подключаться к Интернету. Достаточно позвонить на WB (звонить также как в Инет через "Сеть и Удаленный доступ к сети", номер телефона соответственно не инетовский). И после подключения набрать в адресной строке Internet Explorer'а адрес W-B, к которой вы подключились.

Отличия W-B от вашей инетовской странички огромные.

Как правило, на бесплатных хостингах вам дают ограниченное пространство для вашего сайта, и не дают возможностей использовать скрипты (PHP, Perl). Эти возможности доступны только на платных хостингах. У вас же дома размер сайта будет ограничен размером вашего жесткого диска. Вдобавок к этому вы сможете устанавливать у себя любые скрипты. Т.е на вашем домашнем сайте может быть собственный форум, чат и многое другое.

Естественно есть и свои минусы.

• На вашу W-B не сможет зайти, например, австралиец или американец.
• На вашу W-B не смогут зайти 2 человека одновременно.

Подумайте: часто ли к вам на сайт заходят американцы, особенно сразу толпой по 20 человек?

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

Какая вам от этого выгода ?

• W-B явление новое и сейчас W-BBS'ки мало у кого есть. У вас будет то чего нету у других (вам будут все завидовать) !!!

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

Человек, подключившийся к вашей W-B сможет:

• Скачивать у вас и закачивать вам какие-нибудь полезные программы.
• Початиться с вами, если вы соблаговолите присутствовать в чате.
• Оставить сообщение в Гостевой или на Форуме.

Толку от этого будет гораздо больше, чем от простой домашней странички (ведь на страничку вам никто не будет ничего закачивать).

Что потребуется для создания W-B?

• компьютер с модемом и установленной операционной системой Windows 2000 или Windows XP (вообще подойдет и Windows 98-й и Linux).
• руки, желательно растущие откуда надо :)

Внимание !!! Ваша W-B будет работать только тогда, когда включен ваш компьютер и не занят ваш телефон. Соответственно вы сможете ее включать:

• когда ваш приятель (подружка) позвонит голосом и попросит (тогда вашу W-B можно назвать приватной)
• в определенное "рабочее" время (тогда вашу W-B можно назвать общедоступной).

Врядли вы сможете ее сделать круглосуточной у себя дома (вашим родственникам это не понравится).

Зато вы сможете, если родственники не будут против, сделать ее работающей ночью.

Так уж принято, что большинство W-B работает по ночам например у моей W-B время работы с 23:00 до 7:00 и вы не будете исключением если поставите себе такое же время работы.

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

На этом пока все. Если я вас этой статьей заинтересовал, заходите на мой сайт и читайте подробнее о том, как сделать свою WEB-BBS. Между прочим, это пока единствнный в Рунете сайт, посвященный целиком WEB-BBS'кам.

На сайте выложен мой "Учебник по созданию W-B". Сейчас там лежит получерновой вариант, нуждающийся в доработке. Однако, уже с помощью этого варианта вы сможете сделать свою W-B - вашу настоящую домашнюю страничку.

P.S: Не зря страничка называется "домашней", а не "народной". Смысл в том и состоит, чтобы она была у вас дома а не на Народе.

	Печатаем по-умному или ещё один способ защиты информации

	Евгений Неверов
	web-build.info
	eugene@web-build.info
	08/08/04

Сегодня мы поговорим о том, как сделать так, чтобы выводить на экран одну web-страницу, а при печати этой страницы на принтере результат был несколько иным. А делается это с помощью CSS.

В CSS есть одна очень полезная функция: Вы можете для одного и того же HTML-элемента указать разные способы отображения при печати и при показе в браузере. Для лучшего понимания рассмотрим следующий пример:

CSS-файл (style.css):
@media screen {
	p {
		color: #000000;
	}
}

@media print {
	p {
		color: #ff0000;
	}
}
HTML-файл (index.html):
<html>
 <link rel=”stylesheet” type=”text/css” href=”style.css”>
 <body>
  <p>hello</p>
 </body>
</html>

Теперь при просмотре HTML-страницы в браузере Вы увидите слово Hello чёрного цвета. Однако попробуйте распечатать эту страницу на цветном принтере, и слово Hello окрасится в красный цвет.

Извлекаем выгоду

Теперь немного изменим CSS-файл:

CSS-файл (style.css):
@media screen {
	p {
		display: block;
	}
}

@media print {
	p {
		display: none;
	}
}

Что будет, если мы снова откроем в браузере, а затем распечатаем HTML-файл? В браузере текст будет спокойно отображаться, а вот при печати пользователь получит чистый лист бумаги. Вот это и есть ещё один способ защиты информации.

Однако подчас такая защита не нужна. Посмотрим реальный пример: необходимо сделать на сайте страницу, для удобной распечатки материалов (без излишнего оформления). При этом где-то на web-странице будет кнопка «Печать». Так вот, я думаю, что стоит убрать её из печатной версии. Что делаем в CSS:

CSS-файл (style.css):
@media screen {
	input {
		display: block;
	}
}

@media print {
	input {
		display: none;

	}
}

Итоговый CSS-файл (style.css):
@media screen {
	input {
		display: block;
	}
	p.advert {
		display: none;
	}
}

@media print {
	input {
		display: none;

	}
	p.advert {
		display: block;
	}
}

HTML-файл (index.html):
<html>
 <link rel=”stylesheet” type=”text/css” href=”style.css”>
 <body>
  <p class=advert>Страница скачана с сайта Site.Ru</p>
  … здесь идёт текст, который должен быть распечатан …
  <input type=”button” value=”Печать” onClick=”javascript:print(document);”>
 </body>
</html>

Собственно, пример такой реализации Вы можете увидеть у меня на сайте: http://web-build.info/print.php?type=html&id=1102500209. На странице внизу видно строку «Печать :: Закрыть», которая не печатается, зато наверху страницы не видно строки «Статья скачана с web-портала Web-Build.Info», которая появится при печати.

Подчас, не обязательно использовать данную функцию CSS только для защиты информации. Порой необходимо некоторые данные при печати представить в несколько другом виде. Впрочем, как пользоваться – решайте сами.

Вот, в принципе и всё. Со всеми вопросами, комментариями, уточнениями и т. п. обращайтесь по e-mail: eugene@web-build.info.

	Счетчик для вашего сайта

	Paul
	paul.webhost.ru
	paul@nc.ru
	18/01/05

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

Хороший счетчик очень важен, поскольку позволит вам оценивать привлекательность своего сетевого проекта, а также узнать эффективность той или иной маркетинговой кампании.

Будем считать, что вы хоститесь на бесплатном сервере а) без поддержки серверных скриптов и б) с поддержкой серверных скриптов.

а) Хостинг без поддержки серверных скриптов.

В этом случае у вас есть два варианта: использовать счетчик, предоставляемый хостингом (как правило, даже у самых простых хостеров есть такая опция), или воспользоваться услугами специального аналитического сервера. Остановимся на этом варианте подробнее.
Существует масса таких серверов. Зарегистрировавшись на таком сайте, вы получаете код, который вы должны вставить на все страницы, с которых вы хотите получать статистику. У достаточно продвинутого сервера, как правило, код состоит из двух частей: скрипт передачи данных серверу, который вы должны вставить в начале страницы как можно выше, и код, вызывающий рисунок со счетчиком. Далее я перечислю несколько русских компаний, предоставляющих услуги бесплатной статистики.

hotlog.ru
До недавнего времени это был лидер среди статистических серверов. Он предоставлял самую полную статистику, которую можно получить подобным способом. Но потом владельцы решили заработать немного денег, и теперь "за так" предоставляют лишь жалкие обрубки от былого великолепия. Обычным пользователям теперь узнать полную статистику стоит 99 монгольских тугриков, а корпоративным пользователям - 999 в месяц.

liveinternet.ru (раньше он назывался rax.ru)
Сам я не пользовался этим сервером, но знающие люди говорят, что неплохой. Теперь на liveinternet.ru также можно завести дневник, хотя зачем это объединили со статистикой - ума не приложу.

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

5-3-2.com
Моя любимая статистика. Я поставил их счетчик на сайте muzfilm, и очень даже доволен. Полная статистика, возможность высылки по почте, интегрированная партнерская программа, хорошая поддержка, и многое другое. Сервер молодой, но многообещающий.

counter.co.kz
Статистика тут мизерная, но вот выбор внешних видов счетчиков - огого! Более 700 штук цифровых, графических, рисованных, и прочее, прочее, прочее... Посмотреть лишним не будет.

top100.rambler.ru
Рейтинговая система от рамблера - самая популярная в Рунете. Совместно с определением рейтинга может давать и неплохую статистику.

top.mail.ru
А это аналогичный сервис от mail.ru. На мой взгляд, лучше Рамблера, поскольку на мини-баннере показывает и счетчик (но зато у рамблера более стильные рисунки). А в остальном - то же самое.

top.one.ru
На закуску - рейтинг от популярного каталога one.ru.

Дальше без комментариев - просто список.
top100.lt
topcto.ru
kmindex.ru
top.arbuz.com
listtop.ru
extreme-dm.com

А вот это - длинный список серверов статистики от Яндекса:
yaca.yandex.ru/yaca/c5.58-0-0-0-0-0-0-0-0-0-0-0-0=0.html

Все эти счетчики будут работать на любом хостинге, платном и бесплатном, большом и маленьком, навороченном и простеньком.

А вот теперь:

б) Хостинг с поддержкой серверных скриптов.

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

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

Скрипты статистики делятся на две группы:

1. Ведущие собственный лог посещений. Это, например:

AXS Visitor Tracking System (Демонстрация работы)
Именно этот скрипт установлен на моем сайте, и в общем, его работой я доволен. На сайте производителя вы можете полюбоваться примером работы, и скачать сам дистрибутив.

BBClone (Демонстрация работы)
Мультиязыковой скрипт, ведущий неплохую статистику.

Форум, на котором ведется обсуждение таких скриптов.

2. Скрипты и программы, анализирующие серверные логи.

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

Скриптов-анализаторов логов довольно много. А еще вы можете скачивать логи себе на компьютер, и просматривать их с помощью специальных программ.

Я приведу только один пример скрипта-анализатора:

Advanced Web Statistics
Посмотрите на пример, доступный на сайте, и вы увидите, какие возможности таит в себе такой метод.

Вы можете найти себе что-нибудь по вкусу на этом форуме.

Ну а по этому адресу вы найдете одну из самых больших коллекций скриптов в Рунете.

Вот и все. В следующей статье из цикла "Свой сайт от А до Я" будет рассказ о том, то собственно такое эти серверные скрипты, и как с ними работать.

	Список бесплатных хостеров

	Paul
	paul.webhost.ru
	paul@nc.ru
	18/01/05

В этой статье приведен список русских серверов, предоставляющих услуги бесплатного хостинга.

В начале каждого абзаца есть ссылка на сайт хостера, а если присутствует знак "@", то это значит, что также предоставляются услуги бесплатной почты в домене второго уровня (xxxx@yyyy.zz).
В этой статье, используя сочетание "все опции", я имею в виду, что сервер предоставляет достаточно места, поддержку php и прочих языков, MySql, и тому подобное.

fatal.ru (hoha.ru, webhost.ru)
Мне нравится этот хостер. Как видите, сам я держу сайт именно тут. Человеку дают 100 метров, если очень нужно mysql, есть поддержка серверных скриптов, файлов htaccess. Неограниченный траффик. Минусы - сайты доступны только из России, не дают держать mp3. Реклама: по умолчанию всплывающее окошко, но если разместить на всех страницах баннер, и сообщить об этом модератору, то окошки отключат. Можно создать до 5 почтовых ящиков в домене третьего уровня.

newmail.ru (nm.ru, hotmail.ru и др.) (@)
Этот сервер мне тоже нравится, хотя его возможности намного меньше. Под ящик и сайт дают 30 метров. Поддержки пользовательских серверных скриптов нет, зато есть гостевая книга, скрипт голосования, форма отправки почты. Никакой рекламы. Сайт удалят, если в течении 50 дней не было обновлений. Впрочем, это не только тут.

chat.ru (@)
Один из старейших хостеров в рунете. За годы своего существования он потихоньку скатывался, и теперь он еще и один из самых худших серверов. Он предоставляет 10 мб и почтовый ящик. Из дополнительных сервисов - счетчик посещений и гостевую книгу. Впрочем, гостевую может получить любой зарегистрированный человек, даже не обязательно иметь сайт. Из рекламы - при открытии любой страницы сайта вылезает окошко с рекламой, и отключить его нельзя. Сервер известен как очень нестабильный. Но у него есть и плюс - аккаунты вечны, и их не удаляют за необновление. Именно потому я держу на chat.ru зеркало.

hotbox.ru (land.ru, pochtamt.ru, pisem.net, mailru.com, krovatka.net и др.) (@)
В основном, этот сервер является почтовым. Соответственно, хостинг тоже не ахти. Дают 20 метров, никаких скриптов, только простенький счетчик посещений. Траффик ограничен - каким объемом, не знаю. Качеством я сейчас недоволен, а вот раньше оно было хорошим. Нет рекламы.

narod.ru (@)
Очень крупный сервер, принадлежащий яндексу, и возможности неплохие. Неограниченное пространство, куча предустановленных скриптов, траффик тоже, кажется, неограничен. Но нет поддержки пользовательских скриптов. Реклама: всплывающее окно или баннер. У этого сервера есть крупный плюс: яндекс прочно стоит на ногах, и у него очень мощные серверы. Так что ваш сайт никто не удалит (если вы его будете обновлять), и даже если сервер упадет, то он гарантированно поднимется.

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

wallst.ru (dax.ru, aiq.ru, dtn.ru, vov.ru, tora.ru, pips.ru, metastock.ru, supercharts.ru)
Очень хороший сервер. Все опции, да вдобавок хороший саппорт - это многого стоит. В последнее время регистрация только по почтовым заявкам. Реклама - баннер.

by.ru (ever.ru, near.ru) (@)
Весьма приличный хостер. Довольно старый, но надежный. Все опции.

az.ru (dk.ru, ua.ru, ec.ru, cf.ru, ussr.to, shortway.to Также home.c99.ru, sunday.ru, tam.ru, zk.ru, zercalo.ru - но в этих доменах дают только адрес xxx.ru/you)
Ничего сказать об этом сервере не могу. реклама - баннер, но не обязательно.

amillo.net (w6.ru и т.д.)
У этого сервера очень даже впечатляющие возможности как программные, так и аппаратные. Но репутация у него не очень хорошая - то и дело падает. Впрочем, администрация заверяет, что все дело было в апгрейде оборудования, и что больше этого не повторится.

holm.ru (agava.ru, h10.ru, h12.ru)
Хороший сервер, но он также считается нестабильным. Все опции (правда, увеличение размера и необходимость в mysql надо обосновать). Реклама - баннер.

boom.ru (@)
Этот сервер принадлежит компании mail.ru, поэтому на него распространяется все то, что я написал и про narod.ru. Дают 50 метров, некоторые предустановленные скрипты, и все, пожалуй. Реклама - огромное всплывающее окно. Сервер имеет репутацию нестабильного.

hut.ru (@)
"Серенький" хостер. Ничего особенного про него сказать нельзя. Все опции, реклама - баннер.

webservis.ru (al.ru vipcentr.ru vippochta.ru vipshop.ru bos.ru bip.ru dem.ru far.ru fud.ru hobi.ru hop.ru r2.ru bloomberg.ru) (@)
Неограниченное место, все сервисы, в общем, хороший хостинг. Единственное НО - насколько я помню, с этих серверов плохо скачиваются большие файлы.

tut.by (@)
Пожалуй, это самый слабый сервер из представленных. Всего 5 метров, никаких дополнительных опций. В принципе, это понятно - hut.ru - это почтовый сервер. Но зато у него есть очень интересная особенность - возможность редиректа на другой сайт (прямо как da.ru). Правда, это так написано в справке, а код, который они предлагают использовать, будет работать и на любом другом сервере.

noka.ru
А этот сервер предназначен только для сайтов образовательных учреждений. Дают 50 метров и все, что полагается на нормальном хостинге. По всей видимости, сервер хороший.

km.ru (@)
Один из старейших проектов в рунете. Хостинг поддерживает все стандартные опции, но место дают не всем. (Цитата - Проект KM.RU ХОСТИНГ - не очередной бесплатный хостинг, на котором можно размещать домашние странички, сайты коммерческой направленности, пиратские mp3 и т.д. Мы хотим помочь тем бескорыстным энтузиастам, которые тратят свои силы, время и способности и хотят наполнить Интернет действительно качественной, интересной и достойной информацией. У вас много идей, вы хотите поведать миру о чем-то интересном, захватывающем и познавательном, тогда вы пришли туда, куда надо. Мы предлагаем уникальные возможности по созданию и размещению вашего сайте в Интернете.)

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

kyrnet.kg
Довольно малоизвестный сервер, но тем не менее, предоставляющий все опции и удобные условия.

Ну вот - что вспомнил - написал. Наверняка, список русских хостеров этим не исчерпывается. Думаю, стоит поискать среди почтовых серверов, как например, hotbox или tut - но ничего выдающегося вы там не найдете. Также имеет смысл искать только что открывшихся хостеров - чаще всего сначала они работают бесплатно, а потом начинают брать деньги.

Теперь несколько ссылок по теме:
Четыре форума, на которых обсуждают бесплатный хостинг.
forum.ru-board.com/forum.cgi?forum=11
phpclub.ru/talk/forumdisplay.php?forumid=14
webhostingtalk.ru/cgi-bin/ib3/ikonboard.cgi
earnforum.com/vb/forumdisplay.php?forumid=18

А вот это коллекция из более чем 300 ссылок на бесплатные сервера, как русские, так и зарубежные.
http://internethosting.ru/hosting/personal

Удачи в ваших поисках!

Раздел "Веб-мастеру". Веб-кодинг:

	Замечания о некоторых директивах в php.ini

	Dead Krolik
	dead-krolik.narod.ru
	dead-krolik@rambler.ru
	12/01/05

Сегодня я хочу сделать несколько замечаний о некоторых директивах и о правомерности их наличия в конфигурационном файле php.ini.

register_globals должны умереть

Ну вот скажите мне, почему это вдруг использование register_globals=On считаеся небезопасным. И ведь находятся люди, искренне считающие, что это так (те же разработчики официальной документации к PHP). Когда начинаешь спрашивать разных людей, мол, как это может повлиять на безопасность, слышатся очень простые ответы, вроде: "Ну …, типа …, могут поломать…". Или еще один убийственный ответ: так делают профессионалы. Смех, да и только.

Напомню, что включение сей директивы в php.ini означает то, что все параметры, переданные скрипту, сразу же становятся полноправными переменными. Снова обратимся к официальной документации. Лично меня, их увещевания по поводу необходимости выключения этой директивы, немного не впечатляют. Весь упор делается на то, что если переменная не инициализирована, то по умолчанию интерпретатор делает ее пустой строкой, и приводится дикий пример:

// установим $authorized = true только если пользователь авторизовался
if (authenticated_user()) {
    $authorized = true;
}

// Поскольку мы не инициализировали $authorized как false, она может быть
// определена через register_globals, например GET auth.php?authorized=1 
// Любой может быть зарегистрирован! (So, anyone can be seen as authenticated!)
if ($authorized) {
    include "/highly/sensitive/data.php";
}

И получается, что "anymore can be seen as auentificated", только потому, что не реально было написать после первого условного оператора веточку else, в которой присваивали бы этой переменной false. Вообще (ИМХО) - это наследие бейсика. Это все-равно, что кушать из тарелки, при этом, забыв положить в нее еду (не инициализировав), думая, что по умолчанию в неё что-то положит мама. А ведь не всегда мама может положить, иногда папа может и ремень достать. Придумали суперглобальные массивы. Может и правильно, но какая разница как переменная получает свое значение. Она пришла от пользователя. Мне все-равно, POST это был, или GET. А если не пришла - то это очень легко исправить, инициализировав её перед использованием.

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

В конце главы они все-таки соглашаются, что "…, although it really is generally a good programming practice to initialize variables first". Для людей мало знакомых с английским перевожу: вообщем-то это хорошая привычка инициализировать переменные перед использованием.

Жаркие дискуссии так же горят и в нашем любимом интернете, например, тут. Если совокупить все доводы, которые вообще я смог где-либо прочитать, то можно вынести для себя следующие минусы использования register_globals=On:

• Код не безопасен [так и не врубаюсь почему, варианты типа внедрения переменных через URL немного не тянут для "профессионалов"].
• Поддерживать код очень сложно [имеются в виду не проекты отдельных программистов, а проекты создаваемые и поддерживаемые группами таковых].
• Отлаживать ваш код почти невозможно.
• Код, написанный при ON, не будет работать при OFF. И наоборот: если вы сразу писали при OFF, то и при ON он будет работать подавно.

И доводы за такое использование:

• Очень легко обращаться к переменным. В том плане, что не надо писать длинные обращения, вида: $_GET['aa']. Т.к. человек - он по природе ленив, то, извиняюсь, тянуть по всему скрипту проверки переменной $_GET['aa'] он не будет, а заведет переменную $aa. Что само по себе не хорошо - заводить еще одну лишнюю переменную, тогда как при включенной директиве это не нужно.
• Не надо заморачиваться с тем, что переменная может прийти как через GET, так и через POST. Она просто есть.

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

php_flag register_globals on

А если сделать так не представляется возможным (вам просто запрещено перекрывать настройки httpd.conf), то на сайте PHP в комментариях к этой директиве (http://ru3.php.net/manual/en/security.registerglobals.php) высказано очень много интересных путей решения. Вполне приемлемых.

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

magic_quotes_xxx

Напомню, что включение директивы magic_quotes_gpc в файле php.ini означает, что все поступающие к вам переменные из GET и POST запросов, а так же cookies будут заранее испорчены функцией addslashes(). То есть разработчики PHP позаботились о нас бедненьких, о том, что мы можем случайно забыть вызвать функцию addslashes, перед тем, как ложить что-то в базу данных или куда еще.

Лично у меня стоит Денвер. На нем я тестирую и пишу скрипты. В нем по умолчанию magic_quotes_gpc=Off, что, несомненно, правильно. Догадались в чем соль? А соль в том, что у разных хостеров бывают разные админы. И некоторые оставляют по умолчанию включенную в php, как модуля Apache, эту директиву, а некоторые ее выключают.

А самое интересное начинается, когда мы кладем поступившие переменные в базу данных. В ту же MySQL. Ведь правила хорошего тона не позволяют лично мне не делать addslashes() перед тем, как что-то туда положить. Схлопотать sql injection не очень-то хочется. То есть пользователь ввел строчку вида:

$str="1'st letter";

При включенной директиве мы получаем это дело как:

$str="1\'st letter";

Дальше мы сами добавляем слеши:

$str="1\\\'st letter";

И кладем в базу. Надо понимать, что никакие слеши в базе не хранятся. Слеши нужны только при добавлении. И значит, выбрав из базы эту же строчку, мы получим:

$out="1\'st letter";

Что, как и следовало ожидать, не совпадает с вводом пользователя. Такое можно видеть на очень многих сайтах. Так, где должна быть кавычка, перед ней появляется непонятный слэш, что смотрится очень не красиво.

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

$info=get_info_from_db();
if (ini_get('magic_quotes_gpc'))
{
    $info = stripslashes($info);
}

Второй выход - это снова использовать файл .htaccess для переопределения директив php.ini.

Пара слов о директиве magic_quotes_runtime

Вы когда-нибудь ее включали. Попробуйте. Я вас уверяю - вам не понравится. Любая переменная, прочитанная из файла, абсолютно все, не побоюсь этого слова, гадится слешами. Лично мне непонятно - зачем нужна эта директива. Ее кто-нибудь, когда-нибудь использует? Зачем вводить директивы, которые никому не нужны. Единственным выходом, который здесь можно предпринять является вызов функции set_magic_quotes_runtime(0) до проведения основных операций программы. Лично я не слышал ни об одном хостинге, где бы в php.ini она была бы включена, но это стоит делать на всякий случай. Вдруг разработчики PHP однажды решат, что и её надо включать. Кто их знает.

Раздел "Веб-мастеру". Обмен ссылками:

	Обмен ссылками: новые объявления

	Алексей Сивин aka IsleX
	MostInfo.net
	info@mostinfo.net
	08/08/04

Данная рубрика создана для помощи веб-мастерам. Здесь публикуются объявления по поводу обмена ссылками/кнопками. Если вы хотите опубликовать свое объявление - заполните специальную форму, находящуюся в конце страницы, и ваше объявление будет опубликовано не только в ближайшем номере Эбаута, но и на mostinfo.net и в рассылках этого сайта.