Рейтинг
+7.48

HTML, верстка, кодинг, CSS

Как правильно верстать сайты и прикручивать всякие фишки

Бэкграунд из трех частей.

HTML, верстка, кодинг, CSS /
Здравствуйте.
При разработке сайта возникла проблема.
У меня есть изменяющаяся с длиной новости часть сайта.

www.zootemplate.com/demo/zt_evio/
Здесь это задний фон возле бело-серй части сайта.
Как видите он зависит от длины статьи и если выбрать Typographу, то получится что картинка влепленная в бэкграунд заканчивается на 1/4 части длины статьи и начинается бэкграунд цвета #1A252D.

Если я хочу, чтобы бэкграунд был весь как та картинка и с увеличением длины тоже увеличивался — есть ли такая возможность как «трехкартиночный» бэкграунд в CSS?
То есть две картинки это верхний край и нижний, и еще одна то что посередине и то что тянется с «удлинением» сайта?

P.S. Вариант с repeat-y центровой части картинки я юзал и не рассматривается в данном вопросе

Мультиязычность сайта

HTML, верстка, кодинг, CSS /
Здравствуйте. Думаю многие уже с этим сталкивались, так как у нас большинство сайтов делается на двух языках. Вот и я хотел бы сделать сайт мультиязычным (интересует только русский и казахский).
Нашел 3 способа:
1 способ. Самый простой вариант который приходит в голову, но одновременно самый сложный — создавать отдельно материалы, категории, меню для разных версий сайта. Но тут могут возникнуть много проблем, таких как перевод для модулей, компонентов (т.е зарезервированных фраз вроде Последние новости).
К тому же придется самим реализовывать поиск по определенному языку, модуль «флажков» и прочее…
2 способ. Можно сделать полную копию сайта и настроить его для казахского языка (либо какого-нибудь другого). Этот второй сайт прицепить поддоменом (например kz.site.ru или site.ru/kz).
3 способ. Намного проще будет установить компонент, который будет управлять обоими версиями сайтов разом из одной админ панели. Хорошим примером такого компонента служит Joom!Fish. В нем отдельно можно настраивать сайт для разных языков, практически полностью управлять локализацией для расширений и прочее. На сайте же следует установить в соответствующую позицию модуль «Флажков», который позволит оперативно переключаться между языками сайта.
Что плохо описания есть только для 3 способа. Меня интересует как сделать мультиязычность вторым способом. Сделать ссылки на главной на переход на казахскую и русскую версии, но так чтобы упрявлялись из одной админки. Буду очень признателен за помощь.
P.S. Сайт на Joomla 1.5.

Как сделать модуль статических часов для джумлы?

HTML, верстка, кодинг, CSS /
Здравствуйте

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

Гуглил, что то даже использовал. Сделал. Установил. Не работает

Бегущая строка

HTML, верстка, кодинг, CSS /
Здравствуйте. Недавно мне дали задание разместить на сайте торгового центра бегущую строку из логотипов бутиков, которые арендуют помещения в этом ТРЦ. В сайтостроении я новичок, и раньше в Jnet меня не было, советы брать не откуда так что обратился к единственному учебнику google. Нашел 3 варианта построения бегущей строки:
1) Тег marquee.
2) JavaScript.
3) Flash.

Читать дальше →

А вы как верстаете? html5 или html4?

HTML, верстка, кодинг, CSS /
Как то недавно, когда был Хакдей, затронули эту тему. Никита Вершинин приколол нас, что мы динозавры потому что мы еще верстаем на html4. А он уже на пятерку давно перешел. Вот и поселились с этого момента мысли о переходе. В общем то поэтому и опрос. Хотел узнать как много в казнете уже перешло на него. Были ли какие-то сложности при переходе? Надеюсь тоже скоро присоединимся к пятерышникам.

Нестандартные шрифты на сайте использовать можно

HTML, верстка, кодинг, CSS /
Я всегда в дизайне сайта использовал стандартные шрифты, так как с нестандартными траблы в отображении. Но вот нарыл интересную статью на хабре. И друг из Челябинска Алексей Сумбаев посоветовал использовать этот метод. Так что копипастю сюда, может кому будет полезен.

Если стоит задача использовать в проекте нестандартный шрифт, то есть возможность пойти несколькими путями:
  1. Ъ-метод – не использовать нестандартные шрифты, достаточно в CSS сказать body {font-family: sans-serif;} и не морочить себе голову.
  2. Быдло-метод – нарезать из ЖПЕГов, картинок с заголовками, ужать посильнее, что б появилась размытость и вставлять вместо текста картинки. Достаточно популярный на наших просторах метод.
  3. W3C-метод – используем
    @font-family
    и наслаждаемся красивыми шрифтами без всяких заморочек. Пока этот метод не рассматривают, как рабочий, по причине слабой поддержи со стороны браузера.
  4. sIFR – клевая вещь, наиболее употребляемая на сегодняшний день, но как недостаток – требует наличия Flash-плагина. Хотя это трудно назвать недостатком, но если есть инструмент, позволяющий обойтись без плагинов, то это не может не радовать.
  5. Cuf?n – самое то. Относительно новый метод, который показывает превосходные результаты. Он и есть герой этой статьи.

Читать дальше →

Генератор шаблона для Wordpress

HTML, верстка, кодинг, CSS /


Генератор тем для WordPress. Этот онлайн генератор создает кастомную тему для WordPress без какой-либо необходимости в знаниях HTML, JS, PHP, CSS.

Пользователь может выбрать основные цвета, параметры, формат темы. После чего нужно только нажать кнопку «Сохранить» и скачать вашу собственноручно сделанную тему для WordPress в виде zip-файла. Потом распаковать, установить, и все! Если у Вас возникнут какие либо вопросы и проблемы, то есть форум, правда англоязычный.

Тема подходит для WordPress от версии 2.1 и по 2.6.2 включительно. Генератор основан на Yahoo! UI (сетка, табы и типографика) и поддерживает все A-Grade браузеры, а также валидна согласно XHTML 1.0 Transitional. Темы включают в себя поддержку виджетов и тэгов.

Для новичков будет удобен как полноценный генератор, а для верстальщиков под WordPress он будет полезен в качестве быстрого генератора базового шаблона для последующей доработки.

Проверка на кроссбраузерность

HTML, верстка, кодинг, CSS /

Есть замечательный сервис, который помогает проверить на кроссбраузерность верстку сайта, называется он Browser Shots (http://browsershots.org). На выбор 4 операционные системы + куча браузеров в разных версиях.

Ускорение нарезки макета в Photoshop

HTML, верстка, кодинг, CSS /
При создании html-макета страницы иногда приходится иметь дело с множеством однотипных картинок. Например, выпало верстать фотоальбом. Нужно нарезать порядка двадцати «превьюшек», потом их всех поименовать и сохранить. Рутина.

Для того, что бы быстрее разделать со всем этим — используем несколько хитростей.

Читать дальше →

Правильная «резина»

HTML, верстка, кодинг, CSS /
Задачей этой статьи является систематизация знаний о том, как правильно растягивать сайт для различных разрешений экрана.

Читать дальше →