САЙТ ОБО ВСЁМ НА СВЕТЕ

Обратная связь

Имя отправителя *:
E-mail отправителя *:
Тема письма:
Текст сообщения *:
Код безопасности *:

Итак, ты готов приступит к созданию своего сайта. Прежде всего нужно позаботится о том, чтобы был необходимый и достаточный набор средств для этого. Во-первых, позаботься о том, чтобы у тебя был Виндоуз-98 и Оффис-2000. При этом ты имеешь: Microsoft FrontPage 2000, Internet Explorer-5 и многие другие полезные приложения.
Во-вторых, без графики твой сайт ничто. Кое что можно сделать и штатной программой Paint, но если подходить к делу более серьезно, то лучше иметь АдобеФотошоп и Corel Photo Paint последних версий и желательно русифицированных. Для чего они и как их использовать об этом в свое время. Очень тебе пригодится ACDSee 32. Это просмотровщик графических файлов. Очень хороший.
Установи у себя Netscape Navigator и Opera. Но чтобы они не запускались по умолчанию. Дело в том, что после не очень продолжительной войны браузеров мир поделился на поклонников Explorer и Netscape. В общем они почти одинаковы, но не совсем. Поэтому даже если картинка в Эксплорере будет прекрасной, в Нетскейп ее вообще невозможно будет прочитать. Поэтому все что ты натворишь, нужно будет протестировать в Нетскейп.
Неплохо иметь средство для разработки шрифтов, кнопок, фоновых картинок. Я пользуюсь программой Xara Web Stile.
Думаю, что ты не большой полиглот. Но поверь, в Сети без английского не обойтись. Поэтому обязательно установи PROMPT 98 и особенно Web Trans Site. Тогда выделив нужный участок текста и перетащив его на линейку этой программы ты сразу переведешь его. Щелкнув правой кнопкой мыши ты сможешь поместить текст в клипбоард, а затем и в нужное место на странице. Переводит он из рук вон плохо, но лучшего просто нет. Поэтому имей под рукой и словарь.
И наконец, тебе придется немало провести времени в сети, поэтому стоит подумать и о безопасности. Рекомендую BlackIC (защита от атак из интернет) и ATGuard. Обязательно FTP-клиент (программа для передачи информации через Интернет по ftp протоколу) CuteFTP.
Жаль, что я не могу дать тебе возможность скачать эти программы с моего сайта, но это невозможно по следующим причинам, во-первых, довольно быстро появляются все новые и новые версии. Я за этим угнаться просто не смогу. Во-вторых, у нас это как правило крекнутые - контрафактные программы. Сервера, кстати, запрещают использование сайтов с контрафактной программной продукцией. Но я думаю ты справишься. И подберешь, и инсталируешь все необходимое, или друзья помогут.
И конечно литературку неплохо подкупить. Прежде всего описание FrontPage. У меня есть такая книга. Автор Джим Байенс. Издательство "Питер"
Ну вот, сохрани эту страницу через броузер. Далее запускай ФронтПейдж и через стандартный набор инструментов загрузи эту страницу. И ты сможешь читать ее дальше. А теперь дай мне отдохнуть, а ты пока читай описание ФронтПейдж.********************************** *************************
Ну вот, друг мой дорогой, ты запустил Фронтпейдж, почитал описание, потыкал разные кнопки. Попробовал написать страничку. И конечно у тебя появилась масса разных вопросов. Возможно, на некоторые из них мне удастся ответить. Но прежде всего вернемся к HTML.
Итак, я хочу, чтобы ты понял и осознал, что то что ты видишь в браузере когда шастаешь в Интернет, это сборная солянка. Готовит эту солянку программа называемая браузером (просмотровщик). Она сначала загружает в себя текст, затем его анализирует, затем запрашивает по заданным в тексте адресам (гиперссылкам) дополнения, затем все это компонует и выводит на экран. Итак, HTML-страница это текст, имеющий расширение html, или htm, который может быть написан в любом текстовом редакторе, . Кроме собственно текста он включает команды для браузера. Эти команды называются тегами (tag) (некоторые говорят - таг) и выделяются уголками - < и >.
Если ты сейчас во Фронтпейдж, то нажав внизу одну из трех кнопок "Normal", "HTML", "Preview", а именно "HTML" (сейчас ты находишься в "Normal"), ты увидишь текст HTML. Посмотри внимательно и обрати внимание на те части текста, которые выделены голубым цветом. После этого возвращайся в режим "Normal". **********
Ты конечно обескуражен, но не волнуйся. На первых порах знание тегов не так уж и важно. В основном Фронтпейдж (далее - редактор) сделает все за тебя. Тем не менее, некоторые моменты нужно знать, потому что редактор не всегда понимает, чего ты хочешь. А кроме того, он разработан англоязычными для англоязычных, и описание на него составлял англоязычный.
Во-первых, у тебя должен быть заголовок. Редактор его формирует по умолчанию. Но если ты составляешь страницу на русском языке, (и, кстати, желательно, что бы редактор у тебя был русифицирован) то у тебя должен быть заголовок, который показан ниже:

