Совет 1: Как оформлять теги

Многим начинающим веб-мастерам язык разметки HTML кажется очень сложным, но на самом деле в нем нетрудно разобраться, если вы хотите научиться создавать интернет-сайты. Для форматирования и грамотного оформления контента веб-страниц необходимо знать об основных тегах языка HTML, благодаря которым текст на страницах выглядит красиво, легко читается и воспринимается посетителями сайта.
Инструкция
1
Для разделения текста на параграфы используйте тег <p></p>. Текст, разделенный на части, воспринимается читателем гораздо легче, а структурированная информация быстрее проникает в его память.
2
Для восприятия текста также очень важны правильно оформленные заголовки. Вы можете вставить в текст заголовки любого размера – самый большой размер текста вы получите, заключив его в теги <h1></h1>, а самый маленький – в теги <h6></h6>. Главный заголовок отмечайте самым крупным тегом, а подзаголовки, уменьшающиеся по иерархии текста, отмечайте уменьшающими тегами.
3
К этим тегам вы можете применить атрибуты, выравнивающие текст по центру, левому или правому краю: align left, align center, align right, align justify.
4
Наконец, для того чтобы ваш текст смотрелся на странице красиво, его необходимо отформатировать, а значит, вам потребуются теги strong, b, em, i. С помощью этих тегов вы можете выделить любой фрагмент текста, на который вы хотите обратить внимание посетителей.
5
Для того чтобы страница была более релевантной для поисковых систем, используйте вместо тегов b и i теги em и strong, чтобы выделить текст курсивом или жирным шрифтом. Как вы уже поняли, для того чтобы сделать текст жирным, заключите его в теги <strong></strong>, а для того чтобы текст стал наклонным, заключите его в теги <em></em>.
6
Если же вас не устраивает шрифт, по умолчанию установленный на странице, вы можете изменить его с помощью тега font. У этого тега есть атрибуты, определяющие цвет, размер и тип шрифта. Используйте атрибут color для изменения цвета, атрибут size со значениями от 1 до 7 для изменения размера и атрибут face для изменения самого типа шрифта.
7
Для размещения внутри текста гиперссылки, используйте теги <a></a>. Также существует масса других тегов, позволяющих разметить текст на таблицы и фреймы, а также создать более грамотное оформление страницы. Изучив основные теги, вы легко освоите всю разметку HTML.

Совет 2: Как оформлять главы

Каждый текст требует правильного и грамотного оформления - только тогда он выглядит красиво и легко читается. Однако не все знают даже самые простые, элементарные правила оформления, и в виду этого текст читать просто невозможно, а его внешний вид только портит дизайн всего сайта или работы (курсовой, дипломной и т.д.). Оформление текста имеет огромное значение, именно поэтому мы считаем целесообразным поговорить о том, как оформлять главы текста и какие правила следует учитывать при этом.
Инструкция
1
Определите абзацы и точные границы частей текста. Каждая новая часть – это и будет новая глава, которая обязательно должна иметь свой заголовок и быть надлежаще оформлена (выровнена).
2
Придумайте название каждой главы. Помните - название глав не должны повторяться и не должны быть идентичны названию темы или всей работы. При всем этом важно знать, что название главы должно наиболее точно отражать суть (сущность) текста самой главы и быть небольшого размера.
3
Начинайте писать заголовок каждой новой главы с нового листа (страницы) с выравниванием по центру. При оформлении текста на интернет-сайтах заключайте название главы в теги h2 следующим образом Заголовок .
4
Задайте нужный цвет заголовку главы. Его так же можно оставить черным, однако при этом сделать размер на 1-2 больше самого текста главы, сделать жирным либо выделить, используя только заглавные буквы.
5
Оставьте после заголовка главы интервал и пропишите название параграфа, если имеется. В случае если главы не содержат параграфов, начинайте с красной строки писать текст главы. При этом начинаться с красной строки должна каждая новая часть главы.
6
Текст главы должен быть выровнен по ширине и иметь переносы слов либо полностью быть отформатированным без переносов. При этом важные (самые значимые) фразы или выражения в тексте можно выделить при помощи курсива или жирного шрифта. Весь текст главы должен быть написан одним видом шрифта (обычно это Arial или Times New Roman), иметь одинаковый размер шрифта и один междустрочный интервал по всему тексту.
7
В случае если глава разбита на параграфы, между их названиями и текстом должны быть отступы, а название параграфа должно быть написано с выравниванием по центру жирным или обычным шрифтом.

