Безвозмездный сайт по Naruto
Опубликовано 08.01.2011 в категорию «Сайтостроение»
A A
Отсутствовал я в своём блоге ровно шесть дней, пока делал ненавистный мною сайт по Naruto. В общем, в первые два дня я рисовал макет сайта, который что мне, что моему другу понравился (мне больше, ога). Верстал я около трёх с половиной дней, я большими перерывами. В общей сложности около полутора суток.

В идеале, было свёрстано около 20 страниц кода в формате A4, ~1500 строк кода, ~35’000 символов с пробелами – это около тридцати пяти тысяч ударов по клавишам. Я доволен собой :)

Вот такой макет был (кликабельно):
Ахтунг! Большой размер файла!
Вот такой стал свёрстанный сайт (кликабельно):
Ахтунг! Большой размер файла!


Всё практически чётко соответствует макету. Сейчас я разберу те части из дизайна, которые мне понравились больше всего:

Форма входа. Хочу отдельно поблагодарить Али Шамаева за помощь в вёрстке таблицы формы входа ибо с такими вещами я просто не дружу.
Оформленная кнопка. На сайте Almlex’а я научился их верстать. Спасибо, Almlex!


Меню в виде свитка. Отличная идея администратора сайта Naruto-Fox по поводу меню сайта в виде свитка из аниме Naruto. Свиток рисовал я сам, около 20 минут. Теперь знаю, как он рисуется :)


Шикамару (герой Наруто) в футере сайта. Идея была взята с сайта Fan-Naruto.ru, которую разрабатывал Shugich и Undershot. Довольно неплохо, дорисовал три четверти Шикамару и заставил его сидеть на футере.


Заставил тень от Шикамару перекрывать форму поиска, но чтобы поиск работал и под этой тенью. Идея родилась, когда я рисовал макет. Очень понравилась.
Ну, и естественно, мой первый логотип на сайте. (Это типа дизайн сделал я :)).


В общем, есть много интересных для меня моментов в этом дизайне, так что я узнал много нового в мире веб-дизайна. Например моя разработка формы комментариев, которая является удобной, рабочей и является идеальной по юзабилити. К сожалению, валидно у меня верстать никогда не получится, потому что разные эффекты CSS типа box-shadow, к которым нужно прописать все опции для каждого браузера являются невалидными.
А вот и сам сайт, над которым сейчас трудятся администраторы: Naruto-Fox.

Слушаю: The Rasmus - Livin' In A World Without You
Читаю: Алексей Калугин - «Дом на болоте», серия «S.T.A.L.K.E.R.»
Думаю о: Послезавтра - в школу, а я еще домашнее задание не сделал.
Настроение: Нормальное


Запись просмотрели 929 раз, а откомментировали 9 раз.
Всего комментариев: 9
    # 9 → Написал Андрей | 21.01.2011, 20:55
0  
Ну вообще классно получилось но только:
Вид новостей доделай.
Блоки как то.
Ну и поиск фон для поля ввода сделать а то как-то...
    # 7 → Написал Shugich | 10.01.2011, 03:44
0  
И в плане дизайна плохо и в плане вёрстки плохо. Да и, вообще, зря вы в эту тематику полезли. Бессмысленно уже давно.
    # 8 → Написал mrВелес | 10.01.2011, 07:36
0  
На вкус и цвет - фломастеры разные. Во всяком случае я учусь и ничего не бессмысленно. Нас еще не так много, как будет через десять лет, а это главное - еще успеем всё занять своё.
    # 4 → Написал Kun-Senpai | 09.01.2011, 01:46
0  
mrВелес а ты платно делаешь вёрстку или нет?? ответ в ЛС
    # 5 → Написал mrВелес | 09.01.2011, 10:09
0  
Лучше в ICQ: 1851560, или на e-mail: mrveles@gmail.com
    # 3 → Написал mrВелес | 09.01.2011, 00:41
0  
А, ага! Я понял, спасибо smile
На самом деле, шрифт остаётся 9pt только в AJAX окошке. Оригинальный SecurityCode в форме добавления комментариев. По моему, AJAX невозможно изменить таким образом.
    # 6 → Написал Bahamut | 09.01.2011, 13:53
+1  
Я аякс никогда не редактировал, признаться честно. =) Меня стандарт устраивает. Поэтому не знаю, к сожалению. =(
    # 2 → Написал mrВелес | 08.01.2011, 23:07
0  
"Забыли пароль". Уже исправляю :)

Аватарка, честно говоря, мне тоже не очень понравилась) Сейчас попробую твой метод.
IP чисто для того, чтобы место занять. Не хочу стереотипных: "Изменить профиль" или "Отправить ЛС".

Я не понял, о каких полях идёт речь? В форме входа вроде бы всё нормально... Не врубился.

Про почту - чуть ниже того кода, который ты видел:
<?if($UNREAD_PM$>0)?>
<div align='center'><a href='$PM_URL$' target='_blank' color='red'>У вас новое ЛС!</a></div>
<?endif?>

    # 1 → Написал Bahamut | 08.01.2011, 22:32
0  
И, да, улыбнули каменты в коде, это тру. =)
И сайт получился лучше чем макет. wink Это достойно.
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Рубрикация
sbar_separator
Web-дизайн [0]
Разговоры о HTML, CSS и работе в Adobe и других редакторах.
Web-мастеринг [2]
Разговоры о различных языках веб-программирования - JavaScript (не путать с Java), PHP, MySQL.
Сайтостроение [1]
Разговоры о хостингах, секреты и разработки.
Компьютеры [4]
Про всё, что связано с компьютерами: софт, железо, решения.
Интернет [2]
Обсуждение деталей интернет-сферы.
Литература [0]
Обсуждение различной литературы в форме рецензий и отзывов.
Кинематограф [0]
Субъективные заметки о кино.
Музыка [0]
Разговоры о любимой музыке.
Gameсфера [0]
Обсуждение компьютерных игр исключительно на PC.
Рецензии [0]
Мои субъективные отзывы на любую тематику.
Жизнь [7]
О моей, твоей, любой - жизни.
Мысли [1]
Личные записи в блог.
[архив] [20]
Посты до 30.12.10г.


Мои проекты
sbar_separator
Блог Андрея Велеса Сайт
Вот это, собственно и мой блог, где ты находишся. Пишу обо всём, что вижу, но чаще всего о сайтостроении.
Link's.mrVeles.ru Каталог
Это каталог ссылок, которые мне понравились в интернете. Фактически, это аналог Delicious.
Number's.mrVeles.ru Сайт
Это - материал, взятый из Википедии про цифры: сделал из-за лени искать материал в интернете.
Кордон. Портал
Сайт на тематику литературы постапокалипсиса: S.T.A.L.K.E.R., Metro 2033, Технотьма и прочее...

Закрыт | В разработке.



Twitter
sbar_separator
mrVeles: Последний твит в моём уютненьком Твиттере



Каким видом верстки вы пользуетесь?
sbar_separator
[ РезультатыАрхив опросов ]
Всего ответов: 69