<html>
<head>
<meta http-equiv="Content-Language" content="ru">
<meta http-equiv="Content-Type" content="text/html charset=windows-1251">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title> Имя</title>
<meta name="autor" content="Твое имя-фамилия">
<meta name="KEYWORDS" content=" Ключевые слова">
<meta name="DESCRIPTION" content="Содержание сайта ">
</head>

Обрати внимание, что теги как правило парные, один что-то начинает, другой что-то заканчивает. Например <head> (шапка) </head> , или <title> (заголовок) </title> и т.д.
Также выделяются и таблицы, и рисунки, и скрипты и т.д. Зачем это тебе нужно? А затем, что когда станет например вопрос о раскрутке твоего сайта, тебе нужно будет разместить на свою страницу чью-то рекламу. Чаще всего ее предлагают в виде HTML кода, который ты должен будешь разместить на свою страницу. И тебе именно в коде HTML своей страницы нужно буде найти такое место, чтобы реклама нормально смотрелась.
Еще раз посмотри на вышеприведенный фрагмент. Обрати внимание на третью и четвертую строку. В третьей задан язык на котором написана страница (ru). Если вместо ru, будет en-us, то будет считаться, что текст на английском языке. При этом, в редакторе не будет проверки орфографии.
Важны и следующие строки, потому что они настраивают броузер и сервер под расширения редактора.
Кроме того, обязательно между</title> и </head> должны быть теги:
<meta name="KEYWORDS" content=" Ключевые слова">
<meta name="DESCRIPTION" content="Содержание сайта ">
И содержание сайта, и ключевые слова нужны для того, чтобы индексные поисковые машины видели твой сайт. Объемы содержания сайта и ключевых слов не должны превышать одного килобайта, то есть тысячи знаков.

Особенно обращаю твое внимание на строчку:
<meta http-equiv="Content-Type" content="text/html charset=windows-1251">
Особенно на текст, выделенный зеленым цветом. Это указание браузеру на то, в каком коде составлен HTML-текст. Ты должен понять одну простую вещь. Информация по сети в конечном счете передается двоичным кодом, то есть - есть импульс - единица, нет импульса - нуль. Благодаря борьбе коммунистической партии с кибернетикой, как с продажной девкой международного империализма, стандартом передачи букв в компьютерной техники стал латинский алфавит. Для того, чтобы передать другие алфавиты, в том числе и кириллицу, нужны дополнительные кодовые таблицы. Они тоже стандартизованы, но могут не поддерживаться некоторыми серверами и браузерами. Кроме того, браузеру нужно указать, в каком стандарте представлен исходный текст. Некоторые очень знаменитые и опытные вебдизайнеры, например как Тема Лебедев, полагают, что charset вообще не нужно указывать. Это неправда. Обязательно нужно указывать. Иначе или сервер, или браузер (Особенно Нетскейп и Опера) может все перепутать. Мало того, может быть так, что тебе придется разместить сайт на сервере (особенно на иностранном) где стандарт windows-1251 не поддерживается. Вот другие основные стандарты: ISO-8859-5, KOI8-R. Если ты загрузишь страницу на сервер, а потом посмотришь на нее через браузер и увидишь что то вроде дЮММЮЪ ПЮЯЯШКЙЮ, то значит с кодировками что то не в порядке. Вот для этого и нужен браузер Opera. Он позволяет указывать разные кодировки. И когда ты увидишь свою страницу нормальной, то после слов charset= нужно поставит именно подобранную кодировку. Понял? Ну если не понял, то придет время поймешь.
Опять же, то что ты читаешь, это не учебник по HTML. Поэтому, если ты хочешь изучить этот стандарт более обстоятельно, ты можешь найти учебник. А я тебе могу посоветовать просто сохранять через броузер интересные страницы из Интернета (в том числе и мою) и анализировать код в режиме HTML. При этом, ты можешь выделять отдельные участки и выбрасывать их до тех пор, пока не останется тот участок, который тебя заинтересовал. А отдельные участки можешь и сохранить, накапливая как библиотечку и используя по мере надобности. При этом ты должен иметь в виду, что отдельные фрагменты работают только совместно с программами на сервере, и ты их вряд ли сможешь использовать (суть дела я растолкую позже).
Так ты не только освоишься с HTML, но и многому научишься на опыте других. Тем не менее, о некоторых тегах упомяну:
- тег <a href="sov5.htm">ааааа</a> - это гиперссылка. Раньше, а некоторые и сейчас называют это якорем от слова anchor - якорь по английски. Отсюда первая буква a . href - сокращенно гиперссылка (hiper reference). Закрывается тег </a>. Кстати, буквы могут быть и строчными и заглавными. ааааа - любой текст. Вместо текста может быть и картинка. Тогда нужно указать источник ее. Например так: <src="../ban.gif" width="120" height="60"> Здесь указано, откуда взять рисунок, его ширина и высота. Указываемые адреса могут быть абсолютными и относительными. Здесь приведен относительный адрес, а здесь <a href="http://www.grigam.narod.ru/sov5.htm">ааааа</a> - абсолютный.
- очень важный и полезный тег <br>. Это разрыв строки {Shift - Enter}. Проблема вот в чем, часто бывает так, что у тебя будет одна таблица, а за ней сразу вторая. А ты захочешь их раздвинуть, что бы что то вставить. В режиме Normal не получится. А в режиме HTML ты можешь между тегами конца таблицы </table> и начала другой <table> вставить <br> и тогда в режиме Normal ты увидишь, что таблицы раздвинулись.

