{"id":43,"date":"2010-06-06T23:06:37","date_gmt":"2010-06-06T23:06:37","guid":{"rendered":"http:\/\/jmtwebsolutions.wordpress.com\/?p=43"},"modified":"2010-06-06T23:06:37","modified_gmt":"2010-06-06T23:06:37","slug":"usando-css-sprites","status":"publish","type":"post","link":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/","title":{"rendered":"Usando CSS Sprites"},"content":{"rendered":"<p>Esta t\u00e9cnica \u00e9 aconselh\u00e1vel tanto para sites\u00a0com layout\u00a0de muitas imagens como para sites\u00a0com menus animados. Sabe quando voc\u00ea passa o mouse\u00a0sobre um item do menu de um site\u00a0e tem que esperar a imagem que corresponde ao \u201cbot\u00e3o pressionado\u201d carregar? Ou quando o conte\u00fado em texto do site j\u00e1 apareceu, mas ainda fica uma eternidade at\u00e9 carregar imagem por imagem? \u00c9 exatamente isso que vamos tentar evitar por aqui.<\/p>\n<p>Veja, por exemplo, o tempo que alguns sites conhecidos levam para carregar o <em>HTML<\/em>\u00a0e outros arquivos como imagens, css\u00a0e javascript.<\/p>\n<ul>\n<li><strong>Yahoo:<\/strong>\u00a010% do tempo carregando HTML e 90% do tempo em outras requisi\u00e7\u00f5es.<\/li>\n<li><strong>eBay:<\/strong>\u00a05% do tempo carregando HTML e 95% do tempo em outras requisi\u00e7\u00f5es.<\/li>\n<li><strong>Youtube:<\/strong>\u00a09% do tempo carregando HTML e 91% do tempo em outras requisi\u00e7\u00f5es.<\/li>\n<\/ul>\n<p>J\u00e1 d\u00e1 para ter uma id\u00e9ia de que diminuir o n\u00famero e o tamanho das requisi\u00e7\u00f5es poder\u00e1 reduzir significativamente\u00a0o tempo de carregamento de um website.<\/p>\n<p><strong>Os Sprites<\/strong><\/p>\n<p><a title=\"Wikipedia - Sprite (Computer Graphics)\" href=\"http:\/\/en.wikipedia.org\/wiki\/Sprite_(computer_graphics)\" target=\"_blank\">Sprite\u00a0[en]<\/a>\u00a0\u00e9 um frame de uma anima\u00e7\u00e3o qualquer, termo muito utilizado no desenvolvimento de jogos 2d, em que todas as poses dos personagens eram gravadas em um s\u00f3 <em>Bitmap<\/em>\u00a0para n\u00e3o sobrecarregar o hardware limitado da \u00e9poca. A programa\u00e7\u00e3o do jogo s\u00f3 tinha o trabalho de dizer qual dos sprites ia aparecer fornecendo apenas o X, Y, altura e largura correspondente no <em>Charset <\/em>do personagem.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.richardbarros.com.br\/blog\/wp-content\/uploads\/2008\/06\/ryu.jpg?w=525\" alt=\"Ryu Sprites\" data-recalc-dims=\"1\" \/><\/p>\n<p>Se a t\u00e9cnica j\u00e1 trazia uma otimiza\u00e7\u00e3o consider\u00e1vel para os processadores de games da \u00e9poca, podemos ser no m\u00ednimo otimistas com os ganhos pro desenvolvimento web.<\/p>\n<p><strong>Criando seu pr\u00f3prio CSS\u00a0Sprite<\/strong><\/p>\n<p>A cria\u00e7\u00e3o dos CSS\u00a0Sprites\u00a0\u00e9 muito simples, abra o seu editor de imagens e unifique todos os frames\u00a0do menu em uma \u00fanica figura (ou separando por \u00edtem de menu, por exemplo \u2013 crie seu pr\u00f3prio crit\u00e9rio). Neste exemplo espec\u00edfico trabalharemos\u00a0com os Sprites de todos os \u00edtens de menu em uma \u00fanica imagem. Veja abaixo.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/i1.wp.com\/www.richardbarros.com.br\/blog\/wp-content\/uploads\/2008\/06\/sprites1.jpg?w=525\" alt=\"Sprites do Menu\" data-recalc-dims=\"1\" \/><\/p>\n<p>Se f\u00f4ssemos carregar cada imagem desse menu separadamente ter\u00edamos 6 requisi\u00e7\u00f5es e 18kb no total, e com tudo em uma s\u00f3 imagem o tamanho cai para 14kb. Uma not\u00e1vel otimiza\u00e7\u00e3o.<\/p>\n<p><strong>Partindo pro CSS<\/strong><\/p>\n<p>O c\u00f3digo HTML\u00a0do exemplo \u00e9 bem simples, criaremos um menu em lista e colocaremos a imagem como background\u00a0(plano de fundo) e ao definirmos largura e altura fixa para cada item de menu, s\u00f3 aparecer\u00e1 o sprite correspondente. Veja abaixo.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.richardbarros.com.br\/blog\/wp-content\/uploads\/2008\/06\/filled.jpg?w=525\" alt=\"Sprite Cut\" data-recalc-dims=\"1\" \/><\/p>\n<p>A propriedade CSS\u00a0respons\u00e1vel pela mudan\u00e7a dos sprites \u00e9 a <em>background-position<\/em>. Ela definir\u00e1 em que posi\u00e7\u00e3o o background\u00a0ser\u00e1 exibido, e a partir da\u00ed, basta ver na figura onde est\u00e1 o X e o Y do sprite desejado.<\/p>\n<pre>\ntodos os links\u00a0dentro do menu ter\u00e3o a imagem dos sprites\ncomo background\n\n#menu li a { background: url(images\/sprites.jpg) no-repeat; display:\n\n\u00a0block; width: 120px; height: 60px; }\n\n\u00a0\n\ndefine para cada item a posi\u00e7\u00e3o em que o sprite est\u00e1 na imagem\n\n\n\n#menu li .home { background-position: 0px 0px; }\n#menu li .home:hover { background-position: 0px -60px; }\n#menu li .textos { background-position: 120px 0px; }\n#menu li .textos:hover { background-position: 120px -60px; }\n#menu li .contato { background-position: 240px 0px; }\n#menu li .contato:hover { background-position: 240px -60px; }\n<\/pre>\n<p><a title=\"Exemplo CSS Sprites Online\" href=\"http:\/\/www.richardbarros.com.br\/exemplos\/csssprites\/\" target=\"_blank\">Clique aqui para ver o exemplo online.<\/a><\/p>\n<p>Pense tamb\u00e9m na vantagem na hora de editar um layout, basta abrir uma \u00fanica imagem no Photoshop, fazer todas as altera\u00e7\u00f5es e salvar. CSS\u00a0Sprites\u00a0deixa o site\u00a0mais leve pro usu\u00e1rio, da uma folga maior pro servidor e ainda facilita a manuten\u00e7\u00e3o pro designer<\/p>\n<p>fonte: <a href=\"http:\/\/www.richardbarros.com.br\/\">http:\/\/www.richardbarros.com.br<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Esta t\u00e9cnica \u00e9 aconselh\u00e1vel tanto para sites\u00a0com layout\u00a0de muitas imagens como para sites\u00a0com menus animados. Sabe quando voc\u00ea passa o mouse\u00a0sobre um item do menu de um site\u00a0e tem que esperar a imagem que corresponde ao \u201cbot\u00e3o pressionado\u201d carregar? Ou quando o conte\u00fado em texto do site j\u00e1 apareceu, mas ainda fica uma eternidade at\u00e9 &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\" class=\"more-link\">Continue lendo<span class=\"screen-reader-text\"> &#8220;Usando CSS Sprites&#8221;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[6,8],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\r\n<title>Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites<\/title>\r\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\" \/>\r\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\r\n<meta property=\"og:type\" content=\"article\" \/>\r\n<meta property=\"og:title\" content=\"Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites\" \/>\r\n<meta property=\"og:description\" content=\"Esta t\u00e9cnica \u00e9 aconselh\u00e1vel tanto para sites\u00a0com layout\u00a0de muitas imagens como para sites\u00a0com menus animados. Sabe quando voc\u00ea passa o mouse\u00a0sobre um item do menu de um site\u00a0e tem que esperar a imagem que corresponde ao \u201cbot\u00e3o pressionado\u201d carregar? Ou quando o conte\u00fado em texto do site j\u00e1 apareceu, mas ainda fica uma eternidade at\u00e9 &hellip; Continue lendo &quot;Usando CSS Sprites&quot;\" \/>\r\n<meta property=\"og:url\" content=\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\" \/>\r\n<meta property=\"og:site_name\" content=\"JMT Cria\u00e7\u00e3o de Sites\" \/>\r\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/JMTWebsolutions\/\" \/>\r\n<meta property=\"article:published_time\" content=\"2010-06-06T23:06:37+00:00\" \/>\r\n<meta property=\"og:image\" content=\"http:\/\/www.richardbarros.com.br\/blog\/wp-content\/uploads\/2008\/06\/ryu.jpg\" \/>\r\n<meta name=\"author\" content=\"JMT Criacao de Sites\" \/>\r\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\r\n<meta name=\"twitter:creator\" content=\"@jmtwebsolutions\" \/>\r\n<meta name=\"twitter:site\" content=\"@jmtwebsolutions\" \/>\r\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"JMT Criacao de Sites\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutos\" \/>\r\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\"},\"author\":{\"name\":\"JMT Criacao de Sites\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/28c4a357100a38bba0ebb7b210a489db\"},\"headline\":\"Usando CSS Sprites\",\"datePublished\":\"2010-06-06T23:06:37+00:00\",\"dateModified\":\"2010-06-06T23:06:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\"},\"wordCount\":510,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#organization\"},\"articleSection\":[\"CSS styles\",\"Dicas\"],\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\",\"url\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\",\"name\":\"Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites\",\"isPartOf\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#website\"},\"datePublished\":\"2010-06-06T23:06:37+00:00\",\"dateModified\":\"2010-06-06T23:06:37+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jmtweb.net.br\/websites\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Usando CSS Sprites\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#website\",\"url\":\"https:\/\/jmtweb.net.br\/websites\/\",\"name\":\"JMT Cria\u00e7\u00e3o de Sites\",\"description\":\"Desenvolvimento de sistemas web\",\"publisher\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jmtweb.net.br\/websites\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#organization\",\"name\":\"JMT Cria\u00e7\u00e3o de Sites\",\"url\":\"https:\/\/jmtweb.net.br\/websites\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/i0.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2017\/06\/logo.png?fit=500%2C500&ssl=1\",\"contentUrl\":\"https:\/\/i0.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2017\/06\/logo.png?fit=500%2C500&ssl=1\",\"width\":500,\"height\":500,\"caption\":\"JMT Cria\u00e7\u00e3o de Sites\"},\"image\":{\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/JMTWebsolutions\/\",\"https:\/\/twitter.com\/jmtwebsolutions\",\"https:\/\/www.linkedin.com\/company\/jmt-web-solutions\",\"https:\/\/www.youtube.com\/channel\/UCbf_7MVzEaTrZ-Bni9rs0Dw\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/28c4a357100a38bba0ebb7b210a489db\",\"name\":\"JMT Criacao de Sites\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/587eff10a81dc390c2a1066632639bf9?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/587eff10a81dc390c2a1066632639bf9?s=96&d=mm&r=g\",\"caption\":\"JMT Criacao de Sites\"},\"sameAs\":[\"http:\/\/jmtweb.net.br\"],\"url\":\"https:\/\/jmtweb.net.br\/websites\/author\/jmt-criacao-de-sites\/\"}]}<\/script>\r\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/","og_locale":"pt_BR","og_type":"article","og_title":"Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites","og_description":"Esta t\u00e9cnica \u00e9 aconselh\u00e1vel tanto para sites\u00a0com layout\u00a0de muitas imagens como para sites\u00a0com menus animados. Sabe quando voc\u00ea passa o mouse\u00a0sobre um item do menu de um site\u00a0e tem que esperar a imagem que corresponde ao \u201cbot\u00e3o pressionado\u201d carregar? Ou quando o conte\u00fado em texto do site j\u00e1 apareceu, mas ainda fica uma eternidade at\u00e9 &hellip; Continue lendo \"Usando CSS Sprites\"","og_url":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/","og_site_name":"JMT Cria\u00e7\u00e3o de Sites","article_publisher":"https:\/\/www.facebook.com\/JMTWebsolutions\/","article_published_time":"2010-06-06T23:06:37+00:00","og_image":[{"url":"http:\/\/www.richardbarros.com.br\/blog\/wp-content\/uploads\/2008\/06\/ryu.jpg"}],"author":"JMT Criacao de Sites","twitter_card":"summary_large_image","twitter_creator":"@jmtwebsolutions","twitter_site":"@jmtwebsolutions","twitter_misc":{"Escrito por":"JMT Criacao de Sites","Est. tempo de leitura":"3 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#article","isPartOf":{"@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/"},"author":{"name":"JMT Criacao de Sites","@id":"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/28c4a357100a38bba0ebb7b210a489db"},"headline":"Usando CSS Sprites","datePublished":"2010-06-06T23:06:37+00:00","dateModified":"2010-06-06T23:06:37+00:00","mainEntityOfPage":{"@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/"},"wordCount":510,"commentCount":1,"publisher":{"@id":"https:\/\/jmtweb.net.br\/websites\/#organization"},"articleSection":["CSS styles","Dicas"],"inLanguage":"pt-BR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/","url":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/","name":"Usando CSS Sprites | JMT Cria\u00e7\u00e3o de Sites","isPartOf":{"@id":"https:\/\/jmtweb.net.br\/websites\/#website"},"datePublished":"2010-06-06T23:06:37+00:00","dateModified":"2010-06-06T23:06:37+00:00","breadcrumb":{"@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jmtweb.net.br\/websites\/usando-css-sprites\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jmtweb.net.br\/websites\/"},{"@type":"ListItem","position":2,"name":"Usando CSS Sprites"}]},{"@type":"WebSite","@id":"https:\/\/jmtweb.net.br\/websites\/#website","url":"https:\/\/jmtweb.net.br\/websites\/","name":"JMT Cria\u00e7\u00e3o de Sites","description":"Desenvolvimento de sistemas web","publisher":{"@id":"https:\/\/jmtweb.net.br\/websites\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jmtweb.net.br\/websites\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/jmtweb.net.br\/websites\/#organization","name":"JMT Cria\u00e7\u00e3o de Sites","url":"https:\/\/jmtweb.net.br\/websites\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/jmtweb.net.br\/websites\/#\/schema\/logo\/image\/","url":"https:\/\/i0.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2017\/06\/logo.png?fit=500%2C500&ssl=1","contentUrl":"https:\/\/i0.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2017\/06\/logo.png?fit=500%2C500&ssl=1","width":500,"height":500,"caption":"JMT Cria\u00e7\u00e3o de Sites"},"image":{"@id":"https:\/\/jmtweb.net.br\/websites\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/JMTWebsolutions\/","https:\/\/twitter.com\/jmtwebsolutions","https:\/\/www.linkedin.com\/company\/jmt-web-solutions","https:\/\/www.youtube.com\/channel\/UCbf_7MVzEaTrZ-Bni9rs0Dw"]},{"@type":"Person","@id":"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/28c4a357100a38bba0ebb7b210a489db","name":"JMT Criacao de Sites","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/jmtweb.net.br\/websites\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/587eff10a81dc390c2a1066632639bf9?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/587eff10a81dc390c2a1066632639bf9?s=96&d=mm&r=g","caption":"JMT Criacao de Sites"},"sameAs":["http:\/\/jmtweb.net.br"],"url":"https:\/\/jmtweb.net.br\/websites\/author\/jmt-criacao-de-sites\/"}]}},"jetpack_featured_media_url":"","jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p9cz9S-H","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":48,"url":"https:\/\/jmtweb.net.br\/websites\/cloud-server-saiba-o-que-e-e-porque-optar-por-esse-servico\/","url_meta":{"origin":43,"position":0},"title":"Cloud Server \u2013 Saiba o que \u00e9, e porque \u00e9 melhor","date":"6 de junho de 2010","format":false,"excerpt":"O que \u00e9 um servidor web? Essa pergunta pode ser respondida de duas formas: a primeira poderia ser \u201cum programa\u201d. Um servidor web\u00a0pode ser um programa que aceita pedidos http\u00a0de v\u00e1rios clientes e os responde via http\u00a0(geralmente navegadores). Podendo incluir tamb\u00e9m nessa comunica\u00e7\u00e3o dados ou objetos (Documentos HTML\u00a0e imagens). A\u2026","rel":"","context":"Em &quot;Cloud Server&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":312,"url":"https:\/\/jmtweb.net.br\/websites\/5-dicas-para-usar-a-galeria-de-imagens-do-twitter-ao-seu-favor\/","url_meta":{"origin":43,"position":1},"title":"5 dicas para usar a galeria de imagens do Twitter ao seu favor","date":"25 de agosto de 2011","format":false,"excerpt":"Exibir fotos de produtos e a\u00e7\u00f5es corporativas pode ser o come\u00e7o de um s\u00f3lido processo de engajamento de consumidores em torno de sua marca. Desde segunda-feira (22\/8) o Twitter vem exibindo na forma de galeria as imagens carregadas pelo usu\u00e1rio. Isso pode facilmente se tornar mais que um recurso engra\u00e7adinho\u2026","rel":"","context":"Em &quot;Dicas&quot;","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":976,"url":"https:\/\/jmtweb.net.br\/websites\/wordpress-lanca-a-versao-4-7-veja-as-novidades\/","url_meta":{"origin":43,"position":2},"title":"Wordpress lan\u00e7a a vers\u00e3o 4.7, veja as novidades","date":"14 de dezembro de 2016","format":false,"excerpt":"No \u00faltimo dia 06 de dezembro de 2016, o Wordpress lan\u00e7ou uma nova vers\u00e3o 4.7 do seu CMS. Com o codinome \u201cVaughan\u201d em honra ao lend\u00e1rio vocalista de Jazz Sarah Sassy Vaughan, a atualiza\u00e7\u00e3o j\u00e1 est\u00e1 dispon\u00edvel no painel de atualiza\u00e7\u00f5es e se se encontra no site oficial do Wordpress\u2026","rel":"","context":"Em &quot;blogs&quot;","img":{"alt_text":"","src":"https:\/\/i1.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2016\/12\/wordpress-4-7-vaughan.png?fit=1200%2C676&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":380,"url":"https:\/\/jmtweb.net.br\/websites\/o-novo-consumidor-na-era-da-redes-sociais\/","url_meta":{"origin":43,"position":3},"title":"O novo consumidor na era da redes sociais","date":"22 de setembro de 2011","format":false,"excerpt":"Por Cl\u00e1udio Conz 22\/09\/2011 \u00c9 uma preocupa\u00e7\u00e3o constante do Conselho de Desenvolvimento Econ\u00f4mico e Social discutir os novos meios de comunica\u00e7\u00e3o e a inclus\u00e3o digital no Brasil \u00c9 uma preocupa\u00e7\u00e3o constante do Conselho de Desenvolvimento Econ\u00f4mico e Social da Presid\u00eancia da Rep\u00fablica, \u00f3rg\u00e3o do qual fa\u00e7o parte, discutir os novos\u2026","rel":"","context":"Em &quot;Clientes&quot;","img":{"alt_text":"O novo consumidor na era das redes sociais.","src":"https:\/\/i2.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2011\/09\/dinero_redes_sociais.jpg?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1029,"url":"https:\/\/jmtweb.net.br\/websites\/chrome-62-seguridade-ssl\/","url_meta":{"origin":43,"position":4},"title":"Mudan\u00e7as na seguran\u00e7a com o Chrome 62 em outubro","date":"27 de agosto de 2017","format":false,"excerpt":"A partir da vers\u00e3o 62 do navegador todas as p\u00e1ginas sem o HTPPS conter\u00e3o o aviso de que elas n\u00e3o s\u00e3o seguras. Os esfor\u00e7os do Google com o seu navegador Chrome para provocar a transi\u00e7\u00e3o da web para HTTPS est\u00e3o come\u00e7ando a gerar resultados. O gigante do Silicon Valley j\u00e1\u2026","rel":"","context":"Em &quot;Certificados SSL&quot;","img":{"alt_text":"","src":"https:\/\/i1.wp.com\/jmtweb.net.br\/websites\/wp-content\/uploads\/2017\/08\/search.gif?fit=1016%2C744&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":358,"url":"https:\/\/jmtweb.net.br\/websites\/10-passos-para-o-facebook\/","url_meta":{"origin":43,"position":5},"title":"10 passos para o Facebook se tornar fen\u00f4meno no Brasil","date":"16 de setembro de 2011","format":false,"excerpt":"Wikerson Landim Nesta semana, o instituto de pesquisas Ibope Nielsen divulgou uma s\u00e9rie de dados sobre o uso de internet no Brasil. Entre os quesitos pesquisados, uma informa\u00e7\u00e3o em especial chamou a aten\u00e7\u00e3o. Quando o assunto \u00e9 rede social, o Orkut j\u00e1 n\u00e3o \u00e9 mais o site preferido dos brasileiros.\u2026","rel":"","context":"Em &quot;Dicas&quot;","img":{"alt_text":"Facebook: veja 10 passos para rede se tornar fen\u00c3\u00b4meno no Brasil","src":"https:\/\/i1.wp.com\/www.guiadeniteroi.com\/uploads\/geecktec_filemanager\/facebook_brasil.jpg?resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/posts\/43"}],"collection":[{"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/comments?post=43"}],"version-history":[{"count":0,"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/posts\/43\/revisions"}],"wp:attachment":[{"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/media?parent=43"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/categories?post=43"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jmtweb.net.br\/websites\/wp-json\/wp\/v2\/tags?post=43"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}