Декабрь 6, 2009

Настройка стилей для Mozilla Firefox (3)

написано в рубрике: Профессиональные заметки; 18:00

Продолжение

Индивидуальные настройки Фаерфокса позволяют изменить «под себя» внешний вид часто посещаемых сайтов — разумеется, в сторону улучшения и удобства пользования.

Вот так сейчас выглядит постоянно посещаемый мной форум:

Скриншот 1024х740

На мой вкус, шапка высотой в целый экран и более — перебор. Даже если она является данью любви к основной теме форума. А подвал с баннерами и вовсе излишество для пользователя. Разбираю html страниц форума, прячу определением display:none !important; лишние блоки:

#html-header,
#pun-title,
#pun-announcement,
#tieser-bottom,
#pun-break3,
#pun-crumbs2,
#pun-break4,
#pun-about,
#html-footer{
  display:none !important;
}

и в моём браузере форум приобретает вполне приличный вид:

Скриншот 1024х740

Рядовой пользователь оказывается могущественней администратора, ибо админ форума убрать рекламные баннеры не может. А пользователь (лично для себя) может. Но это простой случай; здесь достаточно спрятать излишества. То же самое я проделала с ютьюбом и ЖЖ, убрав с глаз своих все рекламные блоки. Однако css позволяет изменить вид сайта радикальнее. Возьмём сайт radikal.ru — сервис для хранения картинок. Вот как выглядит сам по себе:

Скриншот 1024х740

А вот как он выглядит, если спрятать стилями Фаерфокса лишние области с моргающими баннерами и подтащить самую полезную (лично для меня) часть страницы выше и левее:

Скриншот 1024х741

.topp #top_ban,
.topp iframe,
.topp .logo,
.topp #left_ban,
.topp #left_ban2,
.topp #left_ban3,
.topp .bottomcontr{
  display:none !important;
}
#imgtd{
  width:0 !important;
}
#imgtd div{
  position:absolute;
  top:0;
  right:0;
}
#imgtd #subm1{
  left:40px !important;
  right:0 !important;
}
.topp #tabs{
  margin-right:803px !important;
}
.topp .imgcont{
  text-align:center !important;
}
.topp div.pgtitle{
  width:239px !important;
  margin-left:400px;
}

Так можно «переделать» под себя любой сайт (если он постоянно используется как инструмент, а не служит объектом разового созерцания): разбирается код html, ненужные блоки прячутся, а нужные по мере необходимости перетаскиваются на нужные места. Единственное требование — знать основы html и css. Без этого никак не обойтись.

Примечание: если сайт претерпит редизайн, настройки придётся делать заново.

Продолжение следует.

Нет комментариев »

Еще нет комментариев.

Комментировать

Вы не авторизованы. Вы можете:

Rambler's Top100