Пример сайта, созданного только с помощью html
- Подробности
- Опубликовано 28.10.2012 21:27
В предыдущих статьях раздела делаем сайт были рассмотрены язык разметки гипертекста html, информация о том, что такое хостинг и домен для сайта, создание логотипа для сайта и продвижение проекта в сети интернет. Закрепим данные знания примером сайта, который и создан только с их помощью.
Для демонстрации возможности всех этих вещей, а в основном html, мы сделали сайт sdgames.ru. Теперь к комментариям.
Теперь к коду страницы. Сначала делается стандартная шапка:
; // Начинается заголовок html-документа, в котором прописываюся различные инструкции
; // Метаописание состоит из примерного количества слов, которые целиком проиндексируются поисковыми системами и поместятся в строчки поисковой выдачи.
; // Заканчивается заголовок html-документа
; // Пошло тело html-документа, то что отображается в окне браузера. Атрибут bgcolor задаёт цвет веб-странице, в нашем случае чёрный, text - цвет текста, у нас - белый. Атрибут link указывает цвет ещё не нажатых ссылок, vlink - уже нажатых, в нашем случае жёлтые. Атрибутом alink задаётся цвет ссылки при нажатии на неё.
Далее пошла вёрстка. Здесь под вёрсткой будем понимать процесс создания веб-страниц из различных элементов (картинок, знаков) при помощи команд, определяющих правила этой самой вёрстки (создания). В html сайты чаще всего делаются при помощи таблиц.
Здесь мы с помощью таблицы разделили html-документ на 2 части. Первая - 25% от размера окна браузера, вторая - 75%. Пишем: В этот столбец вставим картинку с Соником и слоником с помощью тега Теперь начинаем второй столбец. Пишем: Теперь пропускаем строчку и делаем горизонтальную линию на всю веб-страницу при помощи тега Название сайта сокращённо sega dendy games, что многим понятно. Оно короткое и отражает тематику. Покупаем этот домен на сайте 2domains.ru, так как там домен в зоне *.ru и *.рф стоят 99 рублей. Хостинг для нескольких сайтов у меня уже был, поэтому этот домен я включил в него же. Логотип был сделан на сайте favicon.cc. Вот и все комментарии к данному проекту.
; // Задаём таблицу, размером 100% от окна браузера, атрибут cellpadding задаёт расстояние в пикселях между рамками ячейки и текстом, который в этой ячейке находится или картинкой.
; // С помощь тега начинаем первую строку таблицы, тега
первый столбец, размером 25% от ширины экрана. Атрибут valign устанавливает вертикальное выравнивание содержимого в ячейке. Значение valign="top" обозначает выравнивание по верхнему краю ячейки.
заканчиваем этот столбец таблицы.
. После этого, в заголовке первого уровня пишем слово "SDGAMES", туда же вставляем динамичный счётчик посещений от рамблера. Этим убиваем двух зайцев. Первый - мы можем анализировать посещения сайта и исправлять сайт нужным образом для притока посетителей. Второй - попадание в каталог ТОП100 от рамблера, откуда на сайт будут заглядывать посетители. Далее с помощью заголовка третьего уровня пишем фразу "Игры для денди и сега". Затем делаем ссылки на некоторые разделы сайта. Ниже добавляем блок "Поделиться". После этого закрывающим тегом
Этот столбец у нас 75% от ширины экрана. Теперь для красоты пропускаем верхнюю строчку с помощью тега
. После этого в одном заголовке третьего уровня пишем ссылки на игы для денди, сортировка по алфавиту. Ниже делаем то же самое для сеги. Затем пропускаем 2 строчки и пишем основной текст страницы. После этого заканчиваем столбец, строку и таблицу при помощи соответствующих закрывающих тегов.
. Под линией маленьким шрифтом пишем: " Все права на игры и эмуляторы принадлежат их авторам. В соответствии с законодательством РФ, все игры и эмуляторы, скачанные с этого сайта, носят ознакомительный характер. После ознакомления вы обязаны удалить бесплатно скачанную игру или эмулятор и приобрести оригинал за деньги, если появится желание". Запись эта делается, так как надо по закону. Потом пишем © 2012 «Мути в сети» . Это говорит о том, что дизайн сайта защищён авторским правом, копированию не подлежит и можно подать в суд на чела, который скопирует этот дизайн. Заканчиваем тело документа тегом , а страницу - .
Легальные способы заработка
Делаем сайт
Подписаться на рассылку