Совет 3: Как добавить ссылку на mail

Возможности создания и редактирования статей в журналах и блогах позволяют оформлять ссылки не только на страницы сайтов, но и на адреса электронной почты. В частности, если ваш читатель авторизован в почтовой службе, нажав на закодированную ссылку, он окажется на странице создания письма. Секрет оформления – специальные теги HTML.
Вам понадобится
  • - блог;
  • - HTML-редактор.
Инструкция
1
Откройте страницу создания нового сообщения. Проверьте, поддерживает ли ваша блог-платформа редактор HTML. Если включен «Визуальный редактор», переключитесь на соответствующий режим работы. В противном случае введенные теги не преобразуются в ссылку.
2
Вставьте следующие теги: <a href=mailto:адрес почты>Написать письмо e-mail</a>. Замените текст на соответствующие ссылки и собственные слова. Будьте особенно внимательны при вводе электронного адреса: если вы ошибетесь здесь, ни одно письмо до вас не дойдет, сколько бы ваши читатели ни писали.
3
Если ваш блог поддерживает режим предварительного просмотра, проверьте ссылку. В итоге должен отображаться только текст, который вы написали вместо слов «Написать письмо», причем оформление соответствует оформлению ссылок: выделение цветом и подчеркиванием. Дополнительные значки и символы говорят о том, что вы вставили теги с ошибками.
4
В качестве дополнительной меры предосторожности щелкните по ссылке. При нажатии левой кнопки мыши вы перейдете на страницу создания письма или откроется почтовая служба, установленная на вашем компьютере. При нажатии правой кнопки появится меню, один из пунктов которого – «скопировать адрес электронной почты».
5
Оформить ссылку на почтовый ящик можно и через визуальный редактор. Наберите текст, который хотите преобразовать в ссылку. Выделите его курсором.
6
В панели инструментов найдите значок «Прикрепить ссылку». Обычно это кнопка с изображением глобуса или двух звеньев цепи. В графе «Тип» выберите «Электронная почта». Заполните поле «Адрес» в обязательном порядке, «Тема письма», «Тело письма» и остальные по желанию и возможности (на некоторых блогах эти опции отсутствуют).
7
Проверьте ссылки на работоспособность. Сохраните сообщение и опубликуйте.
Видео по теме

Совет 4: Как сделать теги правильно

Тегами в программировании и веб-дизайне называются специальные ключевые слова и связанные с ними данные. В теле документов теги обособляются знаками <>, по которым их всегда можно узнать. В свою очередь, создание тегов – это процесс их отображения в соответствии со значением и частотой употребления.



Что необходимо для создания тегов?

Чтобы сделать теги, необходимо использовать такие элементы графического дизайна, как цвет и размеры шрифтов. Эти параметры находятся в прямой зависимости от важности тегов: чем большее значение для структуры документа они имеют, тем большим должен быть размер шрифта и тем ярче цветовое выделение.

Совокупность тегов в конкретном документе часто называется облаком тегов. Облака тегов являются одними из старейших элементов веб-дизайна и все еще используются большинством программистов и веб-верстальщиков. По мнению специалистов, идеально для создания тегов подходит приложение Web 2.0: именно в нем можно быстрее всего сделать теги.

Достоинство Web 2.0 заключается в том, что данная программа позволяет рассматривать технологию создания тегов как обособленную каталогизацию информации. Она объединяет различные виды и типы данных, предоставляет возможность искать через теги HTML и другие документы.




Чтобы создать теги, необходимо активировать модуль «Поиск по сайту»


Чтобы приступить к созданию одного или сразу нескольких тегов, убедитесь, что вы обладаете достаточным количеством материала с метками. Если недостатка в нем нет, первым делом активируйте модуль «Поиск по сайту» какого-либо ресурса. Сделать это нужно в обязательном порядке, так как все создаваемые теги самым тесным образом связаны с данным модулем.

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

