Макет от Softlink

[psywalker]

Привет, народ, верстальщики в частности Для вас имеется хорошая новость. У нашего постоянного посетителя Softlink-а появился отличный макет для вёрстки, который он любезно нам предоставил

Скачать

Макет

Скачать

Задание опишет сам автор макета, т.е. Softlink. Удачи!

[Softlink]

Привет, други!

Как поставил мне задачу заказчик.

Все фикс. Абсолютно все блоки фиксированной шириной и длиной.

Справа белые кнопки - ссылки.

Блок под хедером - тоже со ссылками(двумя, картинка и текст).

В описании фильма есть оценки - 6.0 и 6.1. Т.е. слева от них блок к которому они относятся.

Слайдер листает сразу по 5 фотографий. Обратите внимание на "ухи" слайдера - они одного фона с блоком.

Скролл-бар справа от комментариев я не верстал, т.к. отпала необходимость у заказчика, но для тренировки можете сверстать

В футере стрелочки - это якорь наверх.

Еще есть один маленький косячок. Дизайнер немного на рассчитал размер и сделал мин. ширину в 1055пк. В общем смотрите сами, но я все подогнал под 1024 без скролла.

p.s. так как все фикс, то можно вставлять блоки прямо картинками, но так не интересно, так что юзайте css3 И будьте внимательны к детальками

p.p.s. в портфолио размещать работу не рекомендуется, т.к. это будет реальный сайт(ну заказчик попросил).

[Temiks]

Softlink, спасибо

[Softlink]

Softlink, спасибо

На здоровье) Макет и правда мне показался интересным. С виду простенький, однако вот этот полупрозрачный фон у блоков не дает расслабиться Ну если верстать не картинками конечно) Еще забыл добавить, что фотографии в слайдере должны разворачиваться. В общем, кому как угодно, так и делайте, я описал как мне было поставлено задание

[ctpz]

Softlink, спасибо, верстаю

[epog333]

Спасибо но для меня сложно пока что

[psywalker]

Спасибо но для меня сложно пока что

А зачем ты нам об этом говоришь?

[Nekromancer]

Спасибо но для меня сложно пока что

А зачем ты нам об этом говоришь?

Не ну, что ты не понимаешь, что этот макет был выложен специально для этого человека? Вот он и сообщает, что мы зря его заставляем верстать такие сложные вещи.

[heywait]

доброго времени суток!

если все же не применять css3, то целесообразно ли делать бэкграунды блоков с контентом прозрачными в png, или же просто резать их как непрозрачные картинки и ставить на свои места? я правильно понимаю, что разница между этими способами связана с поддержкой браузеров ie 6,7 прозрачности?

мне просто не совсем понятно. Softlink акцентировал внимание на "ухах" слайдера, видимо, задумывалось, что их нужно было отдельно как-то приделывать, но если просто скопировать слой и сохранить в .png, то все, вроде, на своих местах. что-то мне подсказывает, что я заблуждаюсь, может, развеет кто-нибудь мои заблуждения?

заранее спасибо!

Edited October 3, 2011 by heywait

[Softlink]

доброго времени суток!

если все же не применять css3, то целесообразно ли делать бэкграунды блоков с контентом прозрачными в png, или же просто резать их как непрозрачные картинки и ставить на свои места? я правильно понимаю, что разница между этими способами связана с поддержкой браузеров ie 6,7 прозрачности?

заранее спасибо!

как угодно делайте) Можно тогда вообще одну большую картинку вставить в бг и по ней уже плясать.

[heywait]

как угодно делайте) Можно тогда вообще одну большую картинку вставить в бг и по ней уже плясать.

т.е. я правильно понял, что если все работает, сверстано кроссбраузерно и быстро грузится, то методы не важны?) я все время мучаюсь вопросами "правильно-неправильно"

[psywalker]

как угодно делайте) Можно тогда вообще одну большую картинку вставить в бг и по ней уже плясать.

т.е. я правильно понял, что если все работает, сверстано кроссбраузерно и быстро грузится, то методы не важны?) я все время мучаюсь вопросами "правильно-неправильно"

Да, главное постарайся сделать по максимуму качественно.

[Svatov]

Там где информация по фильму, используется нестандартный шрифт еще и с тенью ..наклонный...что с ним делать?

Edited October 9, 2011 by Svatov

[Softlink]

Там где информация по фильму, используется нестандартный шрифт еще и с тенью ..наклонный...что с ним делать?

Можете свой поставить. Я подключил через @font-face.

[Svatov]

Там все ок со шрифтами..просто пробел в некоторых местах стоит нестандартным шрифтом...допустим "Century Gothic", а пробел "a_AventeInt" , дальше "Georgia" ...поэтому и фотошоп ругался.

[karlitos32]

А колонки с Фильмом и Спойлер, должный быть одной величины? Если да, кто нибудь подскажите как сделать это без таблицы. Или без таблицы невозможно?

[azarkin7]

Первый вопрос. вот я поставлю фон картинку и все такое выровняю margin'ом блок по центру и по бокам останутся пустое белое пространство что делать с ними?

[Softlink]

Первый вопрос. вот я поставлю фон картинку и все такое выровняю margin'ом блок по центру и по бокам останутся пустое белое пространство что делать с ними?

Поставить фон не для враппера, а для боди например.

[azarkin7]

Первый вопрос. вот я поставлю фон картинку и все такое выровняю margin'ом блок по центру и по бокам останутся пустое белое пространство что делать с ними?

Поставить фон не для враппера, а для боди например.

сделал при уменьшени размера окна(ctrl+колесико) то белый фон появляется

[Softlink]

Первый вопрос. вот я поставлю фон картинку и все такое выровняю margin'ом блок по центру и по бокам останутся пустое белое пространство что делать с ними?

Поставить фон не для враппера, а для боди например.

сделал при уменьшени размера окна(ctrl+колесико) то белый фон появляется

Если вы внимательно прочитали материалы по вашей проблеме на этом сайте, потом вам гугл отказался помочь, то создавайте тему в соответствующем разделе и будем разбираться с этим вопросом. Здесь не стоит это обсуждать.

[Lemming]

Отличный макет, уже нашел для себя полезные вещи при его верстке, хотя только начал

[sdasddsa]

Вопрос: фон получаеться около 800кб),а как вы делали фон и сколько он весит?)

[Softlink]

Вопрос: фон получаеться около 800кб),а как вы делали фон и сколько он весит?)

У меня вся верстка получилась ~1мб. Это все картинки(включая слайдер), скрипт слайдера, два html-файла, один css и шрифты. А как вам объяснить как я делал? Обычно, резал и вставлял.

[Svatov]

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

п.с фон вроде как 313 кб...можно и 250 кб нормальным сделать..

Edited November 9, 2011 by Svatov

[Softlink]

А что с плеером делать и комментами...просто картинками вставить?...и кнопочки соц сетей с лайками...там же эти кнопочки надо с соц сетей брать генерить...

Да, я картинками все вставлял.