Может быть, если этот кто-то узнает, что ты имеешь ввиду под "создавать сайты". Чтобы их просто создавать, надо знать языки разметки гипертекста, такие как HTML, PHP, Javasсriрt и другие.
Если ты имеешь ввиду оформление сайта (web-дизайн), то тут надо не только знать, но и уметь.
В общем, ты определись и если что - обращайся.
Я, конечно, не профи, но занимаюсь web-дизайном и созданием сайтов уже 3 года. Может, мой опыт как-то тебе поможет.
В крайнем случае, отправлю к знающим людям В общем, не брошу
Lily, тогда лови момент, пока я в сети )) А то очень скоро я уеду на заслуженный отдых туда, где нет цивилизации ))
На самом деле учителем я никогда не работала, поэтому не подозреваю как можно преподавать "web-дизайн".
Для начала мне нужно знать, что ты умеешь. HTML знаешь? Ну хотя бы структурные тэги? Думаю, знаешь А еще что умеешь? Тут надо начинать сначала, но если ты что-то уже знаешь, то глупо будет еще раз это тебе объяснять.
Для начала. Прежде всего сайт создается в твоем воображении. Ты придумываешь основу или какие-то детали, сама или с помощью кого-то рисуешь задуманное вначале на бумаге, обдумываешь, что можно добавить, как оформить. Подбираешь цвета, фотографии, картинки соответствующие теме сайта. Когда ты придумываешь, ЧТО делать, надо выбирать КАК делать.
Тут уж в зависимости от запросов применять свои познания в програмировании (если можно так выразиться).
Думаю, про то, что создавать сайт надо, не забывая о том, что видеть и читать его будут и другие люди (то бишь, надо учитывать то, что их может раздражать, например, мелкий шрифт, что пагубно скажется на посещаемости страницы), можно не говорить. Или надо обсудить такие моменты?
Lily, вопрос актуальный, но не по теме Уезжаю 28-ого июня, но не будет меня здесь уже 26-ого. Приеду в августе, скорее всего, в начале.
Только я так и не поняла, тебе структурные тэги знакомы?
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Это структура web-страницы. Надеюсь, тебе это известно.
Я думаю, для начала я тебе напишу про всякие мелочи (например, про то, как менять цвет ссылок, шрифтов, скролл-бара). В web-дизайне столько возможностей, что говорить обо всем можно до бесконечности ))
Может, у тебя уже какие задумки есть? На примере легче будет объяснять...
Lily, так я же говорю: жду вопросов и предложений. С чего ты хочешь начать? Что ты уже знаешь? Я не могу начать курсы, не зная, что ты уже умеешь Ты вообще с HTML работала? =)
Вот смотри: упрощенная версия HTML-кода одного из моих сайтов:
Да и вообще, похоже, что тебе придется объяснять мне с самого начала. Представь, что тебе нужно создать сайт, вот и объясни свои действия, как ты будешь его создавать, шаг за шагом.
Не знаю, получится так или нет, но попробовать стоит.
Напоминаю что в HTML существует 4 главных - структурных - тега:
<HTML>
<HEAD>
<TITLE>
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Все эти тэги парные, то есть имеют начало (например, <HEAD> и конец (например, </HEAD> Как ты поняла, закрывающий тег - это открывающий тэг, но только с символом "/" перед именем.
Использование парных тэгов лучше всего можно понять на примере с выбором шрифта:
...
<h1>Очень крупный текст</h1>
<b>Полужирный шрифт</b>
Стандартный шрифт
...
То есть, после закрывающего парного тэга прекращается или заканчивается так сказать его действие.
Это понятно?
Теперь про <TITLE> Внутри этого тэга ты можешь выбрать название странички. Например, эта страница называется "Очень хочу научиться создавать сайты, но не получа - Кто ищет - вынужден блуждать". Ты можешь в этом убедиться, открыв HTML-код (если ты в Explorer'e: Вид => Просмотр HTML-кода).
В тэге <HEAD> помещают информацию о стандартных значениях страницы (фон, скролл-бар, основной шрифт и т.д.), а в тэге <BODY> оформление текущей страницы (таблицы, текст, картинки и проч.)
Теперь о скролл-барах. Это полоса прокрутки.
Ее вид по умолчанию определяет браузер. Но иногда имеет место самому выбрать своиства скролл-бара, хотя бы из соображений дизайна.
Ладно, как менять скролл-бар расскажу в след раз. Сейчас мне пора. Разбирайся с полученной информацией и если что, задавай вопросы.
А теперь, как и обещала про полосу прокрутки. Специально нашла статью о ней
Итак, для задания оформления скролл-бара необходимо прописать таблицу стилей, следующего вида:
<style type=text/css>
<!--
body { scrollbar-face-color: #000000;
scrollbar-highlight-color: #999999;
scrollbar-shadow-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #333333;
scrollbar-darkshadow-color: #666666; }
//-->
</style>
А теперь подробно разберем каждое из используемых свойств:
scrollbar-face-color - задаёт основной цвет скролл-бара, а также цвет двух завершающих кнопочек со стрелочками. Если Вы даже не укажите свойство scrollbar-track-color, то цвет трека определиться автоматически, как более яркий нежели цвет scrollbar-face-color.
scrollbar-highlight-color - устанавливает яркий цвет подсветки, создающий эффект объёмности, то есть цвет, для освещённой части скролл-бара и кнопочек. Этим цветом отображается левый верхний угол самого скролл-бара и двух кнопочек (когда они не нажаты).
scrollbar-shadow-color - устанавливает темный цвет подсветки, создающий эффект объёмности, то есть цвет, для теневой части скролл-бара и кнопочек (цвет тени). Этим цветом отображается правый нижний угол самого скролл-бара и двух кнопочек (когда они не нажаты).
scrollbar-3dlight-color - определяет цвет падающего цвета для создания трехмерности скролл-бара. На практике это выражается в цвете тоненькой кромки, находящейся в левых верхних углах, ближе к краю нежели scrollbar-highlight-color.
scrollbar-arrow-color - определяет цвет двух маленьких стрелочек, находящихся на кнопочках крайних позиций скролл-бара.
scrollbar-track-color - задает цвет трека, то есть дорожки прокрутки, по которой собственно и перемещается сам скролл-бар.
scrollbar-darkshadow-color - определяет цвет откинутого цвета для создания трехмерности скролл-бара. На практике это выражается в цвете тоненькой кромки, находящейся в правых нижних углах, ближе к краю нежели scrollbar-shadow-color.
Значение этих свойств (цвет) определяется в виде именованных цветов или кодов цветов (для этого ставится символ "#", а за ним без пробела шесть шестнадцатеричных чисел, определяющих цвет в кодировке RGB).
Открой стандартный "Блокнот". Скопируй в него следующий код:
<HTML>
<HEAD>
<TITLE>Первая страница </TITLE>
<style type=text/css>
<!--
body { scrollbar-face-color: #000000;
scrollbar-highlight-color: #999999;
scrollbar-shadow-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #333333;
scrollbar-darkshadow-color: #666666; }
//-->
</style>
</HEAD>
<BODY>
Урок-практикум
</BODY>
</HTML>
И сохрани под именем index с расширением .htm или .html.
Стандартно в Блокноте текстовые файлы сохраняются с расширением .txt но тут особенный случай, поэтому ты должна сама задать расширение.
Сохраненную страницу открой и посмотри html-код. При желании, поменяй цвета скролл-бара, текст или название странички. В общем, просто осмотрись и попрактикуйся.
P.S. Узнать код цвета для web-страниц ты можешь в Adobe Phptoshop.
Все получилось! Немного попрактиковалась. Здорово. Вот только Photoshop-а у меня нет. Жалко. Так вроде все понятно. На практике усваивается легче, чем просто теория. Вот и все. Можшь продолжать уроки
Чтобы узнать шестизначный код какого-либо цвета, также можно использовать программу ColorImpact. Она даже удобнее Adobe Photoshop. Если будет возможность, поищи ее. Полезная вещь в хозяйстве web-дизайнера, хотя без Фотошопа тоже не дело. Надо приобретать
Немного о тексте. Текст и информация о нем вводятся внутри структурного тэга <BODY>.
Рассмотрим этот пример. Парный тэг <font> отвечает за шрифт. Внутри него можно задать цвет, размер, название шрифта. Тэги <b> и <i> - парные. Соответственно отвечают за полужирный шрифт и/или курсив. Можно писать текст без всяких обозначений, но надо иметь в виду, что отображаться он будет по умолчанию так, как это определяет браузер. Конечно, лучше самому задать все параметры текста.
Чтобы сделать перенос на другую строку, используеься НЕпарный тэг <br>. Он пишется в конце строки. Учти, что текст, в котором не определены абзацы (о них позже) и места перехода на другую строку, будет отображен сплошным текстом. Это легко понять на примере:
...
<body>
Первая строка
Вторая строка
Третья строка
</body>
...
В html-коде каждая фраза расположена на новой строке, а на странице - все на одной строке.
К тому же браузер игнорирует большое количество пробелов. Пример:
Атрибут FACE отвечает именно за стиль. Как видишь, в ковычках чяерез запятую отмечены разные шрифты. Главным является VERBANA - он стоит первый в списке. Зачем такое количество шрифтов? Не у всех пользователей есть такой же шрифт, как у тебя. Ты, конечно, можешь сама выбрать стиль, но учитывай, что у пользователя, у которого нет такого же шрифта, текст может неправильно отображаться. Лучше перечислить несколько подходящих к твоему дизайну стилей, чтобы браузер мог подобрать оптимальный вариант
Иногда текст необходимо разбивать на абзацы. Это можно сделать, применив 2 раза тег <br> (получится, между абзацами пропущена строка), или используя специальный тег <p>. Внутри этого тэга можно указывать параметры абзаца. Например, выравнивание по правому краю (<p align=right>), по левому краю (<p align=left>), по середине (<p align=center>) или по всей ширине страницы (<p align=justify>).
Сейчас я редко появляюсь в нете, поэтому не могу вести занятия. К тому же надо придумать, о чем еще тебе рассказать, подготовить материал, примеры... но может у тебя есть еще какие-нибудь вопросы?..
-
-
13.06.2005 в 10:10Если ты имеешь ввиду оформление сайта (web-дизайн), то тут надо не только знать, но и уметь.
В общем, ты определись и если что - обращайся.
Я, конечно, не профи, но занимаюсь web-дизайном и созданием сайтов уже 3 года. Может, мой опыт как-то тебе поможет.
В крайнем случае, отправлю к знающим людям
-
-
17.06.2005 в 09:11-
-
17.06.2005 в 09:37На самом деле учителем я никогда не работала, поэтому не подозреваю как можно преподавать "web-дизайн".
Для начала мне нужно знать, что ты умеешь. HTML знаешь? Ну хотя бы структурные тэги? Думаю, знаешь
Для начала. Прежде всего сайт создается в твоем воображении. Ты придумываешь основу или какие-то детали, сама или с помощью кого-то рисуешь задуманное вначале на бумаге, обдумываешь, что можно добавить, как оформить. Подбираешь цвета, фотографии, картинки соответствующие теме сайта. Когда ты придумываешь, ЧТО делать, надо выбирать КАК делать.
Тут уж в зависимости от запросов применять свои познания в програмировании (если можно так выразиться).
Думаю, про то, что создавать сайт надо, не забывая о том, что видеть и читать его будут и другие люди (то бишь, надо учитывать то, что их может раздражать, например, мелкий шрифт, что пагубно скажется на посещаемости страницы), можно не говорить. Или надо обсудить такие моменты?
В общем, что-то я разговорилась
Жду вопросов и предложений )))
-
-
17.06.2005 в 13:38Но если честно, то я в создании сайтов - дуб дубом, вот поэтому и хочу научится.
Так что придется начинать все с начала. А насчет первого урока попробуем!
У мя вопрос: когда уезжаешь и приедешь?
-
-
18.06.2005 в 06:47Только я так и не поняла, тебе структурные тэги знакомы?
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Это структура web-страницы. Надеюсь, тебе это известно.
Я думаю, для начала я тебе напишу про всякие мелочи (например, про то, как менять цвет ссылок, шрифтов, скролл-бара). В web-дизайне столько возможностей, что говорить обо всем можно до бесконечности ))
Может, у тебя уже какие задумки есть? На примере легче будет объяснять...
-
-
18.06.2005 в 12:23-
-
18.06.2005 в 18:12-
-
20.06.2005 в 07:50-
-
23.06.2005 в 10:44-
-
23.06.2005 в 10:56Вот смотри: упрощенная версия HTML-кода одного из моих сайтов:
<HTML>
<HEAD>
<TITLE>Diary of Britney Spears</TITLE>
</HEAD>
<BODY bgcolor="#F6EFD8" BACKGROUND="file://E:\Disk E\BRITNEY\new BSDiary/fon.gif">
<STYLE>
A:link {COLOR: #B39E5F; TEXT-DECORATION: none}
A:visited {COLOR: #B39E5F; TEXT-DECORATION: none}
A:hover {COLOR: #5D5018; TEXT-DECORATION: none}
A:active {COLOR: #B39E5F; TEXT-DECORATION: none}
BODY{scrollbar-face-color: #FAF0D7; scrollbar-darkshadow-color: #54543C;
scrollbar-shadow-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #54543C;
scrollbar-track-color: #FAF0D7; scrollbar-arrow-color: #5D5018; }
</STYLE>
</BODY>
</HTML>
Знаешь что тут где или объяснить?..
Кстати, мне нравится новое оформление дневника: яркое и красочное, очень летнее =)
-
-
23.06.2005 в 11:07Честно, я с HTML не работала, так что придется полностью объяснять, что ты мне написала!
-
-
23.06.2005 в 16:00Не знаю, получится так или нет, но попробовать стоит.
Жду новых уроков
-
-
09.07.2005 в 10:10-
-
02.08.2005 в 07:40-
-
05.08.2005 в 09:35-
-
05.08.2005 в 10:19Напоминаю что в HTML существует 4 главных - структурных - тега:
<HTML>
<HEAD>
<TITLE>
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Все эти тэги парные, то есть имеют начало (например, <HEAD>
Использование парных тэгов лучше всего можно понять на примере с выбором шрифта:
...
<h1>Очень крупный текст</h1>
<b>Полужирный шрифт</b>
Стандартный шрифт
...
То есть, после закрывающего парного тэга прекращается или заканчивается так сказать его действие.
Это понятно?
Теперь про <TITLE> Внутри этого тэга ты можешь выбрать название странички. Например, эта страница называется "Очень хочу научиться создавать сайты, но не получа - Кто ищет - вынужден блуждать". Ты можешь в этом убедиться, открыв HTML-код (если ты в Explorer'e: Вид => Просмотр HTML-кода).
В тэге <HEAD> помещают информацию о стандартных значениях страницы (фон, скролл-бар, основной шрифт и т.д.), а в тэге <BODY> оформление текущей страницы (таблицы, текст, картинки и проч.)
Теперь о скролл-барах. Это полоса прокрутки.
Ее вид по умолчанию определяет браузер. Но иногда имеет место самому выбрать своиства скролл-бара, хотя бы из соображений дизайна.
Ладно, как менять скролл-бар расскажу в след раз. Сейчас мне пора. Разбирайся с полученной информацией и если что, задавай вопросы.
Первый урок завершен
-
-
06.08.2005 в 11:28Итак, для задания оформления скролл-бара необходимо прописать таблицу стилей, следующего вида:
<style type=text/css>
<!--
body { scrollbar-face-color: #000000;
scrollbar-highlight-color: #999999;
scrollbar-shadow-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #333333;
scrollbar-darkshadow-color: #666666; }
//-->
</style>
А теперь подробно разберем каждое из используемых свойств:
scrollbar-face-color - задаёт основной цвет скролл-бара, а также цвет двух завершающих кнопочек со стрелочками. Если Вы даже не укажите свойство scrollbar-track-color, то цвет трека определиться автоматически, как более яркий нежели цвет scrollbar-face-color.
scrollbar-highlight-color - устанавливает яркий цвет подсветки, создающий эффект объёмности, то есть цвет, для освещённой части скролл-бара и кнопочек. Этим цветом отображается левый верхний угол самого скролл-бара и двух кнопочек (когда они не нажаты).
scrollbar-shadow-color - устанавливает темный цвет подсветки, создающий эффект объёмности, то есть цвет, для теневой части скролл-бара и кнопочек (цвет тени). Этим цветом отображается правый нижний угол самого скролл-бара и двух кнопочек (когда они не нажаты).
scrollbar-3dlight-color - определяет цвет падающего цвета для создания трехмерности скролл-бара. На практике это выражается в цвете тоненькой кромки, находящейся в левых верхних углах, ближе к краю нежели scrollbar-highlight-color.
scrollbar-arrow-color - определяет цвет двух маленьких стрелочек, находящихся на кнопочках крайних позиций скролл-бара.
scrollbar-track-color - задает цвет трека, то есть дорожки прокрутки, по которой собственно и перемещается сам скролл-бар.
scrollbar-darkshadow-color - определяет цвет откинутого цвета для создания трехмерности скролл-бара. На практике это выражается в цвете тоненькой кромки, находящейся в правых нижних углах, ближе к краю нежели scrollbar-shadow-color.
Значение этих свойств (цвет) определяется в виде именованных цветов или кодов цветов (для этого ставится символ "#", а за ним без пробела шесть шестнадцатеричных чисел, определяющих цвет в кодировке RGB).
-
-
06.08.2005 в 11:37Открой стандартный "Блокнот". Скопируй в него следующий код:
<HTML>
<HEAD>
<TITLE>Первая страница </TITLE>
<style type=text/css>
<!--
body { scrollbar-face-color: #000000;
scrollbar-highlight-color: #999999;
scrollbar-shadow-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #333333;
scrollbar-darkshadow-color: #666666; }
//-->
</style>
</HEAD>
<BODY>
Урок-практикум
</BODY>
</HTML>
И сохрани под именем index с расширением .htm или .html.
Стандартно в Блокноте текстовые файлы сохраняются с расширением .txt но тут особенный случай, поэтому ты должна сама задать расширение.
Сохраненную страницу открой и посмотри html-код. При желании, поменяй цвета скролл-бара, текст или название странички. В общем, просто осмотрись и попрактикуйся.
P.S. Узнать код цвета для web-страниц ты можешь в Adobe Phptoshop.
-
-
09.08.2005 в 19:47-
-
13.08.2005 в 11:28-
-
13.08.2005 в 19:51Чтобы узнать шестизначный код какого-либо цвета, также можно использовать программу ColorImpact. Она даже удобнее Adobe Photoshop. Если будет возможность, поищи ее. Полезная вещь в хозяйстве web-дизайнера, хотя без Фотошопа тоже не дело. Надо приобретать
Немного о тексте. Текст и информация о нем вводятся внутри структурного тэга <BODY>.
Пример:
...
<body>
<font color="ff0000" size=5><b>Первая строка</b></font><br>
<font color="00ff00"><i>Вторая сторока</i></font><br>
Третья строка
</body>
...
Рассмотрим этот пример. Парный тэг <font> отвечает за шрифт. Внутри него можно задать цвет, размер, название шрифта. Тэги <b> и <i> - парные. Соответственно отвечают за полужирный шрифт и/или курсив. Можно писать текст без всяких обозначений, но надо иметь в виду, что отображаться он будет по умолчанию так, как это определяет браузер. Конечно, лучше самому задать все параметры текста.
Чтобы сделать перенос на другую строку, используеься НЕпарный тэг <br>. Он пишется в конце строки. Учти, что текст, в котором не определены абзацы (о них позже) и места перехода на другую строку, будет отображен сплошным текстом. Это легко понять на примере:
...
<body>
Первая строка
Вторая строка
Третья строка
</body>
...
В html-коде каждая фраза расположена на новой строке, а на странице - все на одной строке.
К тому же браузер игнорирует большое количество пробелов. Пример:
...
<body>
Вот строка с большим количеством пробелов.
</body>
...
Пока все. Изучай! =)
-
-
24.08.2005 в 15:05Теперь меня мучает любопытство и нетерпение. Что дальше?
-
-
26.08.2005 в 07:54А здесь?
-
-
26.08.2005 в 16:34Пример:
<font face="Verbana,Helvetica,Geneva,Swiss,SunSans-Regular" size="2" color="5D5018">
Атрибут FACE отвечает именно за стиль. Как видишь, в ковычках чяерез запятую отмечены разные шрифты. Главным является VERBANA - он стоит первый в списке. Зачем такое количество шрифтов? Не у всех пользователей есть такой же шрифт, как у тебя. Ты, конечно, можешь сама выбрать стиль, но учитывай, что у пользователя, у которого нет такого же шрифта, текст может неправильно отображаться. Лучше перечислить несколько подходящих к твоему дизайну стилей, чтобы браузер мог подобрать оптимальный вариант
-
-
26.08.2005 в 16:54Иногда текст необходимо разбивать на абзацы. Это можно сделать, применив 2 раза тег <br> (получится, между абзацами пропущена строка), или используя специальный тег <p>. Внутри этого тэга можно указывать параметры абзаца. Например, выравнивание по правому краю (<p align=right>), по левому краю (<p align=left>), по середине (<p align=center>) или по всей ширине страницы (<p align=justify>).
Каждый абзац закрывается парным тэгом </p>.
Пример:
...
<p align=justify>
Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1, Абзац №1
</p>
<p align=right>
Абзац №2, Абзац №2, Абзац №2, Абзац №2, Абзац №2, Абзац №2, Абзац №2
</p>
<p align=left>
Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3
</p>
<p align=center>
Абзац №4, Абзац №4, Абзац №4, Абзац №4, Абзац №4, Абзац №4, Абзац №4
</p>
<p align=left>
Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3, Абзац №3
</p>
...
Выравнивание по левому краю я использовала 2 раза, чтобы ты могла сравнить его с атрибутом JUSTIFY.
Изучай! :)
-
-
29.08.2005 в 07:04-
-
03.09.2005 в 09:08-
-
04.09.2005 в 15:11Сейчас я редко появляюсь в нете, поэтому не могу вести занятия. К тому же надо придумать, о чем еще тебе рассказать, подготовить материал, примеры... но может у тебя есть еще какие-нибудь вопросы?..
-
-
05.09.2005 в 12:20Ладно, буду ждать.
-
-
12.09.2005 в 14:05