На этом мы закончим рассмотрение кода HTML. Далее мы еще будем к этому вопросу возвращаться, а сейчас еще несколько советов по работе с редактором.
Первое. Когда ты запускаешь редактор, перед тобой голая страница. Броузера слева (Список файлов) не будет. Он появится тогда, когда ты хоть что ни будь сделаешь на своей странице и нажмешь значок на панели инструментов - "Просмотр в Броузер" (или "Сохранить"). Именно тогда тебе будет предложено сохранить документ и показан реальный вид твоей страницы. И именно тогда, папка, в которой ты находишься (а по умолчанию это папка документов Виндоуз) будет превращена в сайт. На ней появится изображение глобуса и слева появится Список файлов. Кроме того, есть команда, по которой любая папка может быть преобразована в сайт.
Я думаю, что когда ты убьешь массу сил и времени на свой сайт, тебе очень обидно будет его потерять, если вдруг развалится Виндоуз. Поэтому советую, создать отдельную папку под свой сайт, в корневом каталоге. Кстати запомни, все обозначения, расширения, и наименования делай только латинскими маленькими буквами и цифрами и никаких других символов, иначе могут возникнуть разнообразные проблемы. Кроме того, запомни, что твоя главная страница должна называться index. Это страница по умолчанию соответствующая твоему адресу в Сети.
Второе. Текст. В принципе ты здесь можешь работать как в обычном текстовом редакторе и довольно примитивном. При этом запомни: - нажатие "Enter" переводит на две строки вниз, чтобы переводить на одну строку, нажимай "Shift-Enter" (тег "br"). - чтобы строки выравнивались с двух сторон, выдели весь текст и в меню Формат -> Абзац -> Aligment, выбери - Justify.
Если у тебя уже есть готовые документы, ты их можешь поместить на страницу. Не советую преобразовывать в тех редакторах (а это наверное Word) в которых создавался документ в форму HTML. Если у тебя документ большой, лучше небольшими фрагментами разместить его на нескольких страницах через клипбоард. Но при этом будь готов, что редактор с рисунками, таблицами и прочими элементами поступит не лучшим образом, поэтому все что он натворил нужно выбросить, оставить чисто текст. Привести его в порядок, затем заново вставить все необходимые элементы. При этом ты должен запомнить, что главная проблема Интернета, это малоскоростные средства связи. Поэтому ты должен сделать все, чтобы страницы твои грузились побыстрее. Справа ниже ты видишь песочные часы и секунды. Это ориентировочное время загрузки. Так вот, именно тогда тебе потребуется Фотошоп, чтобы уменьшить до предельно возможных размеров рисунки и сохранить их с худшим качеством, но с минимальным объемом.
Третье. Таблицы. Без таблиц ты не обойдешься. Действительно, стандарт HTML таков, что все стремится к левому краю. Ты не сможешь поместить просто так два рисунка, фотографии, куска текста или тех же таблиц рядом. А вот если ты поместишь таблицу из двух ячеек рядом (а это возможно), например так (значок на панели инструментов вверху):




