Experimento: HTML5 + CSS3

Postado por: Pedro Rogério em

Após 1 anos e meio com um layout que não me agradava muito, resolvi abrir o Photoshop e botar o lado criativo em prática, que aliás anda enferrujado.

Sim, isso mesmo, desenvolvi um layout para meu site pessoal em HTML5 + CSS3, ou vocês acham que é só o Tableless que pode fazer isso?

Novo Layout em HTML5 + CSS3 do Pinceladas da Web

O layout é bem simples, sem muita frescura mas eu acho que ficou elegante. A primeira fase foi feita, agora a minha inteção é de implementar esse memso layout também para o blog, sim, logo esse blog também será em HTML5 e CSS3. Com certeza vocês devem estar nesse momento abrindo o Internet Explorer para ver se o site funciona nele não? Sim, ele funciona, a única coisa que me preocupei para que o site funcionasse no IE foi a de adicionar um JavaScript para que ele crie as tags no DOM. Referente ao CSS não sei como está e também não tenho interesse em ver, pois até agora não testei esse site no IE7 e IE6, e nem quero testar, só abri no IE8, dei uma rápida olhada e nada mais.

Quanto aos usuários que ainda utilizam o IE6 para visitar esse site, estou pensando em uma forma de incentivá-los a deixar de utilizar esse browser, o que vocês me sugerem?

Posts Relacionados

Confira também outros artigos interessantes postados aqui no blog.

Gostou desse post?

Assine o nosso Feed RSS, siga-nos no Twitter, ou simplesmente nos recomende a seus amigos!

Sobre Pedro Rogério

Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web também escreve para o CSS no Lanche, blog voltado ao desenvolvimento front-end.

21 Responses to “Experimento: HTML5 + CSS3”

  1. Joao disse:

    Sugiro que vc mande os caras que usem IE6 morram!

  2. thiagopeixoto disse:

    mande eles pra aquele desenvolvedor do vai.la

  3. Jader Rubini disse:

    No Safari/Mac a seção “Quem é Pedro Rogério” fica à direita, acima dos boxes “CSS no Lanche” e “Twitter”, enquanto a parte à esquerda (onde realmente deveria estar o “Quem …”) fica vazia. ;)

  4. Parabéns, o código ficou muito bem estruturado e o design simples mais objetivo, digamos que ele vai direto ao ponto, como já era de se esperar não funciona muito bem no IE mesmo com o uso de hacks Javascript e como o amigo ai de cima falou “tinha” esse pequeno problema no Safari Mac mais já foi corrigido pelo Pedro, fora isso estão muito bom.

    Parabéns! sigam esse conceito, simples mais objetivo…

  5. @Jader Rubini,

    Já descobri o problema e já o solucionei. Obrigado.

  6. Augusto Gomes disse:

    Parabéns Pedro o código do site ficou muito bacana, gostei muito da borda arredondada com sombra que você fez com o css, bem bacana mesmo.

    Uma pergunta está validado o “html 5″ e o “CSS3″ no W3C? Não tenho como verificar aqui do meu trabalho pois é bloqueado.

    Obrigado!

  7. Julio Greff disse:

    Para os usuários do IE6? Como o conteúdo não deve interessar a eles, um bloqueio parecido com o que tenho no meu blog seria legal.

    Ah, e parabéns pela implemetação. Só não ficou mais legal por causa da renderização de fontes do browser que é uma droga =/

  8. Kennedy disse:

    Achei bem interessante o layout, só senti falta de um link na imagem. Assim que vejo vou no ímpeto de clicar e nada…

    Para os usuário do IE6 coloca: Clique aqui para baixar o Mozilla Firefox!

    Abraços!

  9. Filipe disse:

    Esses caras que comentam aqui com a tal morte do IE6, deveriam:

    1° Realmente saber DESENVOLVER, é esses caras que aprenderam ontem e acham que ja sao desenvolvedores.

    2° Isso ja enxeu o saco.

    3ª Vão aprender de verdade como funciona um css, xhtml, semantica, pra depois vir questionar a morte do ie6.

    De nada adianta ele morrer, se na sua grande maioria de desenvolvedores, pegam tutoriais prontos na net e ja ficam se achando os doutores de web, ou seja, não conhecem seu contexto, não conhecem realmente como a coisa funciona.

    Pedro,

    Admiro demais seu trabalho e sei a sua comptencia para o assunto, mais o restante…

  10. Felipe, entendo em parte sua indignação, uma ação mundial como estas de retirar o IE 6 da terra querer pesistência, fé e muita paciência.

    Mas acredito que a galera que tá começando a implementar agora não precisa ser especialista em semantica ou entender a diferença entre html 5 e xhtml, estas pessoas devem de fato saber que o IE 6 pode ser um grande inimigo no desenvolvimento web, o Bruno Torres disse que estamos há alguns anos atrasados por conta disto. Talvez sim…

    Rs rs, acho que você é um daqueles que precisa sentar em um divã e contar o que o IE fez de mal em sua vida. “Ele tirou minhas noites de sono, minha tranquilidade…” Mas até ele ser extindo vai tentando usar float:left, na boa maioria dos casos resolve.

    Sobre os caras que se acham o máximo, isso é muita pre-potência, em nossa área é fácil vc ficar para trás, basta ficar off-line por um tempo, voltará comendo moscas… Força coleguinhas, juntos vamos conseguir.

  11. Digo disse:

    Concordo e discordo do FILIPE.

    Realmente um cara precisa saber desenvolver para conseguir implementar um site que funcione tão bem no ie6 como em todos os outros browsers. Concordo e assino embaixo. Mas não entendo o pq de ficar tão zangado com os “copiões” da net, pois, se o ie6 realmente morreu(e eu acho que ele ainda vai durar um tempo, pois vaso ruim não quebra), não quer dizer que os problemas dos desenvolvedores acabaram. Ainda há a questão do código coeso, da semântica, das boas práticas tanto para o html, como css, como javascript e por aí vai, e isso sem contar a acessibilidade.

    Dizer que o ie6 deve morrer por causa de facilidades é uma coisa(e não a apóio), mas dizer que com a morte dele as coisas vão ficar iguais para os verdadeiros e “falsos” desenvolvedores, é generalizar muito.

    Portanto, concordo com a sua opinião, Filipe. Mas discordo quanto à preocupação com os que estão aprendendo. Há tempo pra se firmar.

    Agora, em relação aos que não estão nem aí para a qualidade, só lamento.

    Abraço!

  12. Filipe disse:

    Quanta Polemica.. ;)

    A questão aqui é: A maioria das pessoas querem tudo na mao.. na boquinha, não se preucupam em estudar e aprender.

    Apoio a morte do IE6 concerteza, mais falo sobre esses caras quererem tudo assim fácil, sem ao mínimo conhecer o processo e o contexto verdadeiramente de um desenvolvimento.

  13. Digo disse:

    Ah com certeza… e aí entra a galera que eu citei, que não tá nem aí pra questões como semântica, acessibilidade e tals… nisso concordo contigo.

    Mas o que fazer? Tanto os que estudam como os que não estudam querem a morte do ie6… =D

    e infelizmente, quem vê cara não vê coração… Quem vê um site bonito nem imagina as atrocidades que estão no código dele…

    Abraço!

  14. Ah na boa? Vou sentir saudades do IE 6, vou guardar para sempre aquele sorriso!

    Descanse em paz amigo!

  15. Pedro, já estou também entrando na onda e meu site em HTML5 está quase pronto. Um detalhe, você se preocupou com os usuários do IE8, eu não estou nem aí. não é raiva não, mas quero provar ao meu professor de web que me disse que o Mozilla Firefox é inferior ao IE. Então vamos colocar o HTML5, padrões novos, tudo novo enquanto o LINDO, ELEGANTE, POPULAR IE8 tenta atualizar seu sistema para funcionar com os padrões. ( Tirando os haks q tínhamos que fazer neh para funcionar )

    Aproveitarei e colocarei aquele script do IE, um pouco que adaptado sabe, para qualquer usuário de Internet Explorer receber o aviso.

    Estou criando um site muito bonito com muitos recursos e vamos ver até “quanto” o IE aguenta. ^^

    Ahhh Acabei de ver o Opera 10 disponível e não disponível. O link esta quebrado … mas vamos testar o Opera para ver qual é a dele?!?! ^^

    abração a todos!

    Abração!!!

  16. Wellington disse:

    Parabéns Pedro, Muito bom !

  17. Northon disse:

    Muito bom, parabéns, e me ajudou muito estudar seu código, espero que não se importe de eu usar algumas coisas como base para um projeto que tenho em andamento. Estava me batendo e não achei literatura sobre centralização com htm 5 sem usar div soup e no seu código encontrei as respostas.

    Abs.

  18. Thiago Capuano disse:

    Concordo com o Filipe.

    Quando se desenvolve um sistema devemos levar em consideração os usuários e mentalizar que muitos ainda usam o IE6 e sequer sabem que o Firefox ou Qualquer outro, há muito W98 rodando por ai ainda.

    No desenvolvimento de um sistema web deve-se pensar em todo, sempre tento ao máximo produzir um sistema que seja reconhecido pelo maior numero de navegadores possiveis, atualmente testo no IE8, FF3.5, Opera(meu preferido), Chrome e no Safari. Infelizmente não tenho como fazer testes em versões anteriores.

    E eu não posso atualizar o navegador de cada um que acessem o site.

  19. Fernando disse:

    As fontes dos posts e titulos não ficaram boas; estão serrilhadas.

  20. Charlles disse:

    Concorco com o Thiago, tem muito Pc Show do milhao com W98SE rodando por ai ainda. IE5 ainda existe pessoal! huaauhuahauh.
    Mas alexandre imagina so voce desenvolve um site HTML5 e nao preocupa com o IE8,IE7,IE6 . Se faz o site mas o cliente nao consegue visualizar nada, ai que acontece, se vai te mais problemas. Entao e melhor deixa tudo ajeitadinho pra nao ter problemas.

    Eu to aqui desenvolvendo site de Bolsas para cliente, to usando HTML5 E CSS3, mas tenho que coloca um Hack para o maldito IE6,IE7,IE8 minha cliente usa o IE6 ¬¬ .. o foda de tudo e que a propria microsoft nao preocupa com isso, ta ai um buato do Novo internet explore, vamo ve o resultado, mas pelo que sei so vai sair pro Vista e o Win7, a anta da microsoft parece que nao percebe que a maioria dos Usuarios normais usa ainda WinXp.

    Mas pelo que fiquei sabendo cresceu e muito o numero de usuarios do Firefox, tomara que a microsoft um dia pare com o maldito IE e ceda o Firefox em seus sitemas.

  21. Lue Molitoris disse:

    You tricked me you tricker. You said Big Cigar tomorrow, I’ve been trying all morning to figure out what to do with the rest of my day.

Leave a Reply