Поради щодо створення Web-сайтів у конструкторах Zibycom

Поради щодо створення Web-сайтів у конструкторах Zibycom

1.Загальні положення

Спочатку поставимо собі риторичне питання – для кого ми створюємо сайт: для себе чи для відвідувачів?! Якщо все-таки останнє, то давайте і виходитимемо з того, як бачитиме і сприйматиме Ваші Web-сторінки Ваш відвідувач, а не Ви самі.

Перш ніж почати створювати сторінки, перевірте налаштування монітора комп'ютера. Вони мають бути оптимальними або середньостатистичними. А саме: більшість моніторів налаштовано (за замовчуванням!) надозвіл800х600. Тому якщо у Вас невеликий монітор (як і у більшості користувачів Інтернету!) типу 14 '-15', а Ви, для зручності, його налаштували на більшу роздільну здатність (1024х768 або навіть вище), то майте на увазі, що ті, хто користується моніторами 17 '-19' або навіть більшими та налаштованими на роздільну здатність 800х600, бачитимуть Ваші заголовки та Ваші тексти більшими, ніж Вам хотілося б.

Крім того, якщо Ви користуєтеся так званими кадрами і створюєте свої сторінки на роздільній здатності монітора вищому, ніж 800х600, то може виявитися так, що на моніторі аналогічного розміру, але налаштованому на "стандартну" роздільну здатність 800х600, частина кадру виявиться невидимою користувачеві. Але саме в цій частині фрейму Ви, можливо, розмістили важливу для Вас інформацію – наприклад, рядок-таблиця посилань.

2.Властивості сторінки

Один з найголовніших моментів під час створення будь-якої Web-сторінки.