то, как видишь все получается. Далее ты разберешься, почитав описание редактора и посмотрев настройки страниц с других сайтов, в том числе и моей. Там вся структура страницы сформирована при помощи таблиц, хотя и не все из них видно. Дам еще несколько советов:
- Рисунки и фото объединяй с подписями к ним при помощи таблицы с двумя вертикально расположенными ячейками, например, как в моей книге "Мы во вселенной одни".
- Если ты создал одну таблицу, а в ее ячейке хочешь поместить другую, то имей в виду, что настраивать эту ячейку ты уже не сможешь. А если такая необходимость все же возникнет, тебе нужно будет содержимое дополнительной таблицы переместить, например в низ страницы. Затем убрать таблицу, настроить ячейку, что под ней, потом снова установить таблицу, настроить и перенести в нее содержимое. Я долго мучился пока не понял в чем дело. Можно также, в режиме HTML, перед началом внутренней таблицы вписать тэг <br>, тогда в режиме Normal над внутренней таблице появится пространство внешней, куда можно будет поставить курсор.
- Следи за тем, чтобы тебе в папку сайта не попало ничего лишнего.
- Смело используй фоновые изображения, или так называемые обои. Их можно сгенерировать рекомендованной мною программой Xara. Можно найти в Интернете, можно стащить с понравившегося сайта, можно просто подобрать красивую картинку и обработать в Фотошопе. Не забывай, что чем меньше ее объем тем лучше. Кстати, просмотренные тобой в интернете страницы хранятся в папке "Временные файлы интернет". Найди ее, заглядывай туда. Там можно будет найти много интересного и поучительного. Но с этими временными файлами есть еще одна проблема. Например, ты внес изменения в свою страницу и загрузил ее на сервер. Затем смотришь ее через броузер, а она не изменилась. Ты начинаешь нервничать. А причины здесь могут быть две. Во первых, на сервере иногда перегрузка из кэша может требовать какое-то время, а во-вторых, хоть ты и обращаешься как бы на сервер, а броузер берет страницу из твоего комьютера из папки временных файлов. А ты то радовался что она так быстро грузится! Нажми кнопочку ОБНОВИТЬ в броузере!
- Редактор постоянно будет пытаться в папке твоего сайта создавать другие папки. Они нужны только для редактора. На сервер их загружать не нужно. По крайней мере, все что ты осознанно используешь, все должно быть в основной директории. Иначе тебе и на сервере нужно будет создавать папки (если ты будешь использовать пейджбилдер), а это не очень удобно.
- Не злоупотребляй формами и компонентами. Помни, что во-первых, не все они будут исполнятся на сервере без Extensions, во-вторых, некоторые из них, как например Hover Batton, очен замедляют загрузку.
Еще один важный момент. Фронт Пейдж программа своевольная. Она все время пытается за тобой что-то поправить и переделать. Но есть такие HTML коды, которые редактор понимает неправильно, исправляет и делает их неработоспособными. Но есть выход. В команде "Вставка" > "Дополнительно" нажми HTML. При этом откроется окошечко, куда вручную или через клипбоард вносится нужный код и дается команда "OK". Тогда нужный код закрывается специальными тэгами и для редактора он вообще как бы перестает существовать. Исполняется все это в режиме "Normal". Например.

<!--webbot bot="HTMLMarkup" startspan -->
<a href="" onClick="window.open('гиперссылка', '1','resizable=no,menubar=no,scrollbars=yes,width=650,height=550,top=1'); return false;">Психологические тесты</a>
<!--webbot bot="HTMLMarkup" endspan -->

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

Вообще и писать и редактировать страницу можно в любом редакторе. А иногда это даже гораздо удобнее. Загрузи свою страницу в броузер. Кликни команду "Вид". Далее "В виде HTML". Откроется окно редактора Notepad. Найди нужное место и через клипбоард внеси нужный фрагмент кода. Нажми команду "Сохранить". В броузере нажми команду "Обновить" и увидишь результат. Это особенно удобно, когда при раскрутке тебе нужно будет добавлять коды кнопок и ссылок каталогов в которых ты будешь регистрироваться. И это нужно будет делать быстро, работая непосредственно в Интернет. Иногда, если страница большая по объему, Notepad может капризничать. Тогда запусти WordPad.

