Jump to content

aTei

User
  • Posts

    76
  • Joined

  • Last visited

Posts posted by aTei

  1. Страница демонстрирующая пример расползания в ie6: http://pva.ru/index_kley.html (клацните на картинку с клеем "ПВА-М")

    Таблетки из разных css свойств (clear:both;zoom:1;overflow:hidden;...) больному не помогли. Хотя скорее это я плохой доктор и не там лечил.

    Функция jQuery отвечающая за увеличение картинки:

    $('#paint a').toggle(
    function(){
    $(this).css({'z-index':'20'});
    $(this).find('img').stop()
    .animate({top:'-40px',
    left:'-40px',
    width:'400px',
    height:'400px'
    },400);
    $(this).find('span').hide();
    $(this).find('span').fadeIn(500);
    },
    function(){
    $(this).css({'z-index':'0'});
    $(this).find('img').stop()
    .animate({top:'0',
    left:'0',
    width:'150px',
    height:'150px'
    },250);
    $(this).find('span').remove();
    }
    );

    Надеюсь на вашу снисходительность и помощь мне криворукому :)

  2. @hf3, всё в параграфы - слишком уж радикальный метод.

    @slicemasta, <strong><code> - использовал только ради seo.

    <b> - физическое форматирование, дабы внешне выделить объекты, но опять же не вредить seo.

    @art, была старая версия статьи, переверстал её по уровню моих текущих умений. Прошу оценки и советов.

  3. Нашел тут свою старую статью (перевод), где-то годичной давности и удивлением смотрю на её исходники. В голове просыпается вопрос "Как же можно было так плохо верстать?". Не суть дело - решил перевестать.

    До

    Как выглядит: http://game-time.ucoz.ua/publ/cs_podbot_3_...ration/2-1-0-35

    Подсвеченные исходники: http://dumpz.org/18061/

    После

    Как выглядит: http://download-cs.3dn.ru/publ/1/nastrojka_podbot/1-1-0-1

    Подсвеченные исходники: http://dumpz.org/18063/

    Оцените пожалуйста второе.

    С удовольствием почитаю и прислушаюсь к практическим советам, как сделать статью не столь монотонной и немного оптимизировать seo.

    __________

    Прошу не ругать за использование uCoz :(

  4. Давайте представим, всё что у нас есть для оценки сайта - его скриншот. Каков диагноз? Что стоит подлечить, а что взять на заметку?

    4447638496_db100daaf7_o.png

    Мои замечания:

    1. В верхней навигации нужен больше сдвиг от "language"

    2. Стиль писать с заглавной буквы добавил бы красоты

    3. Эффект, когда элемент вылазит за блок - из "эмоционального дизайна", что хорошо, но стоило сделать на все три элемента а не только на колбочки (баночки?)

    4. Контактная информация слабо выделена.

    Оцените этого больного (кстати, он не мой) и выкладывайте скриншоты своих. Думаю получится весело :)

    И, для затравочки, анекдот:

    - Доктор! Доктор! Что это у меня?!

    - Где?.. О-о-о, господи! Что это у вас?!

  5. Добавляем в HTML

    	<!--[if IE 7]>
    <link type="text/css" href="css/ie7.css" rel="stylesheet" media="screen" />
    <![endif]-->

    В файлике ie7.css (который находится в папке css) переписываем только нужные стили.

    Как исправить сам баг с навигацией не знаю, не смотрел исходники.

  6. Как видим, расползается много где.

    А исправление верстки потребует не 5 мин и автору еще не по силам.

    Предлагаю перенести в Коммерческие Услуги.

  7. Даже в ie6 всё норм, а в Chrome творится что-то не ясное. Порыскал по инету, подсказок на решение не нашел. Наверно это я где-то заплужил, но который час не могу понять где :)

    Функция jQuery (версия 1.4.1 min)

    function accordion (){
    maxWidth = $('#accordion').width() - 348;
    minWidth = 75;
    $('#accordion ul a').hover(function(event){
    $('#accordion ul a').animate({width: minWidth+"px"}, { queue:false, duration:600 });
    $(this).animate({width: maxWidth+"px"}, { queue:false, duration:600});
    });
    }

    HTML

    		<div id="accordion"> 
    <ul>
    <li><a class="a1" href="#">
    <img src="images/1.png" width="143" height="127" />
    <p>Йода</p>
    </a>
    </li>
    <li>
    <a class="a2" href="#"><img src="images/2.png" width="159" height="127" /></a>
    <span></span>
    </li>
    <li>
    <a class="a3" href="#"><img src="images/3.png" width="179" height="127" /></a>
    <span></span>
    </li>
    <li>
    <a class="a4" href="#"><img src="images/4.png" width="120" height="127" /></a>
    <span></span>
    </li>
    <li>
    <a class="a5" href="#"><img src="images/5.png" width="113" height="127" /></a>
    <span></span>
    </li>
    </ul>
    </div>

    CSS

    #accordion {
    width:724px;
    height:129px;
    margin-bottom:10px;
    overflow:hidden;
    background-color:#fff;
    }

    #accordion ul{
    list-style: none;
    margin: 0;
    padding: 0;
    overflow:hidden;
    }

    #accordion ul li{
    float: left;
    display: block;
    }

    #accordion ul li a{
    display: block;
    overflow: hidden;
    height: 127px;
    width: 75px;
    text-decoration:none;
    color:black;
    font-size:0.9em;
    border: 1px solid #fff;
    }

    #accordion ul li img{position: absolute;}

    #accordion ul li p{
    margin: 0;
    padding: 0;
    width: 200px;
    display: block;
    padding-left:10px;
    padding-top:10px;
    overflow:hidden;
    }

    #accordion .a1 {width: 143px;}
    #accordion .a2 {width: 159px;}
    #accordion .a3 {width: 179px;}
    #accordion .a4 {width: 120px;}
    #accordion .a5 {width: 113px;}

    #accordion .a1 p{margin-left: 143px;}
    #accordion .a2 p{margin-left: 159px;}
    #accordion .a3 p{margin-left: 179px;}
    #accordion .a4 p{margin-left: 120px;}
    #accordion .a5 p{margin-left: 113px;}

  8. @rus, не в коем случае не преследовал цель - опозорить автора сайта, а, как и написал выше, «Кто-то прочтет (может даже создатель сайта), заметит ошибки и не будет их повторять (или исправит)»

    @Игорь Ермаков, тему и написал, чтобы в инете было меньше такого - преследование великой цели маленькими людьми :)

    @andronn, так вот же HTML-BEPCTKA.narod.ru :)

  9. @MehOlOLBuC, как видим, верстку не засудили, а значит похвалили :)

    Семантика это конечно хорошо, но нужно знать меру.

    Не относится к верстке, но важно:

    Не понравились юзабилити, типографика и дизайн.

    Например, заменив один из заголовков со "Скидки" на "Скидки до 20%" (что указано в подписи к нему), конверсия явно возрастет.

    Дизайн: он вроде чистенький и красивый, но связи у страхования и бабочек нет.

    И если диз - точно не ваша парафия, то типографику можно было сделать мило и красиво.

    Теперь вы знаете в каком направление развиваться. Успехов :)

  10. Писал же "Для себя", но psyWalker не дремлет :lol:

    Если с исходными шрифтами смотрится плохо, 2 сравнительных скриншота, почти всегда, убеждают заказчика )

  11. Считаю не правильным давать задачи, с которыми не столкнешься в реальной жизни.

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

    Это как "ищу профессионала программиста на php без завышенной самооценки. Доскональное знание всех популярных фреймворков и CMS обязательно. Оплата почасовая: 1$/час".

    Ну ересь, ясно же.

  12. «ProstoSait.com.ua -узнай об верстке больше»

    из подписи одного из пользователей htmlbook. (кстати пропущен пробел, а вместо тире дефис)

    Ну не нравятся мне плохие сайты.

    А на ошибки людям указывать нравится :)

    11873.jpg

    Начну

    1. Сайт о верстке должен проходить валидацию, а не проходит
    2. Логотип сделан картинкой (!) хотя можно было использовать какой-то стандартный шрифт или подгрузить другой. Благо кроссбраузерный вариант уже выдумали
    3. Если в предисловие статьи картинка больше предисловия, следующая статья не отступает от предыдущей.
    4. Ссылка-заголовок не подчеркнута, хотя здесь это явно нужно.
    5. "Читать полностью >" - заглавными буквами, и подобие стрелочки не красивое
    6. Картинка "RSS" низкого качества, видно невооруженным глазом
    7. Страшно сверстана форма поиска
    8. Что вызвало улыбку автора, остается для меня загадкой:
      «Для уменьшения веса страницы можно и нужно:)» ...
    9. Некрасивые метки у "Недавно, Рубрики, Архивы". Кстати, не "Архивы", а "Архив"
    10. Шрифт в кол-ве коментариев не приятный.
    11. Свежие отзывы аж в футере сайта.
    12. Пагинатор на английском

    Ведь правда же - не должны сайты быть такими.

    Укажите что Вам не понравилось в сайте.

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

    А мир станет чуточку лучше ;)

  13. @rediskavet, интересная статья, не натыкался раньше на нее на хабре.

    Для себя я использую такие шрифты:

    Заголовки: Georgia

    Контент: Verdana

  14. @Great Rash, там удобная онлайн версия. А pdf, png - наверно, исключительно для распечатывания на бумаге.

    Поглядел visualjquery.com, прикольная штучка, но немного неудобно структурированная. Хотя кому-то наверняка покажется удобней - дело вкуса)

    @Ялекс, когда инет не работает - супер.

    Пасиб за ссылки.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy