{"id":260701,"date":"2023-01-03T13:39:00","date_gmt":"2023-01-03T10:39:00","guid":{"rendered":"https:\/\/inform.click\/razoes-para-voce-mudar-para-html5-e-exemplos-que-o-defendem-ainda-mais\/"},"modified":"2023-01-03T13:39:00","modified_gmt":"2023-01-03T10:39:00","slug":"razoes-para-voce-mudar-para-html5-e-exemplos-que-o-defendem-ainda-mais","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/razoes-para-voce-mudar-para-html5-e-exemplos-que-o-defendem-ainda-mais\/","title":{"rendered":"Raz\u00f5es para voc\u00ea mudar para HTML5 e exemplos que o defendem ainda mais"},"content":{"rendered":"

\n Um trecho virtuoso da inova\u00e7\u00e3o, o HTML5 \u00e9 de fato uma tecnologia que trouxe sangue novo ao g\u00eanero de desenvolvimento de sites. Se voc\u00ea deseja que seu site tenha funcionalidades que mudam de forma ou deseja exibir um apelo visual incrivelmente bonito, o HTML5 faz o trabalho para voc\u00ea e da maneira mais formid\u00e1vel.\n<\/p>\n

\n Embora esta plataforma tenha feito sua incurs\u00e3o no dom\u00ednio do desenvolvimento web h\u00e1 algum tempo, n\u00e3o faltam webmasters que n\u00e3o a incluam em sua lista de “3 principais ferramentas preferidas” quando se trata de criar um site. desses webmasters j\u00e1 est\u00e3o usando outras plataformas para seu site, fazendo concess\u00f5es em uma s\u00e9rie de recursos que o HTML5 poderia ter integrado em seus sites.\n<\/p>\n

\n 1 D\u00e1 r\u00e9deas livres \u00e0s almas criativas
\n<\/h5>\n

\n A inova\u00e7\u00e3o \u00e9 a marca dos maiores designers e desenvolvedores, e quando surge uma ferramenta que permite exercitar sua criatividade sem limites, ela tem que ser endossada. O HTML5 se encaixa perfeitamente e da maneira mais s\u00f3lida. Como uma estrutura de desenvolvimento web, o HTML5 \u00e9 super personaliz\u00e1vel, permitindo que os profissionais de design se expressem. Ent\u00e3o, quando estar \u00e0 frente da curva est\u00e1 em sua agenda, o vag\u00e3o do HTML5 est\u00e1 l\u00e1 para peg\u00e1-lo.\n<\/p>\n

\n 2 O suporte de v\u00eddeo muito aprimorado est\u00e1 dispon\u00edvel para uso
\n<\/h5>\n

\n O suporte de v\u00eddeo foi bastante aprimorado com o novo v\u00eddeo incorporado HTML5 para os navegadores. Como nem todos os navegadores suportam diversos formatos como H.264, quando voc\u00ea deseja exibir um v\u00eddeo HTML5, deve usar o seguinte:\n<\/p>\n

<video controls=\"\" preload=\"\"><code>     <source src=\"cohagenPhoneCall.ogv\" type=\"video\/ogg; codecs='vorbis, theora'\" \/><\/code>          \n
\n  Your browser does not support the format. Download this format.<\/a>\n<\/p><\/video><\/code><\/pre>\n
\n  3 Ele permite que voc\u00ea crie sites “para dispositivos m\u00f3veis”, em vez de obrig\u00e1-lo a criar v\u00e1rias vers\u00f5es
\n<\/h5>\n
\n  Fa\u00e7a login nas an\u00e1lises do seu site, explore um pouco a superf\u00edcie e observe as plataformas de sistema operacional das quais voc\u00ea recebe a maioria das visitas. Voc\u00ea ficar\u00e1 surpreso ao ver que a maioria de suas visitas vem de usu\u00e1rios m\u00f3veis, ao contr\u00e1rio dos n\u00fameros que existiam h\u00e1 um ano, quando voc\u00ea provavelmente tinha mais usu\u00e1rios de desktop em seu site. Assim, fazer um site para celular \u00e9 muito mais recomendado do que fazer um site centrado em desktop e, em seguida, criar uma vers\u00e3o compat\u00edvel com dispositivos m\u00f3veis do mesmo. E o HTML5 torna um exerc\u00edcio altamente eficiente para criar sites feitos para dispositivos m\u00f3veis que ret\u00eam seu apelo visual quando acessados \u200b\u200bem telas menores e se adaptam ao tamanho reduzido sem lan\u00e7ar problemas de compatibilidade ou resposta para voc\u00ea.\n<\/p>\n
\n  4 Tipo de documento XHTML complicado abre caminho para uma vers\u00e3o mais f\u00e1cil e menos complicada
\n<\/h5>\n
\n  Para coloc\u00e1-lo sem equ\u00edvocos, o doctype XHTML n\u00e3o foi visto com entusiasmo pela comunidade de desenvolvedores. E a raz\u00e3o para o mesmo \u00e9 mais do que aparente com a forma como est\u00e1 escrito:\n<\/p>\n
nbsp;   \"http:\/\/www.xyz.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd\"><\/code><\/pre>\n
\n  O HTML5 tornou a declara\u00e7\u00e3o muito mais curta e compreens\u00edvel para os desenvolvedores:\n<\/p>\n
\n  5 atributos que podem ser detectados de forma mais intuitiva
\n<\/h5>\n
\n  Em primeiro lugar, os atributos que voc\u00ea usa em seu programa devem ser capazes de determinar perfeitamente se est\u00e3o sendo detectados adequadamente pelos navegadores. O HTML5 fornece a esses atributos os meios para fazer exatamente isso. Com a biblioteca Modernizr prova ser uma ferramenta engenhosa, mas existem outras maneiras, como criar os elementos antes de serem dissecados. Dessa forma, ser\u00e1 f\u00e1cil avaliar a capacidade do navegador.\n<\/p>\n
\n  6 Ele tem seu conjunto de corre\u00e7\u00f5es para IE
\n<\/h5>\n
\n  Ah, bem, o Internet Explorer \u00e9 visto de forma desapaixonada pela comunidade da Internet em todo o mundo e por raz\u00f5es muito justific\u00e1veis. Como esperado, o IE tem seus pr\u00f3prios problemas ao lidar com os novos elementos que o HTML 5 apresenta. Portanto, estilizar esses elementos de forma que eles se tornem mais compreens\u00edveis para este navegador \u00e9 importante para dar um senso de estrutura \u00e0 forma como os elementos HTML5 s\u00e3o alinhados como elementos de n\u00edvel de bloco:\n<\/p>\n
header, footer, article, section, nav, menu {\n   display: block;\n}<\/code><\/pre>\n
\n  Agora, h\u00e1 toda a possibilidade de que o Internet Explorer continue a ser um problema, pois pode n\u00e3o estar familiarizado com o elemento de cabe\u00e7alho. Portanto, o estilo no HTML5 corre o risco de ser descaradamente ignorado. Dito isto, existe uma solu\u00e7\u00e3o f\u00e1cil para o mesmo:\n<\/p>\n
document.createElement(\"article\");\ndocument.createElement(\"footer\");\ndocument.createElement(\"header\");\ndocument.createElement(\"nav\");\ndocument.createElement(\"menu\");<\/code><\/pre>\n
\n  7 Geolocaliza\u00e7\u00e3o
\n<\/h5>\n
\n  A geolocaliza\u00e7\u00e3o \u00e9 inegavelmente o recurso de captura do HTML5. O que ele faz \u00e9 lan\u00e7ar para voc\u00ea os valores matem\u00e1ticos que representam as coordenadas da localiza\u00e7\u00e3o do seu usu\u00e1rio. Essas coordenadas de localiza\u00e7\u00e3o s\u00e3o calculadas usando o navegador que o visitante est\u00e1 usando para acessar o site.\n<\/p>\n
\n  8 c\u00f3digos que s\u00e3o livres de confus\u00f5es e muito mais compreens\u00edveis
\n<\/h5>\n
\n  \u00c9 sempre recomend\u00e1vel escrever programas que sejam limpos, f\u00e1ceis de compreender e escritos de maneira mais reutiliz\u00e1vel. O HTML5 torna tudo isso poss\u00edvel e muito mais ao facilitar um c\u00f3digo altamente sincr\u00f4nico, sem\u00e2ntico e d\u00e1 a liberdade de tra\u00e7ar uma linha entre estilo e conte\u00fado para que sejam facilmente compreendidos. Um c\u00f3digo de cabe\u00e7alho padr\u00e3o com navega\u00e7\u00e3o se parece com isto:\n<\/p>\n
\n  \u00a0<\/code><\/p>\n
\n    Header Text<\/code>
\n  <\/h1>\n
\u00a0<\/code><\/p>\n
\n    \u00a0\u00a0<\/code><\/p>\n
    \n         <\/p>\n
  • \n        <a href=\"https:\/\/inform.clickx\">Link<\/a><\/code>\n      <\/li>\n
       <\/p>\n
  • \n        <a href=\"https:\/\/inform.clickx\">Link<\/a><\/code>\n      <\/li>\n
       <\/p>\n
  • \n        <a href=\"https:\/\/inform.clickx\">Link<\/a><\/code>\n      <\/li>\n
      \n    <\/ul>\n
    \u00a0<\/code>\n  <\/div>\n<\/div>\n
    \n  Embora voc\u00ea possa argumentar que o c\u00f3digo \u00e9 bastante simples, vamos ver o que o HTML5 pode fazer com ele:<\/code>\n<\/p>\n
    \n  \u00a0<\/code><\/p>\n
    \n    Header Text<\/code>
    \n  <\/h1>\n
    \u00a0<\/code><\/p>\n