Следующий шаг – создание информера. Кликайте по Панели управления, затем – по пункту Инструменты и выбирайте закладку Информеры. Чтобы создать теги, выбирайте одноименный пункт Теги, а затем указывайте необходимые настройки: количество создаваемых тегов, список тегов и т.д. Сразу после этого нажимайте на кнопку Создать и вставляйте сгенерированный код в конкретный шаблон, в отведенное специально для него место. Вот, собственно, и все – на этом процесс создания тегов завершается.

 

Совет 5: Как создать теги

Теги необходимы для оптимизации и раскрутки сайта. Уделяйте их созданию особое внимание, ведь правильно написанные теги помогут вам быстрее раскрутить сайт и заработать на нем деньги. Самое главное при написании тегов – не спешить и как следует разобраться, какие собственно бывают теги. Это может занять немало времени, но оно того стоит. Какие же бывают теги? Их достаточно много, поэтому поговорим о самых основных.
Инструкция
1
Основные теги:
Meta title <title>описание мета тегов</title>. Это своеобразный титульный лист, поэтому старайтесь, чтобы он включал в себя ключевые слова, и был информативен. Желательно ограничить длину тега до 50-80 символов.
Мета тег description и тег keywords. Длина первого тега не должна превышать 200 символов, а второго – 1000. Это необходимо, т.к. поисковые системы используют именно такие величины символов. А если у вас их больше положенного, то часть символов не будет засчитана. В мета тег «description» вставьте описание вашей страницы, т.к. оно будет выводиться по поиску.
meta name Author тег включает в себя имя автора.

meta name copyright тег, который указывает на авторские права.

meta Name Date обозначает дату создания сайта.

meta http-equiv content-type тег используется для того, чтобы браузер разобрал, на каком языке написан текст.
2
Определитесь, как вы будете писать теги. Их можно писать как строчными, так и прописными символами. Только соблюдайте одинаковое написание на страницах всего сайта.
3
Настройте параметры тега по умолчанию. Если вы не указали какой-либо параметр, то браузер будет подставлять значение, заданное по умолчанию. Если ваши ожидания не оправдались, укажите сами необходимые параметры.
4
Не переносите параметры тега по строкам. Чисто теоретически это, конечно, делать можно, но при этом ухудшается восприятие кода и править его становится сложнее.
5
Оформляйте параметры тегов в кавычки. Если кавычки не будут поставлены, это приведет к ошибкам.
6
Проверяйте правильность набора тега. Если он неверный, то браузер проигнорирует такой тег.
7
Следите за иерархией тегов. У тега должно быть свое место. Например, мета теги могут находиться только внутри <head>.
8
Приучите себя закрывать все теги, даже те, для которых это не является обязательным. Это поможет создать четкий работающий код.

Совет 6: Как оформлять ссылки в тексте

Линк – от английского «ссылка, связка» - слово, фраза или картинка (в том числе анимированная), при нажатии на которую происходит переход на другой сайт. Иногда вместо такой прикрытой ссылки используется просто адрес сайта, но ради привлекательности блога вообще или конкретного материала в частности ссылки обычно шифруются.
Инструкция
1
Самый распространенный способ оформления ссылки – с помощью HTML-тега. При использовании простейшего из них страница открывается в том же окне (и в той же вкладке). Так выглядит этот тег: <a href="адрес перехода">комментарий к ссылке или другой текст</a>
2
Другой тег позволяет открывать страницу в новом окне (в браузере Safari страница откроется в новой вкладке). Если вы не хотите, чтобы при нажатии ссылки страница вашего сообщения закрылась, используйте этот тег: <a href="адрес сайта перехода" target="_blank">ваш комментарий</a>
3
Дополнительно можно снабдить ссылку всплывающим комментарием. К примеру, при использовании третьего тега наведите курсор на слово-ссылку, и увидите собственный комментарий: <a href="страница перехода" target="_blank" title="ваш комментарий во всплывающем окошке">текст ссылки</a>. При этом ссылка откроется в новом окне. Если вам это не нужно, немного измените тег.
4
В роли ссылки может быть использована картинка, причем абсолютно любая. Вам необязательно скачивать ее на собственный компьютер, но откройте ее и скопируйте ее адрес из адресной строки. Затем воспользуйтесь тегом: <a href="адрес страницы перехода" target=_blank title="ваш комментарий"><img src="адрес графического файла"></a>.
5
Все перечисленные способы подходят, если вы оформляете ссылки в режиме HTML-редактора (иногда называется «Источник»). В визуальном редакторе эти теги бесполезны, но ссылку можно оформить с помощью специальных кнопок. Выделите слово, которое хотите сделать ссылкой. Найдите на панели инструментов кнопку, похожую на два звена цепи (при наведении курсора возникает надпись «Прикрепить ссылку» или подобная). Нажмите на нее.
6
В поле введите адрес ссылки. На эту страницу будет переходить читатель, нажавший соответствующее слово в сообщении.
Видео по теме

