Отправляет email-рассылки с помощью сервиса Sendsay

Вместе весело шагать... или Давайте строить вместе!

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "В помощь начинающему web-мастеру" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Декабрь 2007   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
KontE

Статистика

444 подписчиков
0 за неделю
←   Все выпуски   →

Вместе весело шагать... или Давайте строить вместе!


Шагаем дальше!!!

Привет, моим старым и новым друзьям! Нас становиться больше с каждым днем! И это здорово. Спасибо всем, кто подписался! Мы медленно, но верно идем к нашей заветной цели )) Если ты первый раз получаешь письмо с этой рассылкой, не поленись, зайди и почитай предыдущие выпуски, дабы было более понятной и манера общения и все остальное. А можно, конечно, посетить блог на котором есть все выпуски рассылки!

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

       Ну, что же, давай приступим. Но… (эх, чуть не забыл о самом главном) какими  программами нам нужно будет пользоваться? Ну, графику мы пока не будем использовать. А значит (ведь ты же помнишь) нам предстоит работать, по сути, с обычным текстом. Если говорить откровенно, то для создания простого сайта из нескольких страничек, достаточно будет стандартной программы «Блокнот», которая есть в каждом Windows. По идее, нам с тобой можно воспользоваться и ей. Но, заглянем в недалекое будущее и увидим, что сайт наш стал гораздо больше и с нашим «Блокнотом» нам уже тяжело его редактировать! Есть множество замечательных редакторов. Например, сгодиться и аналог «Блокнота» - «Bred». Чем хороша эта небольшая программка, так это подсветка html-кода, автоматическое определение кодировок и много других полезных фишек. Не буду проводить здесь обзор всех возможных редакторов, просто поделюсь информацией о том, какой редактор нравится  лично мне и почему. На мой взгляд, ничего лучшего, чем Macromedia Dreamweaver, для web-мастеров еще не было придумано. И вот почему:

·        Свобода выбора используемых технологий (ты можешь делать сайт как на «голом» HTML, так и использовать такие средства как php, J2EE, Microsoft .NET и другие.)

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

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

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

Это далеко не полный список достоинств данного продукта, но уже должно быть понятно, что «игра стоит свеч» ;) Мой личный совет: обязательно приобретите данную программу.

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

           И вот теперь мы готовы создать нашу с тобой первую страницу. Во многих (почти во всех) учебниках изучение начинается с банального и уже надоевшего всем упражнения «Hello, World!» «Привет Мир!». Мы не пойдем этим путем и сделаем что-нибудь пооригинальнее!

Когда-то, в 1999 году (Боже, как быстро летит время!) я учился в медицинском училище. Да, да, я - медработник ;)) Нам привезли и установили в кабинет информатики самые новые компьютеры на тот момент. Как раз тогда я уже был знаком с интернетом, и мне на глаза попалась замечательная книжка о компьютерах. Не помню сейчас уже, как она называлась. Помню одно, что, в числе прочего, в ней была глава, посвященная HTML. Это не было полное руководство, но написано было достаточно для того, чтобы сделать простенькую страницу. И я решил, что сделаю страницу об училище и сделал. Жаль тот «шедевр» не дожил до наших дней! Но суть в том, что все работало!!!

         Теперь, давай, и мы напишем свою первую страничку! Пусть она будет не совсем грамотно сделана, но будет работать и делать то, что мы от нее хотим! ;))

 Итак, открываем удобный нам редактор и пишем следующий код:

<html>

<head>

<title>Ура! Мы сделали сами эту страницу!</title>

</head>

 

<body>

 

Привет всем! Вы находитесь на моем сайте! <br>Я сделал его сам только что ;)

 

</body>

 

</html>

Теперь рассмотрим, что есть что в этой записи:

Текст, расположенный в угловых скобках <> называется ТЭГОМ. Это своего рода команда языка HTML, выполняющая то или иное действие. Причем, обрати внимание, на то, что имеются тэги с косой чертой </> это, так называемые – закрывающие тэги, которые заканчивают действие, инициированное открывающим тэгом.

<html>-этот тэг указывает на принадлежность документа к HTML. Этот тэг всегда начинает страницу!

<head>-этот тэг, если в школе у тебя не было проблем с Английским, означает – голова. Между этим тэгом и его закрывающим «братом» )) пишется заголовок сайта.

<title>Ура! Мы сделали сами эту страницу!</title>-эта конструкция создает заголовок страницы. Думаю, тут все понятно?

</head>>-этот тэг, уже все понятно, закрывает «Голову» ))

 

<body>>-этот тэг означает тело страницы. Именно внутри этой конструкции пишется вся видимая часть.

 

Привет всем! Вы находитесь на моем сайте! <br>Я сделал его сам только что ;) –а вот здесь мы увидели не парный тэг <br> Если ты увидел уже результат действия нашей страницы, то можешь догадаться, для чего он нужен. Правильно, чтобы переносить на следующую строку!

 

</body>-этот тег уже не вызывает вопросов ;))

 

</html>-этот тоже )))

 

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

Для этого нам понадобится собственно фотография и еще одна строчка кода.

К примеру, картинка у нас называется «picture.jpg».

<html>

<head>

<title>Ура! Мы сделали сами эту страницу!</title>

</head>

 

<body>

 

Привет всем! Вы находитесь на моем сайте! <br>Я сделал его сам только что ;)<br>

 

<img src=”picture.jpg” alt=”мое фото”>

 

</body>

 

</html>

Новый код я выделил другим цветом. А означает он следующее img src=”picture.jpg” это указание вставить в страницу картинку, которая находится в том же каталоге, что и наша страница, и имеет имя picture.jpg

Адрес можно указывать полный даже так <img src=”http://site.com/ris/picture.jpg”>

Параметр alt=”” выводит текст, который будет на месте картинки, если она, по каким-то причинам не загрузится.

Ну вот пока и все! Поэкспериментируй на досуге. А уже в следующий раз мы отправим наш сайт на сервер и добавим ему функциональности!

Как всегда, я рад твоим письмам support@vant.us

Василий.   

                                  

 
В избранное