Приложение вконтакте от ХромоГлаз. часть 2

Mar 13, 2012 23:03



Сегодня пост про вёрстку приложения вконтакте "Фенечки" от ХромоГлаз. Верстали мы его как обычно в html. Напомню сама идея создания приложения и само приложение появилось не так давно.
Далее следует своеобразный ход верстки странички.

Начало верстки страницы. Чтобы создать страницу в html мы произвольно заходим на совершенно любой сайт и правой кнопкой мыши берём его исходник. Сразу говорю, все последующие операции лучше выполнять в Опере. Итак, когда взяли исходник - мы его весь удаляем - он нам не нужен. В Опере нажимаем "Применить изменения", у нас получилась чистая страничка.

Когда мы получили чистый лист, начинаем верстать страницу, начинять её кодами. В случае с нашей страницей фенечек (а наше приложение построено на html) мы берем и с определённого места копируем код на чистый лист. Ещё важно заметить, что каждая html страница начинается вот с такого когда, его важно не забыть вставить вначало     " !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"
Так-же в конце всего кода обязательно вставить и вот это " 
"
После таких операций у нас получается такой вот код.

Не буду раскрывать секрета, что лежит в основе страницы фенечки. Далее мы вставляем шапку (тоже определенный код). Потом заходим на проект фенечки, выбираем одну из них, берём её исходник и копируем его с java script и до тега "".

Далее нужно отработать картинки - так-же с java script и до "фотогалереи".

Фактически у нас готова страничка. Но нужно помнить, что мы делаем не просто страницу, а приложение вконакте, а там они имеют ограниченный размер. Исходя из этого мы изменяем ширину и высоту каждой картинки, это тоже в коде, вот в таком: " width="340" height="259" "


Страница для приложения почти готова. Осталось доработать некоторые элементы - это ширина блока комментариев, код "span" и ещё пару вещей. 


Итак, вы спросите - как же всё это выглядит в итоге? Этого я вам показать не могу в целях защиты от копирования нашего приложения и информации. Само приложение находится в стадии разработки, вы его сможете увидеть когда оно будет полностью отверстано и будет работать. Такой момент наступит через некоторое время.

Это лишь легкая форма вёрстки странички. В основе настоящих сайтов лежат и не такие коды. Для сравнения они раз в 10 больше такой вот простецкой, на первый взгляд, странички.

ХромоГлаз©

приложение ХромоГлаз, ХромоГлаз, страница, сборка, верстка, фирменное

Previous post Next post
Up