|
| |
Безкоштовні заняття по створенню й розкручуванню сайтів
Копіюю переписку по електронній пошті:
Привіт Всім!
Спробую перший урок веб-дизайна в загальне розсилання, на наступні Ви можете
підписатися на моєму сайті
Уроки будуть безкоштовні, консультації те ж... - це не виходить, що
безкоштовно - це сильно дорого
(заходить гарна дівчина в магазин - там парубок вилупленими
очами...
дівчина - скільки це коштує?
молодий чел. із грайливими вічками - для Вас безкоштовно
вона - ні, безкоштовно для мене це сильно дорого...)
Безкоштовно - це за символічну плату у вигляді посилань на мої сайти, на той
випадок, якщо Ви станете крутим веб-меном або крутий веб-вуменой і будете
штампувати й розкручувати сайти так само легко, як пишіть презентації й
любовні листи...
Почнемо:
1. Запасаємося програмным:
Знаходимо менеджер файлів - Дискокомандир, Виндовс-Командер, Фар і т.д.
Менеджер файлів необхідний для зручного накачування файлів на сервак "в инете"
http://snkey.net/download/webstudio/wssetup_ru.exe - набір програм для
створення сайтів і вивчення тегів від російського виробника!
2. Поки скачиваются програмки(якщо взагалі скачиваются) ми зробимо одну
сторінку й вывесем її без усяких програм підручними засобами:
Придумали зміст сторінки, якщо нічого в голову не лізе - робимо білий
квадрат або пишемо назву свого міста(от так, якщо в голову нічого не
лізе складаються шедеври-конкуренти чорному квадрату...)
Наприклад:
Олександрія
Я хочу щоб "в інтернеті" це слово відображалося в броузере рівно
посередине й більшими буквами й назва зверху теж!
Запускаємо звичайний виндовский блокнот і пишемо:
<Html>
<Title> Олександрія </title>
<body>
<br>
<br>
<br>
<br>
<br>
<H1 align=center>Олександрія</H1>
</body>
</Html> Ви напевно вже зрозуміли, що блокнот те ви запустите, але коряві символи
писати...? навіщо...? правильно - скопіювати й замінити Олександрію на Ваш
місто або на порожнечу, щоб Малевич знав наших - білий квадрат теж малювати
можемо...
Проробіть по дорозі ще одну операцію у винде - при відкритті будь-якої папки в
меню виду-властивості вид^-вигляд-вид-папка-вид- забрати пташку не показувати розширення для
зарегестрированных типів ужити-файл^-застосувати... Це потрібно, щоб легше міняти
розширення створених текстових документів
Далі зберігаємо блокнотовский
документик де Вам завгодно під будь-яким ім'ям, нехай на c:/www/1.тхт
наприклад...
Потім міняємо його назву на index.html (у винде тыкнули на
назва 1.тхт і замінили на index.html при цьому не лякайтеся, що винда при
цьому щось скаже - тисніть окей й якщо у Вас стандартні настроювання, то вид
іконки файлу поміняється на интернет-екплоеровский - так і повинне бути...)
Тепер можемо давити лівим батоном миші на файл два рази(або один - у кого
як...) і відкривати й насолоджуватися конкурентом Малевича... Якщо назва
міста не посередине - в интернет-эксплоере в меню вигляд-перегляд html-коду
відкривається той же блокнот і добавляем кілька разів тег <br> там де він уже
коштує, зберігаємо й обновляємо в ИЕ.5(або іншому броузере) - назва повинне переміститися нижче, а до нас
дійде, що тег <br> позначає на "мові хтмл" перехід на новий рядок, а
особливо розумні зададуться питанням - чому ми відразу не можемо задати
яким-небудь тегом вирівнювання по центрі по вертикалі? Я такого тегу не
знаю, можливо одним тегом вирівнювання по вертикалі не забезпечиться, тому
доводиться користуватися тим що є... і те не точне позиціювання -
залежить від дозволу(величини) відкритого вікна...
Тепер залазимо в инет, на narod.ru і там ліворуч угорі - реєстрація,
реєструємо акаунт(схоже на реєстрацію пошти), одержуємо логин й
пароль(тобто їх самі придумуємо, логин такий - щоб ні в кого не було...). В
підсумку одержуємо назву сайту типу www.rd132.narod.ru - тільки що
зарегестрировал і вивісив сторінку... У Вас повинне бути своє... Для
відправлення файлу "в инет на сервак" входимо у свій аккаунт, натискаємо посилання
завантаження файлів, на народі побачите праворуч під керуванням файлів, потім тиснемо
огляд (будь-який "огляд" на вибір, логічніше перший... але дівчинам можна й
іншої - різниці немає...) і вибираємо на своєму компе сделаный index.html й
тиснемо завантажити файли... Далі для перевірки набираємо адреса
зарегестрированного сайту в адресному рядку - www.xxx.narod.ru (де ххх -
це не порнуха, а Ваш логин...) і перевіряємо що бачимо в оглядачі -
повинні побачити те що хотіли... Посилання надішліть мені помилуватися - хто
надішле, того й будемо вважати підписаним на індивідуальні курси
"віртуальної кройки й шиття"...
Чекаю посилань
Пишіть
З повагою
Рашид
msd.com.ua
Тепер вставимо в сторінку картинку
Для цього спочатку підготуємо її у фотошопе або іншому редакторі фото... Я
умію у фотошопе, тому послідовно по фотошопу:
відкриваємо фото або картинку у фотошопе 7.0 російською мовою, будемо вважати
що картинка в *.jpg - відкриваємо, вибираємо при відкритті файли jpg(я вже
расчитываю, що ви маєте картинку на диску в жпг...)
вибираємо інструмент виділення, виділяємо на фото область, що хочемо
бачити "на фото в інтернет" і підрізаємо картинку - меню
изображение-кадрировать або обрізати(можна й без цієї операції - це просто
для навичок роботи з фотошопом... й якщо картинка вже така, який Ви хочете
її бачити те так само ця операція не потрібна)
У меню зображення вибираємо розмір зображення й ставимо там дозвіл 72
пиксель на дюйм, записуємо поки на папірець скільки крапок або пикселей він
виходить у висоту(у мене 384, у Вас свій розмір) і ширину (у мене 247),
потім ок.- автоматом і картинка зменшиться по всіх параметрах(якщо до цього
був дозвіл більше...)
Далі вибираємо меню файл^-зберегти як- "ім'я на англ." формат jpg, вибираємо
якість десь 5(на Ваш розсуд... потрібно підібрати якість так, щоб вага файлу була менше й щось ще видно було й зрозуміло...) і
зберігаємо наприклад у тій же папці де index.html і нехай за назвою
001.jpg
Далі відкриваємо index.html
- відкриваємо його в коді й додаємо після тегу </H1> теги <div align=center><IMG SRC="001.jpg" ALT="Опис картинки" WIDTH="247"
HEIGHT="384" BORDER="0"></div>:
<Html> <Title> Олександрія
</title> <body> <br> <br> <br> <br> <br> <H1
align=center>Олександрія</H1> <div align=center><IMG
SRC="001.jpg" ALT="Наш співробітник робить шлакоблоки" WIDTH="247" HEIGHT="384"
BORDER="0"></div> </body> </Html>
Виправляємо цифри ширини й висот WIDTH="247" HEIGHT="384" на свої розміри
картинки й зберігаємо... Обновляємо в броузере. Якщо в тім же каталозі де
index.html зараз лежить 001.jpg те Ви побачите результат - картинка під
написом...
Тепер відправляємо "файло в инет":
На народ, у свій аккаунт, завантаження файлів- огляд перший вибираєте
index.html, другий огляд - вибираєте 001.jpg - далі завантажити
файли(перезаписати існуючий...) і знову перевірка посилання - моя от
http://rd132.narod.ru/
Чекаю Вашої!
З повагою
Рашид
msd.com.ua
Веб-мастеринг - одне зі справ,
де балаканина легко перевіряється результатами "в инете"
Їдемо далі:
Відкрили индех, відкрили код, потім файл зберегти як 1.нтмл, потім так само
2.нтмл - тобто створили два (три разом з індексом) файлу хтмл у тієї ж
папці... Поки вони однакові по змісту й різні за назвою...
Відкриваємо код індексу й додаємо як у мене:
<Html> <Title> Олександрія
</title> <body> <br> <br> <br> <br> <br> <H1
align=center>Олександрія</H1> <div align=center><IMG
SRC="001.jpg" ALT="Наш співробітник робить шлакоблоки" WIDTH="247"
HEIGHT="384" BORDER="0"></div>
<BR> <BR> <A HREF="1.html">1.</A>
<A HREF="2.html">2.</A>
</body>
</Html>
Далі- зберегтися-обновити в броузере й подивитися на результати:
Я додав два переходи на новий рядок й 1. і 2. помістив у посилання
тепер, якщо нажати на кожну з них - перейдемо на такі ж сторінки, але під
іншою назвою...
Підготуємо ще дві картинки різні й аналогічно
попередньому уроку, де ми вставляли картинку в документ вставимо ці нові
картинки в 1.html й 2.html
Якщо зараз ми будемо гуляти по "своєму сайті" -
те побачимо ще й зміну картинок... В "титлах" міняємо "назви сторінок на
синім тлі" - наприклад на опис нових картинок, так само й у тілі
напис...
Додаємо в тілі нових документів посилання "на головну":
Це мій 1.html:
<Html> <Title> Рашид
</title> <body> <br> <br> <A
HREF="index.html">На головну</A><br> <br> <br> <H1
align=center>Рашид</H1> <div align=center><IMG
SRC="fotorashid.jpg" alt="Фото" WIDTH="160" HEIGHT="386"
BORDER="0"></div>
</body>
</Html>
Це мій 2-й:
<Html> <Title> Женя з папою
</title> <body> <br> <br> <A
HREF="index.html">На головну</A> <br> <br> <br> <H1
align=center>Женя з папою</H1> <div align=center><IMG
SRC="evgeni.jpg" ALT="Сімейне фото" WIDTH="500" HEIGHT="1403"
BORDER="0"></div>
</body>
</Html>
Разом у мене в папці нагромадилося вже 6 файлів - 3 хтмл і три картинки, можна
сказати вже цілий сайт!
Закидаємо всі файли на сервак (народ-аккаунт-загрузка
файли-огляди....завантажити... Ви в курсі...)
Любуємося й даємо посилання мені помилуватися
Моє посилання там же - www.rd132.narod.ru
З повагою
Рашид
П.С. Після виконання цього завдання запасіться програмами - Виндовс-Командер або Диско-Команидир й
Воркшоп. Якщо їх ні, повідомите які подібні Вам доступні, бажано дайте
посилання в инете, де них скачати для вивчення
Виндовс-Командер потрібний щоб відправляти оптом файли на сервак(ФТП клієнт)
Воркшоп - щоб не набирати теги вручну...
Робота фтп клієнта по фару:
У Фарі:
натискаємо алт+ф2 переходимо на фтп створюємо обліковий запис натискаючи шифт+ф4 для
народу виглядає так:
ftp://xxx:пароль@ftp.narod.ru - портів директорій заповнювати не треба, замість
ххх - Ваш логин на народі, замість пароля - Ваш пароль...
пароль той же набили
опис зробили будь-яке
далі save - запис створений, при підключеному инете на неї ентер -
підключиться до народу й Ви в панелі побачите свої фали, що лежать на народі...
праворуч преходите в каталог із сайтом (до цього ви вже змінили файли сайту,
поміняли зміст і т.д.) і далі зрівняли директорії, коли
курсор у лівій панелі й замінили файли в инете копіюванням і заміною... не
розберетеся - запитуйтеся
Робота фтп-клиента у Виндовс-Командер:
У меню підключення^-з'єднатися із фтп-сервером вибрали додати й створили обліковий запис:
- заголовок кожної, щоб Вам зрозуміліше на який сайт руку піднімаєте - якщо облікових записів багато...
- адреса:порт - адреса сервака, наприклад by.ru порт не обов'язково
- обліковий запис - логин(наприклад msd.com.ua)
- пароль - напевно зрозуміло що писати...
все інше як є за замовчуванням...
потім якщо тыкнуть кнопку з'єднатися, так ще якщо Ви в мережі, а до цього курсором був виділений який-небудь файл на лівій (або правої) панелі - те відповідно в лівій або правій панелі(де до цього був курсор) з'являться каталоги Вашого аккаунта на серваке. Що з ним робити - напевно розберетеся. Переваги Windows-Comander перед деякими іншими файлами-менеджерами - це те, що перед копіюванням на сервак ставимо пташку "перевести все імена в нижній регістр" і більше нас не хвилює проблеми більших і малих букв в інтернеті, тому що багато хто серваки відрізняють більші букви в назвах файлів і малі й у Вас(нас) можуть бути проблеми з відображенням наприклад картинок у документі або в роботі посилань... (html-лити треба теж звикнути малими буквами)
У будь-якому менеджері файлів звичайно є стандартна команда - сравинить директорії. Після порівняння директорій, допустимо праворуч файли в инете, у лівій панелі - локальні(нов і змінені), копіюємо змінені й нові файли на сервак, при копіюванні змінених "менеджер файлів" запитає про заміну - підтвердити... і т.д.
по моєму у фарі эьто робиться так - Ф9- сомандс-compsre folders...
у Виндовс-Командере: виділення^-зрівняти каталоги...
З повагою
Рашид
Привіт процвітаючим Веб-Мастерам! Ще одне корисне заняття по
"веб-дизайну": Часто для форматування хтмл документа дизайнер використає
таблиці як з видимими границями осередків, так і з невидимими(останнє
частіше). За допомогою таблиць можна вирішити багато роблем "гарного"
розміщення інформації у веб... Приклад скачайте тут, скопіюйте файли в одну
папку й відкрийте хтмл документ... Пояснюю: Для розміщення інформації
була використана таблиця із трьома стовпцями, вона описана тегами:
<table> <tr> <tb></tb> <tb></tb>
<tb></tb> </tr> </table>, де <tr></tr> -
рядок таблиці, <tb></tb> - осередок(у цьому випадку й
стовпець таблиці), інформація усередині осередку відображається в броузере як в
стовпці певної ширини, її можна задати атрибутом WIDTH="20%" - так й
задана ширина першого стовпця(20% від ширини всієї таблиці) Далі в
одному осередку вставлена ще таблиця з 4-мя рядками й одним стовпцем - типу
розміщено посилання... і квітчасті осередки, самі пограйте квітами й зрозумійте
який атрибут описує кольори тла осередку, а так само кольори тла
сторінки... Пограйтеся іншими тегами й атрибутами в документі(у коді
хтмл), зберігайте, обновляйте в броузере й побачите призначення тегів й
атрибутів у результатах відображення Успіхів! З
повагою Рашид msd.com.ua
Як інтернет допомагає в розвитку бізнесу
Тривимірна й двомірна анімація
Для чого нам сайт?
Можливості інтернет
20$ за сайт. Чому так дешево?
Особливості національної інтернет торгівлі
Контакти для замовлень і пропозицій:
Україна, м. Олександрія, Куколовское шосе 5. Олександрійський Авторемонтний Завод
т./ф. +38 05235 41358
тел. +38 067 2650755 гл.менеджер МСД (ціни, умови приобритения, консультації)
тел. +38 067 6021423 нач. виробництва МСД (технічні питання, постачання)
тел. +38 067 9452074 помічник нач. виробництва по постачанню (постачання, потреби МСД)
тел. +38 050 4571330 - по загальних питаннях
тел. +38 050 6940864 - секретар (питання прийому-передачі факсів, эл.пошти)
Як до нас дзвонити із країн СНД і далекого зарубіжжя?!
E-mail: msd@inbox.ru
Як до нас добратися: Відкрити карту-схему
|
|
|