Совет 7: Как выложить ссылку на сайте

При создании собственного сайта администратору приходится не только заботиться о его внешнем виде, но и выкладывать разнообразные материалы. Чтобы посетителям было удобно ими пользоваться, следует правильно оформлять ссылки.
Вам понадобится
  • - html-редактор;
Инструкция
1
Для того чтобы редактировать страницы сайта, вы должны обладать правами администратора. Редактирование страниц можно производить как непосредственно в панели управления сайта, воспользовавшись встроенным html-редактором, так и на компьютере с последующей закачкой измененной страницы на сайт. Во втором случае вам потребуется html-редактор - например, Cute HTML.
2
Ссылки могут быть оформлены двумя основными способами. Прежде всего, вы можете указать в html-коде прямую ссылку и дать, при необходимости, ее описание. Например, в тексте может присутствовать примерно такая строка: «Для создания почтового ящика воспользуйтесь сервисом Рамблер: http://mail.rambler.ru/». Это самый простой, но не самый лучший вариант.
3
Более красиво выглядят ссылки, оформленные с использованием специализированных тегов. Например, приведенный выше текст можно оформить так: «Для создания почтового ящика воспользуйтесь сервисом Рамблер». Как видно, ссылкой в данном случае является само имя ресурса. Строка, которую надо вписать в код, будет выглядеть так: «Для создания почтового ящика воспользуйтесь сервисом <a href="http://mail.rambler.ru/"> Рамблер </a>». Для оформления ссылок подобным образом используется код: <a href="http://адрес_сайта"> описание сайта </a>.
4
Подобным образом вы можете оформлять и ссылки, ведущие к скачиваемым файлам. При нажатии на такую ссылку пользователь увидит окно стандартного диалога скачивания (открыть, сохранить, отмена). Сама ссылка должна непосредственно вести к загружаемому файлу.
5
При работе с изображениями у вас есть два варианта. В первом случае вы можете по приведенному выше образцу дать ссылку на изображение, пользователь увидит его в новом окне. Во втором вы непосредственно размещаете изображение на странице, для этого используется код: <Img src="http://адрес_изображения" Width="200" Height="150">. Параметры Width и Height задают ширину и высоту изображения. Адрес изображения должен вести к файлу картинки.

Совет 8: Как зачеркнуть текст

Оформление текста зачеркиванием, как правило, используется для обозначения мнения, идущего вразрез с общепринятым, и превращает слова автора в «мысли вслух». Для оформления текста в блоге или на сайте зачеркиванием используются специальные HTML-теги.
Инструкция
1
Чтобы просто зачеркнуть фразу или слово, вставьте в начало и в конец выделяемого фрагмента теги с иллюстрации. Если блог поддерживает режим предварительного просмотра, проверьте, отображается ли подчеркивание.
Как зачеркнуть текст
2
Чтобы зачеркивающую линию сделать цветной, используйте другой тег. Обратите внимание, что вместо слова “red” можно использовать название любого цвета на английском или его цифровое обозначение.
Как зачеркнуть текст
3
Можно оформить текст и зачеркивание разными цветами. Для этого подойдут теги со следующей иллюстрации. Вместо слов “red” и “blue” введите названия цветов линии и текста соответственно или цифровое обозначение.
Как зачеркнуть текст
4
Зачеркнутый текст может быть жирным и курсивным. Для этого используйте теги с последней иллюстрации строго в указанном порядке.
Как зачеркнуть текст
Видео по теме
Источники:
  • Каталог тегов для блогов
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500
к
Honor 6X Premium
новая премиальная версия
узнать больше