Featured Posts

Hands-on HTML 5 2010 O desenvolvimento web está passando por mais uma mudança, evoluindo para acompanhar o ritmo dos negócios e sistemas das grandes empresas baseadas em web, como Google e Yahoo. Com os novos navegadores...

Read more

The Developer's Conference 2010 Esta é a 4a edição do The Developer's Conference, e a Globalcode reuniu toda sua rede de parceiros e profissionais para criar o evento mais completo do ano, sem perder a profundidade necessária...

Read more

Café com Browser 2010 Conversa sobre HTML5 é demanda que já se apresentava desde ano passado pelas organizações brasileiras filiadas ao W3C e por parceiros nas atividades do escritório, principalmente organizações...

Read more

Codeshow 2010 O Visie Codeshow é um evento num formato novo, em que não há palestras. Você vai assistir à construção de uma aplicação em um dia, a partir do zero, usando ferramentas como Git, HTML5, web2py...

Read more

Estrutura Básica de uma página XHTML/HTML Vamos falar sobre os elementos básicos para iniciar uma página HTML <!DOCTYPE> <html>    <head>       <title>          TiloWR       </title>    </head> <body></body> </html> <!DOCTYPE>...

Read more

Hack’s, lá e de volta outra vez.

Posted by Tilo | Posted in XHTML & CSS | Posted on 07-03-2009

Tags:, , , , , , ,

1

quem desenvolve web concerteza já passou por um momento como esse ilustrado pelo nerdson, a questão é que não adianta em quanto a microsoft nào fezer com o IE o mesmo que ela faz com o MSN, a atualização Obrigatoria, nos vamos continuar a fazer Hacks pro IE6.

porem qual o hack certo para ser usado?

eu conheço algumas formas de fazer hack, e hoje vou tentar explicar como usa-los;

HTML tag:

Todas as Versões do IE

<!--[if IE]> Conteudo <![endif]-->

IE7 e Superior

<!--[if gt IE6]> Conteudo <![endif]-->

IE7 e Anterior

<!--[if lte IE7]> Conteudo <![endif]-->

esses Hack são principalmete para um conteudo que não está sendo renderisado no IE, você pode colocar uma marcação adicional para ele.

CSS Selector:

IE 7

*:first-child+html body seletor { propriedade: valor; }

IE 6

* html body seletor { propriedade: valor; }

Chrome e Safari

body:nth-of-type(1) seletor { propriedade: valor; }

Opera 9 e anteriores

html:first-child seletor { propriedade: valor; }

use essa forma apenas quando você precisa que uma determinada classe seja vista apenas pelo navegador em questão, isso ajuda muito quando você criou um hack no HTML e precisa tratar esse elemento.

Testando o Layout Browser/Resolução

Posted by Tilo | Posted in Noticias | Posted on 01-03-2009

Tags:, , , , , , , ,

0

Você passa horas montando seu código, olha no firefox e está perfeito, quando manda para o cliente ele fala "isso aqui está todo torto!", ai você responde, não está não, eu testei! agora eu pergunto, testou mesmo?

segundo o W3Counter até o dia de Hoje, a lista dos Top 10 Browsers é a seguinte:

1 Internet Explorer 6.0 49.21%
2 Internet Explorer 7.0 17.09%
3 Firefox 2.0 14.96%
4 Firefox 1.5 8.87%
5 Safari 2.0 1.84%
6 Firefox 1.0 1.23%
7 Opera 9.0 0.70%
8 Mozilla 1.8 0.70%
9 AOL 6.0 0.56%
10 AOL 7.0 0.46%

seguido da lista das Top 10 Resoluções:

1 1024×768 50.43%
2 1280×1024 17.03%
3 800×600 8.89%
4 1280×800 8.38%
5 1152×864 3.81%
6 1440×900 2.84%
7 1680×1050 1.95%
8 1280×768 1.28%
9 1400×1050 1.03%
10 1280×960 1.03%

No fim das contas a boa noticia é que vc não precisa mais montar layout de 750px de Largura, pode ir pros 975px de largura sem ter medo da barra de rolagem horizontal, mais por outro lado ainda tem que testar no IE6, eu sempre resmungo, porque o IE não é como o MSN que quando tem uma atualização ou você faz ou não pode mais usar.

agora como testar todos esses browsers ? simples fica uma lista de onde baixar os principais browsers:

Microsoft Internet Explorer 6, 7 e 8 RC1

IE Tester

como o windows não permite mais de uma versão do mesmo navegador, uso o IE Tester para emular todas as versões necessárias.

Mozilla Firefox 3

Firefox

aproveite e pegue os plugins para desenvolvedores aqui!

Apple Safari 4

Safari

o safari 4 está um show aparte, se você ainda não testou arrisco dizer que chegou com "pé na porta, tapa na cara" dos outros navegadores, navegação que lembra o Chrome, com ferramentas para desenvolvedores que não ficam a dever para o firefox.

Google Chrome

Chrome

O Navegador do google, sem dúvida nem um outro navegador carrega os sites do google tão rapido quanto ele, pois ele tem boa parte das coisas em cache.

Bem, esses são os que não podem faltar na sua lista, agora se você é um cara (ou moça) mais exigente, você pode completar essa lista com o Opera, Natscape, Girafa e outros. Fica a dica.