Отвлечемся немного и поговорим о дизайне. Сразу скажу, если ты скажешь какому либо профессионалу, что ты занялся вебдизайном и работаешь на FrontPage, он тебя осмеёт. В определенной степени он прав. Если он профессионал, то он работает давно и конечно формировался как специалист еще тогда, кода ни FrontPage, ни других подобных средств не было. Все делалось в текстовых редакторах и страница составлялась в коде HTML. Конечно, с его опытом, да используя некоторые средства, которые облегчают работу именно в HTML, можно составить документ и хорошо и может даже лучше чем в редакторе FrontPage. Скажу более того, возможно FrontPage (а есть и другие подобные ей программы) просто дрянной редактор. Когда посмотришь в коде HTML что он натворил на твоей странице, просто волосы шевелятся. Когда слегка освоишься, так и хочется все там причесать. Ну и Бог в помощь, если есть на то время
Будем надеяться, что со временем появятся новые версии редактора, и он будет работать все лучше и лучше. А пока так скажу, как бы над нами не посмеивался Тема Лебедев, другого пути у нас как у любителей просто нет. А потом, я лично думаю что постепенно все мастодонты вебдизайна вымрут, и никому в голову не придет составлять HTML-документ в текстовом редакторе, как сейчас никому в голову не приходит писать программы в машинных кодах.
Еще один фетиш профессионалов: единообразие дизайна страниц сайта. Да, это правильно для специализированного корпоративного сайта. Например разумно, если угольная компания имеет сайт у которого разные станицы (структура, задачи, производственные показатели, финансы и т.д.) имеют одинаковый дизайн.
Но посмотри на мой сайт, как я могу дать одинаковый дизайн и для теории измерительной информации, и для Храма, и для игр? Да к тому же, и одевать личину солидной промышленной компании мне просто не к лицу.
Любительский сайт должен быть легким, свободным, и никакие умствования профессионалов нам не указ.
Еще один вопрос. О браузерах. Война браузеров прошла. Что там ни говори а Explorer уверенно вытесняет Netscape. У меня оба браузера из последних версий есть. Netscape меня своими прелестями не удивил. Мне он показался хуже Explorera. Здесь некогда обсуждать их преимущества и недостатки, но думаю, что нормальные люди интересующиеся Интернетом находят возможности обновлять версии браузеров и постепенно переходят на Exsplorer. Совсем недавно говорили, что Нетскейпом пользуются половина интернетчиков. Сейчас уже говорят о десяти процентах. Может это важно для торгового сайта, где идет борьба за каждого покупателя. Может быть, но когда тебя начнут пугать этими проблемами злые профи, ты не очень пугайся. Вот моя статистика по Mail@List.ru:
Количество посетителей, пользующихся различными браузерами: браузер кол-во %
MSIE 5 366 72.9
MSIE 6 64 12.7
MSIE 4 47 9.4
Opera 4 11 2.2
Netscape 4 8 1.6
другие 6 1.2

Как видишь, браузерами Интернет Експлорер польуются подавляющее большинство посетителей - 95%. В число других входит, по видимому и NeoPlanet, по возможностям соответствующий Експлореру. Остальные около 4% - Opera и Netscape. Они по возможностям существенно отличаются от IE и, в основном в худшую сторону. В принципе, на эти 4% ты можешь наплевать, тем более, что в будущем этот процент будет быстро снижаться. Тем не менее знай, что бегущая строка в этих браузерах не выполняется, а вываливается весь текст. Неправильно отображаются ряд математических символов, например, греческие символы, Ö , и ряд других. Поэтому, если тебя эти четыре процента очень волнуют, не делай бегущей строки, или ограничь ее парой строчек. Математические тексты пиши в Word, при помощи FormulaEcvation(редактор формул).При этом формируются gif изображения с формулами. Не используй встроенные окна - тэг <iframe>. И конечно установи Opera и Netscape для тестирования страниц. В настройках страницы укажи Both Internet Explorer and Navigator.
Существует мнение, что страница должна быть сделана так, чтобы правильно отображалась в любом браузере. Это можно сделать, конечно, ориентируясь на IE3 и первые версии Netscape. Но при этом мы лишаем себя возможности использовать те достижения прогресса, которые реализованы в последних версиях браузеров. Иногда используют специальные Ява-скрипты, которые переделывают страницу под браузер посетителя. Иногда делают несколько страниц одного содержания под несколько браузеров. Но во первых, это настолько сложно, что не для нас - любителей, во вторых, страница в принципе построенная на современных технологиях уже никак не может быть переделана под устаревшие браузеры. Например мой раздел - "Полет во Вселенную" может исполняться только в IE5 и выше. И мое мнение состоит в том, что если посетитель желает использовать все возможности современной сети, будь добр, обновляй браузер.

© lvovssa

Сделать бесплатный сайт с uCoz