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

Азбука сайтостроения: HTML, CSS, PHP для "чайников"

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

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

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

  Октябрь 2010   →
 1
 2
 3
 4
 5
 6
06.10.2010
15:14:53
15:28:56
 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
Автор
kapitansg@yandex.ru

Статистика

543 подписчиков
+2 за неделю
←   Все выпуски   →

Азбука сайтостроения: HTML, CSS, PHP для "чайников" Что такое html? 'Затачиваем' инструменты...


Азбука сайтостроения

Выпуск №4. Что такое HTML?

Здравствуйте. С Вами на связи Андрей Чернобай с выпуском рассылки «Азбука сайтостроения: html, css, php», которая создана в помощь тем, кто только начал  или ещё собирается начать создавать свой сайт. А может быть, не решается это начать делать, считая делом трудным, не зная, с чего начать…

Вот мы и добрались до собственно создания Web-страниц сайта: сегодня мы начнём изучать основу основ, фундамент сайтостроения. Это – язык гипертекстовой разметки Web-страниц. Или – HTML.

Что такое html и нужно ли его изучать?

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

Посмотреть html-код любой страницы можно, если (в частности, в Internet Explorer'е) кликнуть правой кнопкой мыши в любом месте страницы и в открывшемся меню выбрать строку "Просмотр HTML-кода". Откроется окно программы "Блокнот", и мы увидим много на первый взгляд непонятной информации, каких-то значков... Это и есть html-код страницы.

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

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

Однако кто-то может спросить: "А надо ли изучать этот самый HTML? Ведь есть же специальные программы, визуальные Web-редакторы, в которых можно создавать сайты, не зная никаких языков, кроме человеческого?"

Ответ: "Изучать, конечно, не обязательно". Можно создавать сайты и в визуальных редакторах. Но на своём опыте знаю: бывают ситуации, когда знать язык разметки просто необходимо, - чтобы исправить возможные ошибки. Например, создав свой первый сайт, залив его на хостинг, я обнаружил, что большинство ссылок не работает. На компьютере они работали и продолжали работать, а в Интернете - нет! Пришлось браться за учебник, изучать HTML-разметку.

Есть и ещё одна причина, по которой я настроен к визуальным редакторам несколько "воинственно". Они вставляют в разметку страницы много избыточного кода. Из-за чего страница весит больше. Так, изучив каскадные таблицы стилей (CSS), начав переделывать сайт в соответствии с новыми знаниями, я за голову схватился: сколько лишнего кода! На изучение каскадных таблиц стилей у меня ушло пара дней, а на "выпалывание" избыточного кода - две недели! Результат чистки - сайт стал весить почти в два раза меньше, страницы при загрузке, можно сказать, "порхали".

Конечно, всё, написанное выше, - моё субъективное мнение, основанное на моём личном опыте. Прочитав, Вы, возможно, махнёте на него и возьмётесь за визуальный редактор, мотивируя это какими-то своими соображениями, например, нехваткой времени на изучение HTML. Это, разумеется, каждый выбирает для себя сам. Но только время, сэкономленное на обучении, часто приходится потом всё равно тратить... на обучение, а также на переделку некачественно выполненной работы. То есть, тратить вдвое больше. Как видно, поговорка "жадный платит дважды" справедлива и здесь.

Но визуальный редактор очень даже полезен. Потому рекомендую найти Macromedia Dreamweaver 8 либо Adobe Dreamweaver (собственно, они, практически одинаковы; я осваивал Macromedia Dreamweaver 8 по самоучителю для Adobe Dreamweaver CS4) и установить на свой компьютер.

Основную же часть работы пока предлагаю выполнять в каком-нибудь текстовом редакторе, специально приспособленном для создания Веб-страниц. Например, HtmlReader v. 1.7. Можно и в обычном «Блокноте». Но HtmlReader удобней тем, что в нём есть подсветка кода, а также возможность добавлять фрагменты кода «в один клик».

Итак, подведём общий итог.

Продумав внешний вид будущего сайта, определившись с его тематикой, знакомимся с html и CSS. Попутно же подыскиваем специальные программы-редакторы для создания сайта, которые облегчат работу.

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

"Затачиваем" инструменты, или Программы для создания сайтов

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

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

Думаю, здесь всё понятно, и просто перечислю эти программы.

Веб-редактор

Например, Macromedia Dreamweaverр. Он потребуется для создания сайта (сойдёт, разумеется, любой другой Веб-редактор.

Файловый менеджер

Например, CuteFTP или Total Commander - для размещения сайта в Интернет. Но можно использовать тот же редактор Macromedia Dreamweaver.

Графический редактор

Например, Adobe Photoshop - для обработки изображений для сайта, книг, рассылок. Этой программы для начала достаточно. Если же в дальнейшем Вы захотите заняться созданием баннеров, анимации и прочих графических элементов, то есть программы, специально адаптированные для Веб. Например, Adobe Fireworks CS4 - графический редактор, предназначенный специально для создания графических элементов для Веб-страниц: кнопок, баннеров и пр. Adobe Flash CS4 - программа для создания анимации для сайтов.

Браузеры

Internet Explorer, Opera, Mozilla Firefox, Netscape Navigator.

Спросите, зачем столько?

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

Текстовый редактор

Например, AkelPad - удобный и быстрый текстовый редактор - альтернатива стандартному "Блокноту" Windows; с его помощью можно редактировать даже файлы "Только для чтения", предварительно просматривать файлы перед открытием. Но лучше всего установить текстовый Веб-редактор, о чём речь ниже.

Текстовый Веб-редактор HtmlReader

Например, HtmlReader. Когда Вы достаточно освоите html и CSS, лучше работать в текстовом редакторе, а визуальный использовать только в некоторых случаях.

Программа для создания всплывающих окон

Такая программа - Impact PopUp Pr, с её помощью изготавливают всплывающие окна, например, для подписки на рассылку.

Программы для создания электронных книг

Например, eBook Edit Pro или Activ E-Book. Если Вы планируете создавать свои электронные книги, то такие программы Вам потребуются.

Программа для снятия скриншотов (снимков с экрана монитора)

Например, SnagIt 8.

Программа для изготовления виртуальных обложекeCover Studio

Виртуальные обложки для информационных продуктов удобно создавать в eCover Studio.

Программа для создания видео

Например, Camtasia Studio или Instant Demo. С их помощью можно показать всё, что вы делаете на своём компьютере, сопровождая процесс голосовыми комментариями.

Сервер

Лучший сервер для работы со скриптами на РНР - Apache. Установленный на компьютере, поможет проверить работоспособность сайта без подключения к Интернету. Но для новичков (да и не только) предпочтительней установить программный пакет Денвер (Denver).

Звуковой редактор

Профессиональный звуковой редактор, - например, Sony Sound Forge, - поможет записать аудио-лекции.

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

Тогда закономерный вопрос: с чего начать? И где брать эти программы? И, кстати, не помешали бы обучающие материалы для их освоения.

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

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

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

Успехов.

С уважением,
Андрей Чернобай.

 

 

 
В избранное