Главная или честный способ заработка в сети Зачем мне это? Всё начинается с идеи

Пример сайта, созданного только с помощью html

Ранее нами были рассмотрены язык разметки гипертекста html, информация о том, что такое хостинг и домен для сайта, создание логотипа для сайта и продвижение проекта в сети интернет. Закрепим данные знания примером сайта, который и создан только с их помощью.

Для демонстрации возможности всех этих вещей, а в основном html, мы сделали сайт sdgames.ru, пока только первую страницу - главную, но со временем страниц добавится.

Теперь к коду страницы. Сначала делается стандартная шапка:

<html>
 <head> // Начинается заголовок html-документа, в котором прописываюся различные инструкции
  <title>SDGAMES - Игры для dendy и sega.</title> // В теге title написали фразу SDGAMES - Игры для dendy и sega., которая состоит из достаточного количества слов, чтобы поместиться в поисковой выдаче.
  <meta name="description" content="Наш сайт посвящен приставкам dendy (денди) и sega (сега). Здесь вы можете скачать игры для них совершенно бесплатно."> // Метаописание состоит из примерного количества слов, которые целиком проиндексируются поисковыми системами и поместятся в строчки поисковой выдачи.
 </head> // Заканчивается заголовок html-документа
 <body bgcolor="black" text="white" link="yellow" alink="green" vlink="yellow"> // Пошло тело html-документа, то что отображается в окне браузера. Атрибут bgcolor задаёт цвет веб-страницы, в нашем случае чёрный, text - цвет текста, у нас - белый. Атрибут link указывает цвет ещё не нажатых ссылок, vlink - уже нажатых, в нашем случае жёлтые. Атрибутом alink задаётся цвет ссылки при нажатии на неё.

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

Здесь мы с помощью таблицы разделили html-документ на 2 части. Первая - 25% от размера окна браузера, вторая - 75%. Пишем:

<table width=100% cellpadding=20> // Задаём таблицу, размером 100% от окна браузера, атрибут cellpadding задаёт расстояние в пикселях между рамками ячейки и текстом, который в этой ячейке находится или картинкой.
  <tr> // С помощью тега <tr> начинаем первую строку таблицы.
   <td valign="top" width=25%> // Тегом <td> задаём первый столбец, размером 25% от ширины экрана. Атрибут valign устанавливает вертикальное выравнивание содержимого в ячейке. Значение valign="top" обозначает выравнивание по верхнему краю ячейки.

В этот столбец вставим картинку с Соником и слоником с помощью тега <img>. После этого, в заголовке первого уровня пишем слово "SDGAMES". Далее с помощью заголовка третьего уровня пишем фразу "Игры для денди и сега". Затем делаем ссылки на некоторые разделы сайта. Ниже вставляем блок "Поделиться". После этого закрывающим тегом </td> заканчиваем этот столбец таблицы.

Теперь начинаем второй столбец. Пишем:

<td valign="top" width=75%>

Этот столбец у нас 75% от ширины экрана. Теперь для красоты пропускаем верхнюю строчку с помощью тега <br>. После этого в одном заголовке третьего уровня пишем ссылки на игры для денди, сортировка по алфавиту. Ниже делаем то же самое для сеги. Затем пропускаем 2 строчки и пишем основной текст страницы. После этого заканчиваем столбец, строку и таблицу при помощи соответствующих закрывающих тегов.

Теперь пропускаем строчку и делаем горизонтальную линию на всю веб-страницу при помощи тега <hr>. Под линией маленьким шрифтом пишем: "Все права на игры и эмуляторы принадлежат их авторам. В соответствии с законодательством РФ, все игры и эмуляторы, скачанные с этого сайта, носят ознакомительный характер. После ознакомления вы обязаны удалить бесплатно скачанную игру или эмулятор и приобрести оригинал за деньги, если появится желание". Запись эта делается, так как надо по закону. Потом пишем © 2012 «Мути в сети» . Это говорит о том, что дизайн сайта защищён авторским правом, копированию не подлежит и можно подать в суд на человека, который скопирует этот дизайн. После этого вставляем счётчики посещений. Заканчиваем тело документа тегом </body>, а страницу - </html>.

Название сайта сокращённо sega dendy games, что многим понятно. Оно короткое и отражает тематику. Покупаем этот домен на сайте 2domains.ru, так как там домен в зоне *.ru и *.рф стоят 99 рублей. Хостинг для нескольких сайтов у меня уже был, поэтому этот домен я включил в него же.

Логотип был сделан на сайте favicon.cc.

Вот и все комментарии к данному проекту.