З іншого боку, "модемники", які платять тільки за час перебування в мережі, також часто "вимикають" заздалегідь "картинки" та інші принади "мультимедіа" саме тому, щоб ці сторінки "завантажувалися" швидше (і, отже, коштували " подешевше”).

Для початку зайдіть: Сервіс - Властивостіоглядача – Додатково – Мультимедіа та зніміть прапорець з меню “Відображати малюнки”. Потім натисніть “Застосувати”, “ОК” та “Оновити”.

Ви бачите (як і я), текст жовтого кольору на білому тлі… - тобто дуже сторінку, що важко “читається”. В дійсності, якби на Вашому оглядачі були "включені" "картинки", Ви побачили б цей "жовтий" текст на майже чорному "картинковому" тлі і це було б цілком читаним. Якби web-майстер зробив фон підкладки чорним або темним, але не білим, ця сторінка виглядала (вірніше читалася) цілком нормально і в режимі "вимкнених картинок".

завжди задавайте відповідне колірне тло для підкладки у тому випадку, якщо Ви використовуєте “картинковий” (“текстурований”) фон для Вашої сторінки.

З урахуванням вибраного фону вибирайтеколір посилань. Якщо вони будуть кольори подібного до кольору фону, то виглядатимуть майже нечитаними.

Якщо на сторінці багато посилань, то краще задати колір відвіданих посилань відмінним від кольору не відвіданих посилань, щоб відвідувачі сайту легко орієнтувалися: де вони вже були, а де ще немає.

Відмінність web-сторінки від звичайної сторінки (яка, до речі, також завжди має поля!) полягає перш за все в тому, що ця сторінка як би на 90 градусів повернена і тому рядки ще більш довгі, ніж на звичайній сторінці.

Зазвичай значення полів у 3 або 4 умовних одиниці роблять Вашу сторінку більш “удобочитаною”.

Якщо ж Ви використовуєте "манжетний" фон і не задає розміру полів, то Ваш текст (картинки та інші об'єкти) "заповзатимуть" на манжету і можуть виявитися погано видимими на сторінці.

Ви також можете встановитисвоє тло. Для цього спочатку завантажте його на сервер Zibycom черезМенеджер файлів (Завантажити файли). Потім натисніть врозділ "Властивості сторінки" ("Почніть тут"), наприклад, на слова "Вибрати більше манжетних фонів". Внизу сторінки відкрийте список наявних картинок та виберіть потрібне Вам як тло зображення. Потім натисніть “ОК”.

Не нехтуйтемета-тегами! Це ті слова, які не відтворює браузер при відображенні Вашої сторінки, але які “бачать” так звані спайдери (“павуки”) пошукових машин, завдяки чому Ваша сторінка буде швидше відшукується.

З цим "інструментом" все просто і зрозуміло. Однак уникайте надто великого розміру шрифту для заголовка. Якщо Ви використовуєте "звичайний" (3-й або "стандартний") розмір шрифту для тексту, який буде розташований нижче, не слід вибирати для заголовка розмір шрифту більше, ніж 4 або 5. Не слід також вибирати "екзотичні" шрифти для заголовка (як і для тексту!) - далеко не всі оглядачі здатні їх відтворювати. Саме тому вибір шрифтів, що надаються конструкторами Zibycom не настільки широкий, як є, наприклад, у тому самому Microsoft Word.

Якщо Вас не влаштовує колір шрифту для заголовка – Ви можете створити власний колір. Для цього клацніть у гурток під словом "змішати". У вікні Ви можете легко створити будь-який колір як для заголовка, так і для тексту або фону. Один тільки момент слід врахувати - якщо Ви хочете обраний Вами колір використовувати надалі для інших сторінок, то спишіть "номер" (літерно-числовий код) Вашого кольору і надалі просто набирайте його у відповідному полі, щоб не намагатися щоразу знову його створювати (Невелика ймовірність, що Вам знову вдасться точно це зробити!).

Тут ті ж рекомендації, що й у попередньому розділі.

Краще не використовувати розмір шрифту для тексту більше, ніж 3-й (звичайний)або "стандартний") або, у крайньому випадку, 4-й.

Тут Ви можете також трохи "прикрасити" Ваш текст, використовуючи найпростіші HTML-теги.

Якщо Ви хочете зробити якесь слово (або фразу) більш "жирним", ніж решта тексту, поставте перед ним "відкриваючий" тег, а після нього "закриваючий" тег.

Щоб підкреслити потрібне слово або фразу, поставте перед ним тег, а після нього тег.

Курсив задається тегамиі, відповідно,.

Ці ж найпростіші теги можна використовувати в опції “Заголовок”.

5. Картинка/кнопка

Перш ніж завантажити свою картинку на сайт, Ви повинні її привести в "потрібний" вигляд за допомогою будь-яких програм обробки зображень. Найпрофесійніша (і тому найскладніша) програма – Adobe Photoshop.

Але є й простіші. Наприклад, Microsoft Photo Editor або Live Pix.

Якою б програмою Ви не користувалися, пам'ятаєте про те, що картинка не повинна бути надто великою (значення має не так її реальний розмір у сантиметрах по вертикалі та по горизонталі, скільки “роздільна здатність” – тобто кількість “точок на квадратний дюйм”).

Врахуйте, що більшість моніторів не відтворюють більше, ніж 100 точок (“пікселів”) на квадратний дюйм, тому можете сміливо обмежувати дозвіл будь-якої картинки не більше ніж 72 пікселі на дюйм. В цілому ж Ваша картинка повинна бути не більше, ніж 20-30 KB, ну, максимум, 50 KB. Інакше завантаження сторінки з такими "великими" картинками може зайняти занадто довгий час і потенційний відвідувач просто не захоче чекати протягом кількох хвилин, доки Ваша сторінка завантажиться.

Не менш важливим, крім розміру картинок, єalt-text(альтернативний текст або текст-дублер). Якщо Ви використовуєте alt-text , то той, хто переглядає Вашу сторінку в режимі "вимкнених" картинок, бачить на їхньому місці цей самий alt-text і йому буде легко зорієнтуватися в тому, яка "прихована" картинка знаходиться на цьому місці.

Якщо Ви не хочете, щоб Ваша картинка розташовувалась по центру сторінки, зніміть прапорець біля слова "Центрувати", але тоді, якщо Ви хочете, щоб картинка розміщувалася на сторінці зліва, виберіть "Текст біля картинки" - "праворуч". Або "ліворуч", якщо хочете, щоб картинка розташовувалася на сторінці праворуч.

Пам'ятайте, що колір посилань (і відвіданих посилань) Ви задаєте в опції “Властивості сторінки” (“Почніть тут”).

Якщо Ви хочете, щоб посиланням стало будь-яке слово (фраза) у тексті, використовуйте найпростіший HTML-код. Поставте перед потрібним словом (фразою) тег, що відкриває, а після слова (фрази) – тег, що закриває. Все дуже просто!

7. Перенесення рядка (Вертикальний пробіл)

Якщо Ви хочете “рознести” по вертикалі створені Вами об'єкти, використовуйте інструмент “Linebreak” (“Вертикальний пробіл” або “Перенесення рядка”).

8. Користувальницький HTML-код

Найбільш важливий та цікавий для "просунутих" користувачів розділ конструктора.

Якщо Ви - "спец" в HTML, Ви можете тут створити свою сторінку з "нуля".

Або Ви можете вставити потрібні Вам HTML-коди, щоб встановити, наприклад, "лічильник відвідувачів" на свою сторінку або "гостеву книгу".

Одна тільки порада - не використовуйте коди, що містять Java-script, інакше Ваша сторінка може стати "нередагованою" і щоб внести до неї зміни потрібно буде її "переписати".

Це - найголовніший інструмент "конструктора". Якщо Ви хочете розташувати 2 (-3, 4, 5 і т.д.) "картинки" поруч або 2-, 3- колонки тексту -отже, Вам потрібна таблиця!

У цій "опції" Ви можете не тільки задавати колір кожного осередку, але й відстань між ними, а також між рядками таблиці.

Поекспериментуйте з різними варіантами. Ви також можете розміщувати Ваші об'єкти в різних областях осередку (зверху, посередині, знизу…).

Якщо Ви подивіться на більшість сайтів в Інтернеті, то Ви зверніть увагу, що майже всі вони (принаймні більшість!) зроблені "у таблиці", тому, якщо Ви досягнете певного професіоналізму у створенні таблиць - Ви зможете наблизитися до створення " професійних сайтів”…

Перед тим, як “піти” з Вашої сторінки – Ви повинні їїзберегти!

Інакше всю працю буде витрачено даремно! При запам'ятовуванні Ваших сторінок Ви можете використовувати не тільки їх "стандартні" назви (index2 (3, 4,5 і т.д.). .html, koshka.html і т.д.)

11. Колір користувача

12. Вертикальна пробіл (Перенесення рядка)

Якщо ви хочете зробити більше відстань між об'єктами або "опустити" трохи нижче перший об'єкт (заголовок, текст, картинку і т.д.) від верхнього краю сторінки, використовуйте опцію "Перенесення рядка" ( "Linebreak"). Зазвичай чисельного значення "1" або "2" цілком достатньо, щоб "рознести" об'єкти на сторінці.

13. Розділові лінії (Rule)

Якщо Ви бажаєте відокремити одну частину сторінки від іншої, використовуйте розділові лінії (крім “стандартних” ліній Ви можете знайти у “колекції” (опція – “картинки”) більш “екзотичні” розділові лінії – на Ваш смак!

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

Тут потрібно бути певною мірою "професіоналом", щоб так "організувати" фреймову сторінку, щоб вона однаково добре відображалася за будь-яких налаштувань комп'ютера.

Якщо Ви все-таки хочете оформити Ваші сторінки у фреймах, спробуйте використати для цього Flash Frames Builder від Zibycom. Для надійності, однак, краще давати назви кнопкам на латиниці (або взагалі англійською мовою)!

Як тільки Ви розмістили на сторінці будь-який з об'єктів (фон, заголовок, текст, малюнок, таблиця і т.д.), внести зміни до цих об'єктів (або видалити, перемістити їх!) Ви можете лише через опцію “Редагувати” (“Змінити / Видалити") .

Для цього Ви спочатку повиннізнайти(у списку, що відкривається) івиділитипотрібнийоб'єкт, після чогозадаєте– що з ним потрібно зробити ( змінити, видалити, перемістити).

Після цього Ваш об'єкт спочатку відкривається Вам у тому вигляді, в якому Ви його створили, а потім Ви можете внести до нього будь-які зміни. Після цього їх потрібнозберегти.

P.S.Ми розібрали майжевсі основні інструменти конструкторасайтів.

Головний висновок полягатиме, однак, у тому, що найкращих результатів Ви досягнете не з вивчення самих конструкторів, а також порад щодо їх використання, а самев результаті практики!

Після того, як створите хоча б кілька сайтів і впевнено почуватиметеся в будь-якій версії конструктора (української, англійської, німецької, іспанської – неважливо, який!), Ви зрозумієте, що це дійсно дуже просто – створювати та змінювати Web-сторінки. І для цього справді не потрібно знати жодних мов програмування!

Нижче ми наведемо кілька порад, як зробити Ваш сайт більш функціональним, використовуючилише найпростіші прийоми HTML-кодування.

1). Лічильник відвідувачів

2). Біжучий рядок

Ви можете “зняти” HTML-код рядка з будь-якого сайту, де він міститься. Тепер відкрийте цю сторінку у вигляді HTML і скопіюйте код, що починається тегом і закінчується тегом . Тепер відкрийте опцію HTML-код користувача і вставте в буфер цей код. Усі параметри, що містяться між “відкриваючим” та “закриваючим” тегами Ви можете змінювати: це і власнетекстрядка, що біжить, і напрям його руху (зліва направо або праворуч наліво), колір фону, шрифт і його розмір, а також колір шрифту та багато іншого. Поекспериментуйте і знайдіть для себеоптимальний варіант.

3). Гостьова книга

4). Додаткові "прикраси"

5). Реєстрація у пошукових системах та каталогах

Це навіть більш важливий момент, ніж установка "лічильників" та "гостяних книг".

Якщо Ви написали та видали книгу, а потім “здали” її до бібліотеки, де Ваша книга не була внесена до каталогу, вважайте, що Ви зробили “даремну” працю – Вашу книгу ніхто ніколи не знайде.

Так само і сайт, який не зареєстрований в основних пошукових машинах та каталогах майже ніколи не буде знайдений Вашими потенційними відвідувачами.