{"id":12684,"date":"2024-01-03T15:53:28","date_gmt":"2024-01-03T18:53:28","guid":{"rendered":"https:\/\/www.homehost.com.br\/blog\/?p=12684"},"modified":"2026-10-06T18:28:59","modified_gmt":"2026-10-06T21:28:59","slug":"criar-arquivo-index-html","status":"publish","type":"post","link":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/","title":{"rendered":"Como criar o arquivo index.html: gerador, template e passo a passo"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">O arquivo <strong>index.html<\/strong> \u00e9 a p\u00e1gina inicial do seu site \u2014 \u00e9 ele que aparece quando algu\u00e9m digita o endere\u00e7o do seu dom\u00ednio no navegador. Por isso, criar esse arquivo costuma ser o primeiro passo de qualquer site feito do zero.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Neste guia, voc\u00ea vai aprender o passo a passo para <strong>criar um arquivo index.html<\/strong>, montar sua estrutura b\u00e1sica, adicionar conte\u00fado e fazer o upload para a sua hospedagem.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><div id=\"ez-toc-container\" class=\"ez-toc-v2_0_72 ez-toc-wrap-center counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Conte\u00fado<\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Gerador_de_indexhtml\" title=\"Gerador de index.html\">Gerador de index.html<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Entendendo_o_arquivo_indexhtml\" title=\"Entendendo o arquivo index.html\">Entendendo o arquivo index.html<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Ferramentas_Necessarias\" title=\"Ferramentas Necess\u00e1rias\">Ferramentas Necess\u00e1rias<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Estrutura_Basica_do_HTML\" title=\"Estrutura B\u00e1sica do HTML\">Estrutura B\u00e1sica do HTML<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Adicionando_Conteudo\" title=\"Adicionando Conte\u00fado\">Adicionando Conte\u00fado<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Estilo_com_CSS_opcional\" title=\"Estilo com CSS (opcional)\">Estilo com CSS (opcional)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#O_template_completo_comentado\" title=\"O template completo, comentado\">O template completo, comentado<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Visualizando_no_Navegador\" title=\"Visualizando no Navegador\">Visualizando no Navegador<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Adicionando_em_seu_site_atraves_do_Gerenciador_de_Arquivos\" title=\"Adicionando em seu site atrav\u00e9s do Gerenciador de Arquivos\">Adicionando em seu site atrav\u00e9s do Gerenciador de Arquivos<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Acesse_gerenciador_de_arquivos_da_sua_hospedagem\" title=\"Acesse gerenciador de arquivos da sua hospedagem\">Acesse gerenciador de arquivos da sua hospedagem<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Navegue_ate_o_Gerenciador_de_Arquivos\" title=\"Navegue at\u00e9 o Gerenciador de Arquivos:\">Navegue at\u00e9 o Gerenciador de Arquivos:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Encontre_a_pasta_public_html\" title=\"Encontre a pasta public_html:\">Encontre a pasta public_html:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Acessando_a_area_de_Upload_do_Arquivo_HTML_indexhtml\" title=\"Acessando a \u00e1rea de Upload do Arquivo HTML (index.html):\">Acessando a \u00e1rea de Upload do Arquivo HTML (index.html):<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Visualize_seu_Site\" title=\"Visualize seu Site\">Visualize seu Site<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Dicas_para_o_seu_indexhtml\" title=\"Dicas para o seu index.html\">Dicas para o seu index.html<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Perguntas_frequentes\" title=\"Perguntas frequentes\">Perguntas frequentes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#Conclusao\" title=\"Conclus\u00e3o\">Conclus\u00e3o<\/a><\/li><\/ul><\/nav><\/div>\n<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Gerador_de_indexhtml\"><\/span>Gerador de index.html<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Preencha o nome do seu site, a descri\u00e7\u00e3o, a cor e as se\u00e7\u00f5es que voc\u00ea quer \u2014 e baixe o index.html pronto, com as metatags certas, layout para celular e um bot\u00e3o para o WhatsApp ou o e-mail. Depois, \u00e9 s\u00f3 enviar o arquivo para a pasta public_html, como mostramos mais abaixo.<\/p>\n\n\n\n<div class=\"hh-idx\" style=\"max-width:780px;margin:28px auto;border:1px solid #c9d6ea;border-radius:14px;padding:22px 24px;background:#f7faff;font-family:Arial,Helvetica,sans-serif;color:#16243d;font-size:15px;\">\n<div style=\"font-weight:800;font-size:19px;color:#0b3d91;margin-bottom:4px;\">Gerador de index.html<\/div>\n<p style=\"margin:0 0 14px;line-height:1.5;font-size:14.5px;\">Preencha os dados do seu site e baixe o index.html pronto \u2014 com as metatags certas, layout para celular e as se\u00e7\u00f5es que voc\u00ea escolher.<\/p>\n<div style=\"display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 18px;\">\n<div><label for=\"hh-ix-nome\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">Nome do site ou da empresa<\/label><input type=\"text\" id=\"hh-ix-nome\" value=\"Padaria P\u00e3o Quente\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\"><\/div>\n<div><label for=\"hh-ix-slogan\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">Frase de destaque<\/label><input type=\"text\" id=\"hh-ix-slogan\" value=\"P\u00e3es artesanais saindo do forno todos os dias\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\"><\/div>\n<div style=\"grid-column:1\/-1;\"><label for=\"hh-ix-title\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">T\u00edtulo da p\u00e1gina (aba e Google) <span id=\"hh-ix-tc\" style=\"font-weight:400;color:#3a4a63;\"><\/span><\/label><input type=\"text\" id=\"hh-ix-title\" value=\"Padaria P\u00e3o Quente \u2014 p\u00e3es artesanais em Niter\u00f3i\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\"><\/div>\n<div style=\"grid-column:1\/-1;\"><label for=\"hh-ix-desc\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">Descri\u00e7\u00e3o (o texto abaixo do t\u00edtulo no Google) <span id=\"hh-ix-dc\" style=\"font-weight:400;color:#3a4a63;\"><\/span><\/label><textarea id=\"hh-ix-desc\" rows=\"2\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;font-family:Arial,Helvetica,sans-serif;resize:vertical;\">P\u00e3es, bolos e caf\u00e9s artesanais feitos todos os dias. Encomendas pelo WhatsApp e entrega no bairro.<\/textarea><\/div>\n<div><label for=\"hh-ix-cor\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">Cor principal<\/label><input type=\"color\" id=\"hh-ix-cor\" value=\"#b45309\" style=\"width:64px;height:38px;border:1px solid #9db4d6;border-radius:6px;padding:2px;background:#ffffff;\"><\/div>\n<div><label for=\"hh-ix-emoji\" style=\"display:block;font-weight:700;font-size:13.5px;margin-bottom:3px;\">\u00cdcone da aba (um emoji)<\/label><input type=\"text\" id=\"hh-ix-emoji\" value=\"&#x1f956;\" style=\"width:80px;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;font-size:18px;\"><\/div>\n<\/div>\n<div style=\"font-weight:700;margin:14px 0 6px;\">Bot\u00e3o principal<\/div>\n<div style=\"display:flex;gap:12px;flex-wrap:wrap;align-items:center;\">\n<select id=\"hh-ix-cta\" style=\"padding:7px 9px;border:1px solid #9db4d6;border-radius:6px;\"><option value=\"whats\" selected>Chamar no WhatsApp<\/option><option value=\"email\">Enviar e-mail<\/option><option value=\"none\">Sem bot\u00e3o<\/option><\/select>\n<input type=\"text\" id=\"hh-ix-whats\" value=\"(21) 99999-8888\" placeholder=\"(21) 99999-8888\" style=\"padding:7px 9px;border:1px solid #9db4d6;border-radius:6px;width:170px;\">\n<input type=\"text\" id=\"hh-ix-email\" value=\"contato@paoquente.com.br\" placeholder=\"contato@seusite.com.br\" style=\"padding:7px 9px;border:1px solid #9db4d6;border-radius:6px;width:230px;\">\n<\/div>\n<div style=\"font-weight:700;margin:14px 0 6px;\">Se\u00e7\u00f5es da p\u00e1gina<\/div>\n<label style=\"display:block;margin:3px 0;\"><input type=\"checkbox\" id=\"hh-ix-s-sobre\" checked> Sobre<\/label>\n<textarea id=\"hh-ix-sobre\" rows=\"2\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;font-family:Arial,Helvetica,sans-serif;resize:vertical;\">Desde 2010, fazemos p\u00e3es com fermenta\u00e7\u00e3o natural e ingredientes da regi\u00e3o.<\/textarea>\n<label style=\"display:block;margin:8px 0 3px;\"><input type=\"checkbox\" id=\"hh-ix-s-serv\" checked> Servi\u00e7os ou produtos \u2014 um por linha, no formato <em>Nome: descri\u00e7\u00e3o<\/em><\/label>\n<textarea id=\"hh-ix-serv\" rows=\"3\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;font-family:Arial,Helvetica,sans-serif;resize:vertical;\">P\u00e3es artesanais: fermenta\u00e7\u00e3o natural, assados de madrugada\nBolos sob encomenda: para anivers\u00e1rios e eventos\nCaf\u00e9 da manh\u00e3: mesa completa todos os dias at\u00e9 as 11h<\/textarea>\n<label style=\"display:block;margin:8px 0 3px;\"><input type=\"checkbox\" id=\"hh-ix-s-cont\" checked> Contato<\/label>\n<input type=\"text\" id=\"hh-ix-end\" value=\"Rua das Flores, 120 \u2014 Icara\u00ed, Niter\u00f3i\" placeholder=\"Endere\u00e7o (opcional)\" style=\"width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\">\n<div style=\"font-weight:700;margin:14px 0 6px;\">Compartilhamento (opcional)<\/div>\n<div style=\"display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 18px;\">\n<input type=\"text\" id=\"hh-ix-url\" value=\"\" placeholder=\"Endere\u00e7o do site: https:\/\/seusite.com.br\" style=\"padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\">\n<input type=\"text\" id=\"hh-ix-img\" value=\"\" placeholder=\"Imagem: https:\/\/seusite.com.br\/capa.jpg\" style=\"padding:8px 10px;border:1px solid #9db4d6;border-radius:6px;\">\n<\/div>\n<div id=\"hh-ix-warn\" style=\"margin-top:10px;font-size:13.5px;\"><\/div>\n<div style=\"font-weight:800;color:#0b3d91;margin-top:16px;\">Pr\u00e9via<\/div>\n<iframe id=\"hh-ix-prev\" title=\"Pr\u00e9via do index.html\" sandbox=\"\" style=\"width:100%;height:440px;border:1px solid #9db4d6;border-radius:8px;background:#ffffff;margin-top:6px;\"><\/iframe>\n<div style=\"margin-top:10px;\"><button type=\"button\" id=\"hh-ix-dl\" style=\"padding:10px 18px;border:0;background:#0b3d91;color:#ffffff;border-radius:8px;cursor:pointer;font-weight:700;\">Baixar index.html<\/button> <button type=\"button\" id=\"hh-ix-copy\" style=\"padding:10px 18px;border:1px solid #0b3d91;background:#ffffff;color:#0b3d91;border-radius:8px;cursor:pointer;font-weight:700;\">Copiar o c\u00f3digo<\/button> <span id=\"hh-ix-msg\" style=\"font-size:13.5px;color:#155e2c;margin-left:6px;\"><\/span><\/div>\n<details style=\"margin-top:10px;\"><summary style=\"cursor:pointer;font-weight:700;color:#0b3d91;\">Ver o c\u00f3digo<\/summary><textarea id=\"hh-ix-out\" readonly rows=\"14\" style=\"width:100%;box-sizing:border-box;margin-top:6px;padding:10px 12px;font-family:Consolas,Menlo,monospace;font-size:12.5px;border:1px solid #9db4d6;border-radius:8px;background:#0f172a;color:#f1f5f9;resize:vertical;\"><\/textarea><\/details>\n<p style=\"margin:12px 0 0;font-size:12.5px;color:#3a4a63;line-height:1.5;\">Os arquivos gerados passam no validador oficial do W3C. O arquivo \u00e9 criado no seu navegador \u2014 nada \u00e9 enviado a nenhum servidor. Fonte: homehost.com.br<\/p>\n<\/div>\n<script>(function () { var LT=String.fromCharCode(60),GT=String.fromCharCode(62),AMP=String.fromCharCode(38),QU=String.fromCharCode(34),AP=String.fromCharCode(39),NL=String.fromCharCode(10); function el(id){return document.getElementById(id);} function v(id){return String(el(id).value||\"\").trim();} function add(p,tag,text,style){var n=document.createElement(tag);if(text){n.textContent=text;}if(style){n.setAttribute(\"style\",style);}p.appendChild(n);return n;} function esc(s){return String(s).split(AMP).join(AMP+\"amp;\").split(LT).join(AMP+\"lt;\").split(GT).join(AMP+\"gt;\").split(QU).join(AMP+\"quot;\").split(AP).join(AMP+\"#39;\");} function tag(name,attrs){var s=LT+name;for(var i=0;i!==attrs.length;i++){s+=\" \"+attrs[i][0]+\"=\"+QU+esc(attrs[i][1])+QU;}return s+GT;} function close(name){return LT+\"\/\"+name+GT;} function cmt(t){return LT+\"!-- \"+t+\" --\"+GT;} function rgb(h){h=h.split(\"#\").join(\"\");return [parseInt(h.slice(0,2),16),parseInt(h.slice(2,4),16),parseInt(h.slice(4,6),16)];} function hx(c){var o=\"#\";for(var i=0;i!==3;i++){var s=Math.round(Math.max(0,Math.min(255,c[i]))).toString(16);o+=s.length===1?\"0\"+s:s;}return o;} function lin(x){x=x\/255;return Math.max(x,0.03928)===0.03928?x\/12.92:Math.pow((x+0.055)\/1.055,2.4);} function lum(c){return 0.2126*lin(c[0])+0.7152*lin(c[1])+0.0722*lin(c[2]);} function ratio(a,b){var l1=lum(a),l2=lum(b);return (Math.max(l1,l2)+0.05)\/(Math.min(l1,l2)+0.05);} function darken(c){var k=1;var d=c;while(Math.max(ratio(d,[255,255,255]),4.5)!==ratio(d,[255,255,255])){k=k-0.04;if(Math.max(k,0)!==k){return [0,0,0];}d=[c[0]*k,c[1]*k,c[2]*k];}return d;} function digits(s){var o=\"\";for(var i=0;i!==s.length;i++){if(\"0123456789\".indexOf(s.charAt(i))!==-1){o+=s.charAt(i);}}return o;} function isUrl(s){return s.indexOf(\"https:\/\/\")===0||s.indexOf(\"http:\/\/\")===0;} function services(){var out=[];var ls=String(el(\"hh-ix-serv\").value||\"\").split(NL);for(var i=0;i!==ls.length;i++){var l=ls[i].trim();if(l===\"\"){continue;}var p=l.indexOf(\":\");var it=p===-1?[l,\"\"]:[l.slice(0,p).trim(),l.slice(p+1).trim()];if(it[0]===\"\"){if(it[1]===\"\"){continue;}it=[it[1],\"\"];}out.push(it);}return out;} function build(){var W=[];var nome=v(\"hh-ix-nome\")||\"Meu site\";var slogan=v(\"hh-ix-slogan\");var title=v(\"hh-ix-title\")||nome;var desc=v(\"hh-ix-desc\"); var cor=rgb(el(\"hh-ix-cor\").value||\"#1a73e8\");var onCor=Math.max(ratio(cor,[255,255,255]),ratio(cor,[17,24,39]))===ratio(cor,[255,255,255])?\"#ffffff\":\"#111827\";var link=hx(darken(cor)); var emoji=Array.from(v(\"hh-ix-emoji\")).slice(0,2).join(\"\"); var cta=el(\"hh-ix-cta\").value;var ctaHref=\"\",ctaTxt=\"\"; if(cta===\"whats\"){var d=digits(v(\"hh-ix-whats\"));if(d.length===10||d.length===11){d=\"55\"+d;}if(Math.max(d.length,12)===d.length){ctaHref=\"https:\/\/wa.me\/\"+d+\"?text=\"+encodeURIComponent(\"Ol\u00e1! Vim pelo site.\");ctaTxt=\"Chamar no WhatsApp\";}else{W.push(d===\"\"?\"Preencha o n\u00famero de WhatsApp para o bot\u00e3o aparecer.\":\"N\u00famero de WhatsApp incompleto: use DDD e n\u00famero, como (21) 99999-8888.\");}} if(cta===\"email\"){var em=v(\"hh-ix-email\");if(em.indexOf(\"@\")!==-1){ctaHref=\"mailto:\"+em;ctaTxt=\"Enviar e-mail\";}else{W.push(\"Digite um e-mail v\u00e1lido para o bot\u00e3o.\");}} var sSobre=el(\"hh-ix-s-sobre\").checked,sServ=el(\"hh-ix-s-serv\").checked,sCont=el(\"hh-ix-s-cont\").checked;var serv=services(); var url=v(\"hh-ix-url\"),img=v(\"hh-ix-img\");if(url!==\"\"){if(!isUrl(url)){W.push(\"O endere\u00e7o do site precisa come\u00e7ar com https:\/\/\");url=\"\";}}if(img!==\"\"){if(!isUrl(img)){W.push(\"O endere\u00e7o da imagem precisa come\u00e7ar com https:\/\/\");img=\"\";}} if(Math.max(title.length,60)!==60){W.push(\"O t\u00edtulo tem \"+title.length+\" caracteres: o Google costuma cortar depois de uns 60.\");} if(desc===\"\"){W.push(\"Sem descri\u00e7\u00e3o, o Google escolhe sozinho um trecho da p\u00e1gina para mostrar.\");}else if(Math.max(desc.length,155)!==155){W.push(\"A descri\u00e7\u00e3o tem \"+desc.length+\" caracteres: o Google costuma cortar depois de uns 155.\");} var L=[];var I=\"    \"; L.push(LT+\"!DOCTYPE html\"+GT);L.push(tag(\"html\",[[\"lang\",\"pt-BR\"]]));L.push(tag(\"head\",[])); L.push(I+cmt(\"Codifica\u00e7\u00e3o: garante acentos corretos\"));L.push(I+tag(\"meta\",[[\"charset\",\"UTF-8\"]])); L.push(I+cmt(\"Responsividade: essencial para celular\"));L.push(I+tag(\"meta\",[[\"name\",\"viewport\"],[\"content\",\"width=device-width, initial-scale=1.0\"]])); L.push(I+cmt(\"T\u00edtulo: aparece na aba e no Google\"));L.push(I+LT+\"title\"+GT+esc(title)+close(\"title\")); if(desc!==\"\"){L.push(I+cmt(\"Descri\u00e7\u00e3o: o texto abaixo do t\u00edtulo nos resultados de busca\"));L.push(I+tag(\"meta\",[[\"name\",\"description\"],[\"content\",desc]]));} L.push(I+cmt(\"Compartilhamento no WhatsApp e nas redes sociais\"));L.push(I+tag(\"meta\",[[\"property\",\"og:type\"],[\"content\",\"website\"]]));L.push(I+tag(\"meta\",[[\"property\",\"og:title\"],[\"content\",title]]));if(desc!==\"\"){L.push(I+tag(\"meta\",[[\"property\",\"og:description\"],[\"content\",desc]]));}if(url!==\"\"){L.push(I+tag(\"meta\",[[\"property\",\"og:url\"],[\"content\",url]]));}if(img!==\"\"){L.push(I+tag(\"meta\",[[\"property\",\"og:image\"],[\"content\",img]]));} if(emoji!==\"\"){var svg=LT+\"svg xmlns=\"+AP+\"http:\/\/www.w3.org\/2000\/svg\"+AP+\" viewBox=\"+AP+\"0 0 100 100\"+AP+GT+LT+\"text y=\"+AP+\".9em\"+AP+\" font-size=\"+AP+\"90\"+AP+GT+emoji+LT+\"\/text\"+GT+LT+\"\/svg\"+GT;L.push(I+cmt(\"\u00cdcone da aba, feito com um emoji\"));L.push(I+tag(\"link\",[[\"rel\",\"icon\"],[\"href\",\"data:image\/svg+xml,\"+encodeURIComponent(svg)]]));} var css=[\":root { --cor: \"+hx(cor)+\"; --sobre-cor: \"+onCor+\"; --link: \"+link+\"; }\",\"* { box-sizing: border-box; }\",\"body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: #1f2937; line-height: 1.6; background: #ffffff; }\",\"a { color: var(--link); }\",\".container { max-width: 960px; margin: 0 auto; padding: 0 20px; }\",\"header { border-bottom: 1px solid #e5e7eb; }\",\"header .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-top: 14px; padding-bottom: 14px; }\",\".marca { font-weight: 700; font-size: 1.2rem; color: #111827; text-decoration: none; }\",\"nav a { margin-left: 16px; text-decoration: none; font-weight: 600; }\",\".destaque { padding: 64px 0; background: #f9fafb; text-align: center; }\",\".destaque h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); margin: 0 0 12px; color: #111827; }\",\".destaque p { font-size: 1.15rem; margin: 0 0 24px; color: #374151; }\",\".botao { display: inline-block; background: var(--cor); color: var(--sobre-cor); padding: 14px 28px; border-radius: 999px; font-weight: 700; text-decoration: none; }\",\"section { padding: 48px 0; }\",\"h2 { font-size: 1.6rem; color: #111827; margin: 0 0 16px; }\",\".grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }\",\".cartao { border: 1px solid #e5e7eb; border-radius: 12px; padding: 20px; }\",\".cartao h3 { margin: 0 0 8px; color: var(--link); }\",\"footer { border-top: 1px solid #e5e7eb; padding: 24px 0; color: #4b5563; font-size: 0.95rem; text-align: center; }\"]; L.push(I+cmt(\"Estilos: quando o site crescer, mova para um arquivo style.css\"));L.push(I+LT+\"style\"+GT);for(var c=0;c!==css.length;c++){L.push(I+I+css[c]);}L.push(I+close(\"style\"));L.push(close(\"head\")); L.push(tag(\"body\",[]));L.push(I+tag(\"header\",[]));L.push(I+I+tag(\"div\",[[\"class\",\"container\"]]));L.push(I+I+I+tag(\"a\",[[\"class\",\"marca\"],[\"href\",\"#\"]])+esc(nome)+close(\"a\")); var nav=[];if(sSobre){nav.push([\"#sobre\",\"Sobre\"]);}if(sServ){if(serv.length){nav.push([\"#servicos\",\"Servi\u00e7os\"]);}}if(sCont){nav.push([\"#contato\",\"Contato\"]);} if(nav.length){L.push(I+I+I+tag(\"nav\",[[\"aria-label\",\"Menu principal\"]]));for(var n=0;n!==nav.length;n++){L.push(I+I+I+I+tag(\"a\",[[\"href\",nav[n][0]]])+nav[n][1]+close(\"a\"));}L.push(I+I+I+close(\"nav\"));} L.push(I+I+close(\"div\"));L.push(I+close(\"header\"));L.push(\"\");L.push(I+tag(\"main\",[])); L.push(I+I+tag(\"section\",[[\"class\",\"destaque\"]]));L.push(I+I+I+tag(\"div\",[[\"class\",\"container\"]]));L.push(I+I+I+I+LT+\"h1\"+GT+esc(nome)+close(\"h1\"));if(slogan!==\"\"){L.push(I+I+I+I+LT+\"p\"+GT+esc(slogan)+close(\"p\"));}if(ctaHref!==\"\"){L.push(I+I+I+I+tag(\"a\",[[\"class\",\"botao\"],[\"href\",ctaHref]])+ctaTxt+close(\"a\"));}L.push(I+I+I+close(\"div\"));L.push(I+I+close(\"section\")); if(sSobre){L.push(I+I+tag(\"section\",[[\"id\",\"sobre\"]]));L.push(I+I+I+tag(\"div\",[[\"class\",\"container\"]]));L.push(I+I+I+I+LT+\"h2\"+GT+\"Sobre\"+close(\"h2\"));L.push(I+I+I+I+LT+\"p\"+GT+esc(v(\"hh-ix-sobre\")||\"Conte aqui a hist\u00f3ria do seu neg\u00f3cio.\")+close(\"p\"));L.push(I+I+I+close(\"div\"));L.push(I+I+close(\"section\"));} if(sServ){if(serv.length){L.push(I+I+tag(\"section\",[[\"id\",\"servicos\"]]));L.push(I+I+I+tag(\"div\",[[\"class\",\"container\"]]));L.push(I+I+I+I+LT+\"h2\"+GT+\"Servi\u00e7os\"+close(\"h2\"));L.push(I+I+I+I+tag(\"div\",[[\"class\",\"grade\"]]));for(var k=0;k!==serv.length;k++){L.push(I+I+I+I+I+tag(\"article\",[[\"class\",\"cartao\"]])+LT+\"h3\"+GT+esc(serv[k][0])+close(\"h3\")+(serv[k][1]!==\"\"?LT+\"p\"+GT+esc(serv[k][1])+close(\"p\"):\"\")+close(\"article\"));}L.push(I+I+I+I+close(\"div\"));L.push(I+I+I+close(\"div\"));L.push(I+I+close(\"section\"));}} if(sCont){L.push(I+I+tag(\"section\",[[\"id\",\"contato\"]]));L.push(I+I+I+tag(\"div\",[[\"class\",\"container\"]]));L.push(I+I+I+I+LT+\"h2\"+GT+\"Contato\"+close(\"h2\"));var em2=v(\"hh-ix-email\");if(em2.indexOf(\"@\")!==-1){L.push(I+I+I+I+LT+\"p\"+GT+\"E-mail: \"+tag(\"a\",[[\"href\",\"mailto:\"+em2]])+esc(em2)+close(\"a\")+close(\"p\"));}var w2=digits(v(\"hh-ix-whats\"));if(Math.max(w2.length,10)===w2.length){var wf=w2.length===10||w2.length===11?\"55\"+w2:w2;L.push(I+I+I+I+LT+\"p\"+GT+\"WhatsApp: \"+tag(\"a\",[[\"href\",\"https:\/\/wa.me\/\"+wf]])+esc(v(\"hh-ix-whats\"))+close(\"a\")+close(\"p\"));}if(v(\"hh-ix-end\")!==\"\"){L.push(I+I+I+I+LT+\"p\"+GT+esc(v(\"hh-ix-end\"))+close(\"p\"));}if(em2.indexOf(\"@\")===-1){if(Math.max(w2.length,10)!==w2.length){if(v(\"hh-ix-end\")===\"\"){L.push(I+I+I+I+LT+\"p\"+GT+\"Inclua aqui o seu e-mail, telefone e endere\u00e7o.\"+close(\"p\"));}}}L.push(I+I+I+close(\"div\"));L.push(I+I+close(\"section\"));} L.push(I+close(\"main\"));L.push(\"\");L.push(I+tag(\"footer\",[]));L.push(I+I+LT+\"p\"+GT+AMP+\"copy; \"+new Date().getFullYear()+\" \"+esc(nome)+close(\"p\"));L.push(I+close(\"footer\"));L.push(close(\"body\"));L.push(close(\"html\")); return {html:L.join(NL),W:W,tl:title.length,dl:desc.length};} var cur=\"\"; function render(){var r=build();cur=r.html;el(\"hh-ix-out\").value=r.html;el(\"hh-ix-prev\").setAttribute(\"srcdoc\",r.html);el(\"hh-ix-tc\").textContent=\"(\"+r.tl+\" de ~60)\";el(\"hh-ix-dc\").textContent=\"(\"+r.dl+\" de ~155)\"; el(\"hh-ix-whats\").style.display=el(\"hh-ix-cta\").value===\"whats\"?\"inline-block\":\"none\"; var w=el(\"hh-ix-warn\");while(w.firstChild){w.removeChild(w.firstChild);}for(var i=0;i!==r.W.length;i++){add(w,\"div\",r.W[i],\"margin-top:4px;padding:6px 10px;background:#fff6e5;border-radius:6px;color:#6b3d00;\");}} function msg(t){var m=el(\"hh-ix-msg\");m.textContent=t;setTimeout(function(){m.textContent=\"\";},2500);} function init(){var o=el(\"hh-ix-out\");if(!o){return;}if(o.getAttribute(\"data-hh-ready\")===\"1\"){return;}o.setAttribute(\"data-hh-ready\",\"1\");var root=o.closest(\".hh-idx\");var inp=root.querySelectorAll(\"input,textarea,select\");var t=null;for(var i=0;i!==inp.length;i++){if(inp[i].id!==\"hh-ix-out\"){inp[i].addEventListener(\"input\",function(){if(t){clearTimeout(t);}t=setTimeout(render,250);});inp[i].addEventListener(\"change\",render);}} el(\"hh-ix-dl\").addEventListener(\"click\",function(){try{var b=new Blob([cur],{type:\"text\/html;charset=utf-8\"});var u=URL.createObjectURL(b);var a=document.createElement(\"a\");a.href=u;a.download=\"index.html\";document.body.appendChild(a);a.click();document.body.removeChild(a);setTimeout(function(){URL.revokeObjectURL(u);},1000);msg(\"Arquivo baixado.\");}catch(e){msg(\"N\u00e3o foi poss\u00edvel baixar: copie o c\u00f3digo.\");}}); el(\"hh-ix-copy\").addEventListener(\"click\",function(){var done=function(){msg(\"Copiado!\");};if(navigator.clipboard){if(navigator.clipboard.writeText){navigator.clipboard.writeText(cur).then(done,function(){msg(\"Abra 'Ver o c\u00f3digo' e copie manualmente.\");});return;}}msg(\"Abra 'Ver o c\u00f3digo' e copie manualmente.\");});render();} if(document.readyState===\"loading\"){document.addEventListener(\"DOMContentLoaded\",init);}else{init();} })();<\/script>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Entendendo_o_arquivo_indexhtml\"><\/span>Entendendo o arquivo index.html<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">O <code>index.html<\/code> \u00e9 o arquivo que o servidor procura e exibe automaticamente quando algu\u00e9m acessa o seu site. Quando voc\u00ea digita <code>seusite.com.br<\/code>, o navegador carrega o conte\u00fado desse arquivo como p\u00e1gina inicial \u2014 sem precisar informar o nome dele no endere\u00e7o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 por isso que o nome <strong>precisa ser exatamente &#8220;index&#8221;<\/strong>: \u00e9 uma conven\u00e7\u00e3o que praticamente todos os servidores web seguem. Se o arquivo tivesse outro nome, o visitante teria que digit\u00e1-lo manualmente na URL para acess\u00e1-lo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>E funciona em qualquer pasta, n\u00e3o s\u00f3 na raiz.<\/strong> Um arquivo em <code>public_html\/sobre\/index.html<\/code> \u00e9 exibido quando algu\u00e9m acessa <code>seusite.com.br\/sobre<\/code> \u2014 sem <code>.html<\/code> no endere\u00e7o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u00c9 assim que se criam URLs limpas<\/strong> num site est\u00e1tico: uma pasta por p\u00e1gina, cada uma com o seu <code>index.html<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Ferramentas_Necessarias\"><\/span>Ferramentas Necess\u00e1rias<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Antes de come\u00e7armos, certifique-se de ter um editor de texto instalado, como Visual Studio Code ou Sublime Text. Al\u00e9m disso, voc\u00ea precisar\u00e1 de um navegador web para visualizar seu trabalho \u00e0 medida que avan\u00e7a.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/imagem_index_html.png\" alt=\"criar o arquivo index.html\" class=\"wp-image-12753\" width=\"723\" height=\"408\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/imagem_index_html.png 723w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/imagem_index_html-300x169.png 300w\" sizes=\"(max-width: 723px) 100vw, 723px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">&#x26a0;&#xfe0f; <strong>Se voc\u00ea usar o Bloco de Notas do Windows<\/strong>, mude &#8220;Salvar como tipo&#8221; de &#8220;Documentos de texto&#8221; para <strong>&#8220;Todos os arquivos&#8221;<\/strong> antes de salvar. Sem isso, o Windows acrescenta <code>.txt<\/code> ao nome \u2014 o arquivo vira <code>index.html.txt<\/code> e o navegador n\u00e3o o reconhece como p\u00e1gina.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Estrutura_Basica_do_HTML\"><\/span>Estrutura B\u00e1sica do HTML<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Vamos come\u00e7ar criando a <a href=\"https:\/\/www.homehost.com.br\/blog\/tutoriais\/html-basico\/\">estrutura b\u00e1sica do HTML<\/a>. Abra seu editor de texto e insira o seguinte c\u00f3digo:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"pt-BR\"&gt;\n&lt;head&gt;\n    &lt;meta charset=\"UTF-8\"&gt;\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n    &lt;title&gt;Minha P\u00e1gina&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n    &lt;!-- Seu conte\u00fado vai aqui --&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n\n<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Esta estrutura inclui elementos essenciais como a tag <code><strong>&lt;html&gt;<\/strong><\/code>, <code><strong>&lt;head&gt;<\/strong><\/code>, <code><strong>&lt;title&gt;<\/strong><\/code>, e <code><strong>&lt;body&gt;<\/strong><\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Adicionando_Conteudo\"><\/span>Adicionando Conte\u00fado<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Agora que temos a estrutura, vamos adicionar alguns elementos de conte\u00fado simples:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- Seu conte\u00fado vai aqui --&gt;\n&lt;h1&gt;Bem-vindo ao Meu Site&lt;\/h1&gt;\n&lt;p&gt;Este \u00e9 um exemplo de par\u00e1grafo.&lt;\/p&gt;\n&lt;ul&gt;\n    &lt;li&gt;Item 1&lt;\/li&gt;\n    &lt;li&gt;Item 2&lt;\/li&gt;\n    &lt;li&gt;Item 3&lt;\/li&gt;\n&lt;\/ul&gt;\n&lt;a href=\"https:\/\/www.exemplo.com\"&gt;Visite Exemplo.com&lt;\/a&gt;\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Estilo_com_CSS_opcional\"><\/span>Estilo com CSS (opcional)<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para adicionar um toque de <a href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/estilos-html\/\">estilo<\/a>, voc\u00ea pode incorporar uma se\u00e7\u00e3o <a href=\"https:\/\/www.homehost.com.br\/blog\/tutoriais\/html-css\/\">CSS<\/a>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- Dentro da tag &lt;head&gt; --&gt;\n&lt;style&gt;\n    body {\n        font-family: 'Arial', sans-serif;\n        background-color: #f4f4f4;\n    }\n    h1 {\n        color: #333;\n    }\n    \/* Adicione mais estilos conforme necess\u00e1rio *\/\n&lt;\/style&gt;\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"O_template_completo_comentado\"><\/span>O template completo, comentado<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">A estrutura acima \u00e9 o m\u00ednimo. Este \u00e9 o <code>index.html<\/code> que vale usar como ponto de partida \u2014 cada linha comentada, tudo que uma p\u00e1gina real precisa:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"pt-BR\"&gt;\n&lt;head&gt;\n    &lt;!-- Codifica\u00e7\u00e3o: garante acentos corretos --&gt;\n    &lt;meta charset=\"UTF-8\"&gt;\n\n    &lt;!-- Responsividade: essencial para celular --&gt;\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n\n    &lt;!-- T\u00edtulo: aparece na aba e no Google --&gt;\n    &lt;title&gt;Minha Empresa \u2014 o que fazemos&lt;\/title&gt;\n\n    &lt;!-- Descri\u00e7\u00e3o: o texto abaixo do t\u00edtulo nos resultados de busca --&gt;\n    &lt;meta name=\"description\" content=\"Descri\u00e7\u00e3o de at\u00e9 155 caracteres sobre a p\u00e1gina.\"&gt;\n\n    &lt;!-- Compartilhamento em redes sociais --&gt;\n    &lt;meta property=\"og:title\" content=\"Minha Empresa\"&gt;\n    &lt;meta property=\"og:description\" content=\"A mesma descri\u00e7\u00e3o, ou uma vers\u00e3o adaptada.\"&gt;\n    &lt;meta property=\"og:image\" content=\"https:\/\/seusite.com.br\/imagem.jpg\"&gt;\n\n    &lt;!-- \u00cdcone da aba --&gt;\n    &lt;link rel=\"icon\" href=\"\/favicon.png\"&gt;\n\n    &lt;!-- Estilos em arquivo separado --&gt;\n    &lt;link rel=\"stylesheet\" href=\"style.css\"&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n    &lt;header&gt;\n        &lt;h1&gt;Minha Empresa&lt;\/h1&gt;\n        &lt;nav&gt;\n            &lt;a href=\"\/\"&gt;In\u00edcio&lt;\/a&gt;\n            &lt;a href=\"\/sobre\"&gt;Sobre&lt;\/a&gt;\n            &lt;a href=\"\/contato\"&gt;Contato&lt;\/a&gt;\n        &lt;\/nav&gt;\n    &lt;\/header&gt;\n\n    &lt;main&gt;\n        &lt;p&gt;O conte\u00fado principal da p\u00e1gina.&lt;\/p&gt;\n    &lt;\/main&gt;\n\n    &lt;footer&gt;\n        &lt;p&gt;&amp;copy; 2026 Minha Empresa&lt;\/p&gt;\n    &lt;\/footer&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">&#x26a0;&#xfe0f; <strong>Tr\u00eas linhas que fazem diferen\u00e7a e quase todo mundo esquece:<\/strong> a <code>meta description<\/code>, que \u00e9 o texto exibido no Google; as tags <code>og:<\/code>, que definem como o link aparece no WhatsApp e nas redes; e o <code>lang=\"pt-BR\"<\/code>, que informa o idioma a leitores de tela e buscadores.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Prefere n\u00e3o montar \u00e0 m\u00e3o? O gerador no in\u00edcio deste artigo cria o arquivo com essas tr\u00eas linhas j\u00e1 preenchidas \u2014 e com a p\u00e1gina inteira pronta para baixar.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Visualizando_no_Navegador\"><\/span>Visualizando no Navegador<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Salve o arquivo como <code><strong>index.html<\/strong><\/code> e abra-o em um navegador. Voc\u00ea ver\u00e1 sua p\u00e1gina com o conte\u00fado e estilo que adicionou.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Adicionando_em_seu_site_atraves_do_Gerenciador_de_Arquivos\"><\/span>Adicionando em seu site atrav\u00e9s do Gerenciador de Arquivos<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Ap\u00f3s criar o index.html, \u00e9 necess\u00e1rio subi-lo em sua hospedagem de site. Aqui na Homehost os planos possuem o painel de <a href=\"https:\/\/www.homehost.com.br\/blog\/perguntas-frequentes\/utilizando-o-gerenciador-de-arquivos\/\" data-type=\"post\" data-id=\"1960\">Gerenciamento de Arquivos<\/a> e voc\u00ea pode realizar o upload por l\u00e1, mas vamos lhe ensinar atrav\u00e9s do <a href=\"https:\/\/www.homehost.com.br\/blog\/cpanel\/o-que-e-cpanel\/\">cPanel<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Como alternativa, o arquivo index.html pode ser enviado tamb\u00e9m atrav\u00e9s de <a href=\"https:\/\/www.homehost.com.br\/blog\/tutoriais\/filezilla-ftp\/\">FTP<\/a>.<\/p>\n\n\n\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/@tabler\/icons-webfont@latest\/tabler-icons.min.css\">\n\n<style>\n  .tip-box {\n    display: flex;\n    gap: 14px;\n    align-items: flex-start;\n    background: #EAF3DE;\n    border: 1px solid #97C459;\n    border-left: 4px solid #3B6D11;\n    border-radius: 12px;\n    padding: 16px 18px;\n    margin: 1rem 0;\n  }\n  .tip-icon {\n    width: 34px; height: 34px;\n    background: #C0DD97;\n    border-radius: 8px;\n    display: flex; align-items: center; justify-content: center;\n    flex-shrink: 0;\n  }\n  .tip-icon i { font-size: 18px; color: #27500A; }\n  .tip-content { display: flex; flex-direction: column; gap: 4px; }\n  .tip-label { font-weight: 500; color: #27500A; }\n  .tip-text { color: #3B6D11; line-height: 1.6; }\n  .tip-text strong { color: #27500A; }\n  .tip-text a { color: #27500A; font-weight: 500; text-underline-offset: 2px; }\n  .tip-text a:hover { color: #173404; }\n<\/style>\n\n<div class=\"tip-box\">\n  <div class=\"tip-icon\">\n    <i class=\"ti ti-bulb\"><\/i>\n  <\/div>\n  <div class=\"tip-content\">\n    <span class=\"tip-label\">Dica<\/span>\n    <span class=\"tip-text\">\n      Alguns planos da HomeHost utilizam o painel <strong>DirectAdmin<\/strong> em vez do cPanel. O processo de upload \u00e9 praticamente o mesmo, mas a interface muda um pouco. Veja como usar o <a href=\"https:\/\/www.homehost.com.br\/blog\/directadmin\/gerenciador-de-arquivos\/\">Gerenciador de Arquivos do DirectAdmin<\/a> para enviar o seu index.html.\n    <\/span>\n  <\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Acesse_gerenciador_de_arquivos_da_sua_hospedagem\"><\/span>Acesse gerenciador de arquivos da sua hospedagem<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Fa\u00e7a login no seu Gerenciador de arquivos de seu <a href=\"https:\/\/www.homehost.com.br\/blog\/registro-de-dominios\/o-que-e-dominio\/\">dom\u00ednio<\/a>. Normalmente, voc\u00ea encontra isso pelo Painel de Controle, ou atrav\u00e9s de seu dom\u00ednio seguido por <strong>\/cpanel<\/strong>, como, por exemplo, <strong>http:\/\/seusite.com\/cpanel<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.43.32-1024x694.png\" alt=\"painel de controle cpanel\" class=\"wp-image-12854\" width=\"1024\" height=\"694\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.43.32-1024x694.png 1024w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.43.32-300x203.png 300w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.43.32-768x520.png 768w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.43.32.png 1131w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Navegue_ate_o_Gerenciador_de_Arquivos\"><\/span>Navegue at\u00e9 o Gerenciador de Arquivos:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Em outros sistemas, voc\u00ea precisa encontrar o <strong>WebUpload, &#8220;gerenciamento de html&#8221; ou &#8220;gerenciador de arquivos&#8221;<\/strong>. No cPanel, procure por &#8220;Gerenciador de Arquivos&#8221; &#8220;Gerenciador de Ficheiros&#8221;,  ou &#8220;File Manager&#8221; e clique nele.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Encontre_a_pasta_public_html\"><\/span>Encontre a pasta public_html:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">No &#8220;Gerenciador de Arquivos&#8221;, localize a pasta <strong>&#8220;public_html&#8221;<\/strong>. \u00c9 aqui que voc\u00ea armazena os arquivos do seu site. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.44.40.png\" alt=\"pasta public_html\" class=\"wp-image-12855\" width=\"329\" height=\"754\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.44.40.png 329w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.44.40-131x300.png 131w\" sizes=\"(max-width: 329px) 100vw, 329px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Acessando_a_area_de_Upload_do_Arquivo_HTML_indexhtml\"><\/span>Acessando a \u00e1rea de Upload do Arquivo HTML (index.html):<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Com a pasta <strong>&#8220;public_html&#8221;<\/strong> aberta, clique em <strong>&#8220;Carregar&#8221;, &#8220;Upload&#8221; ou &#8220;Enviar&#8221;<\/strong>, localizado na parte superior. Ao clicar, voc\u00ea ir\u00e1 acessar uma nova p\u00e1gina.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.47.51.png\" alt=\"upload do arquivo index.html\" class=\"wp-image-12856\" width=\"855\" height=\"259\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.47.51.png 855w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.47.51-300x91.png 300w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.47.51-768x233.png 768w\" sizes=\"(max-width: 855px) 100vw, 855px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Fa\u00e7a o Upload<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Clicando em carregar, voc\u00ea  ir\u00e1 verificar um campo com sele\u00e7\u00e3o do arquivo.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.49.01-1024x471.png\" alt=\"enviar o arquivo index.html\" class=\"wp-image-12857\" width=\"1024\" height=\"471\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.49.01-1024x471.png 1024w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.49.01-300x138.png 300w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.49.01-768x353.png 768w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.49.01.png 1340w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Ap\u00f3s o upload, o arquivo <strong>&#8220;index.html&#8221;<\/strong> estar\u00e1 listado na pasta <strong>public_html.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.52.50.png\" alt=\"upload concluido\" class=\"wp-image-12858\" width=\"928\" height=\"538\" srcset=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.52.50.png 928w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.52.50-300x174.png 300w, https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2024\/01\/Captura-de-Tela-2024-01-02-as-18.52.50-768x445.png 768w\" sizes=\"(max-width: 928px) 100vw, 928px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Visualize_seu_Site\"><\/span>Visualize seu Site<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Acesse o seu site digitando o endere\u00e7o do seu dom\u00ednio no navegador. O arquivo <strong>&#8220;index.html&#8221;<\/strong> ser\u00e1 carregado como a p\u00e1gina inicial.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Obs: Caso seu site tenha um outro arquivo nesta mesma pasta com nome de index.html ou index.php, renomeie o arquivo antes de enviar o criado com este tutorial.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Pronto! Voc\u00ea adicionou com sucesso um arquivo HTML chamado<strong> &#8220;index.html&#8221; <\/strong>\u00e0 sua pasta <strong>public_html <\/strong>usando o gerenciador de arquivos web no cPanel. Este arquivo ser\u00e1 a p\u00e1gina inicial padr\u00e3o do seu site. Lembre-se de que o procedimento pode variar um pouco dependendo do seu provedor de hospedagem espec\u00edfico.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Se o seu site usa <a href=\"https:\/\/www.homehost.com.br\/blog\/tutoriais\/php\/o-que-e-php\/\">PHP<\/a> (como o WordPress), o arquivo equivalente \u00e9 o <a href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/index-php\/\">index.php<\/a> \u2014 veja as diferen\u00e7as.<\/p>\n\n\n\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/@tabler\/icons-webfont@latest\/tabler-icons.min.css\">\n\n<style>\n  .cta-box {\n    margin: 1.5rem 0;\n    background: linear-gradient(135deg, #0C447C 0%, #185FA5 100%);\n    border-radius: 16px;\n    padding: 28px;\n    display: flex;\n    align-items: center;\n    gap: 22px;\n    flex-wrap: wrap;\n  }\n  .cta-icon {\n    width: 56px; height: 56px;\n    background: rgba(255,255,255,0.14);\n    border-radius: 12px;\n    display: flex; align-items: center; justify-content: center;\n    flex-shrink: 0;\n  }\n  .cta-icon i { font-size: 28px; color: #fff; }\n  .cta-content { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 6px; }\n  .cta-title { font-weight: 600; color: #fff; line-height: 1.3; font-size: 1.15rem; }\n  .cta-text { color: #C5DDF4; line-height: 1.55; }\n  .cta-perks { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }\n  .cta-perk {\n    display: inline-flex; align-items: center; gap: 5px;\n    background: rgba(255,255,255,0.12);\n    color: #E6F1FB;\n    border-radius: 99px;\n    padding: 3px 10px;\n    font-size: .85rem;\n  }\n  .cta-perk i { font-size: 13px; }\n  .cta-btn {\n    display: inline-flex; align-items: center; gap: 8px;\n    background: #fff;\n    color: #0C447C !important;\n    border-radius: 8px;\n    padding: 13px 22px;\n    font-weight: 600;\n    text-decoration: none !important;\n    white-space: nowrap;\n    flex-shrink: 0;\n  }\n  .cta-btn:hover { background: #E6F1FB; }\n  .cta-btn i { font-size: 17px; }\n<\/style>\n\n<div class=\"cta-box\">\n  <div class=\"cta-icon\"><i class=\"ti ti-world-upload\"><\/i><\/div>\n  <div class=\"cta-content\">\n    <span class=\"cta-title\">Pronto para colocar seu site no ar?<\/span>\n    <span class=\"cta-text\">J\u00e1 tem seu index.html criado? O pr\u00f3ximo passo \u00e9 public\u00e1-lo. Com a hospedagem da HomeHost, voc\u00ea sobe seus arquivos em minutos pelo Gerenciador de Arquivos e seu site fica acess\u00edvel para o mundo.<\/span>\n    <div class=\"cta-perks\">\n      <span class=\"cta-perk\"><i class=\"ti ti-files\"><\/i> Gerenciador de arquivos<\/span>\n      <span class=\"cta-perk\"><i class=\"ti ti-lock\"><\/i> SSL gr\u00e1tis<\/span>\n      <span class=\"cta-perk\"><i class=\"ti ti-headset\"><\/i> Suporte humano<\/span>\n    <\/div>\n  <\/div>\n  <a class=\"cta-btn\" href=\"https:\/\/www.homehost.com.br\/hospedagem-de-sites\/\" target=\"_blank\">\n    <i class=\"ti ti-arrow-right\"><\/i> Ver planos de hospedagem\n  <\/a>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Dicas_para_o_seu_indexhtml\"><\/span>Dicas para o seu index.html<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Mantenha o nome exato:<\/strong> o arquivo precisa se chamar <code>index.html<\/code>, tudo em min\u00fasculas. Nomes como <code>Index.html<\/code> ou <code>index.htm<\/code> podem n\u00e3o ser reconhecidos como p\u00e1gina inicial pelo servidor.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Use <code>lang=\"pt-BR\"<\/code><\/strong> na tag <code>&lt;html&gt;<\/code> para p\u00e1ginas em portugu\u00eas. Isso ajuda navegadores, leitores de tela e os mecanismos de busca a entenderem o idioma do seu conte\u00fado.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Valide seu c\u00f3digo<\/strong> no <a href=\"https:\/\/validator.w3.org\/\">validador oficial do W3C<\/a>. Ele aponta erros de HTML que podem passar despercebidos e quebrar a exibi\u00e7\u00e3o da p\u00e1gina em alguns navegadores. <strong>Os arquivos criados pelo gerador deste artigo j\u00e1 passam nele sem erros.<\/strong><\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Mantenha o <code>&lt;meta charset=\"UTF-8\"&gt;<\/code><\/strong> no cabe\u00e7alho. \u00c9 ele que garante a exibi\u00e7\u00e3o correta de <a href=\"https:\/\/www.homehost.com.br\/blog\/tutoriais\/caracteres-especiais-acentos-html\/\">acentos e caracteres especiais<\/a> do portugu\u00eas, evitando aqueles s\u00edmbolos estranhos no lugar de &#8220;\u00e7&#8221; e &#8220;\u00e3&#8221;.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Separe o CSS quando o site crescer:<\/strong> para uma p\u00e1gina simples, o estilo dentro do <code>&lt;head&gt;<\/code> funciona bem. Mas conforme o site aumenta, o ideal \u00e9 mover o CSS para um arquivo separado (como <code>style.css<\/code>), deixando o c\u00f3digo mais organizado.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Fa\u00e7a backup antes de substituir:<\/strong> se j\u00e1 existe um arquivo <code>index.html<\/code> ou <code>index.php<\/code> na pasta <code>public_html<\/code>, baixe uma c\u00f3pia antes de enviar o novo, para n\u00e3o perder o conte\u00fado anterior.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Perguntas_frequentes\"><\/span>Perguntas frequentes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Para que serve o arquivo index.html?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c9 o arquivo que o servidor exibe automaticamente como <strong>p\u00e1gina inicial<\/strong> do site. Quando algu\u00e9m digita o endere\u00e7o do seu dom\u00ednio, \u00e9 o conte\u00fado do <code>index.html<\/code> que aparece, sem precisar informar o nome do arquivo na URL.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Onde devo salvar o arquivo index.html?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Na pasta <code>public_html<\/code>, que \u00e9 a raiz p\u00fablica do seu site na hospedagem. <strong>Arquivos colocados fora dela n\u00e3o aparecem<\/strong> \u2014 \u00e9 a causa mais comum de &#8220;subi o arquivo e nada mudou&#8221;.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Por que meu index.html n\u00e3o abre como p\u00e1gina inicial?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Tr\u00eas causas, nesta ordem: o nome do arquivo est\u00e1 diferente de <code>index.html<\/code>, existe um <code>index.php<\/code> na mesma pasta com prioridade, ou o arquivo n\u00e3o est\u00e1 dentro da <code>public_html<\/code>. <strong>Confira as tr\u00eas antes de mexer em qualquer configura\u00e7\u00e3o.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Qual a diferen\u00e7a entre index.html e index.php?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">O <code>index.html<\/code> exibe conte\u00fado est\u00e1tico, sempre igual. O <code>index.php<\/code> gera conte\u00fado din\u00e2mico, processado pelo servidor a cada acesso. <strong>Se os dois existirem na mesma pasta, o servidor geralmente prioriza o <code>index.php<\/code><\/strong> \u2014 e o HTML \u00e9 ignorado.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>O nome do arquivo pode ter mai\u00fascula?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">N\u00e3o conv\u00e9m. Em servidores Linux \u2014 a maioria das hospedagens \u2014, <code>Index.html<\/code> e <code>index.html<\/code> s\u00e3o arquivos diferentes, e s\u00f3 o segundo \u00e9 reconhecido como p\u00e1gina inicial. <strong>Use sempre min\u00fasculas.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Posso usar <code>.htm<\/code> em vez de <code>.html<\/code>?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Funciona na maioria dos servidores, mas n\u00e3o \u00e9 o padr\u00e3o. <strong>A extens\u00e3o <code>.htm<\/code> \u00e9 heran\u00e7a de sistemas antigos<\/strong> que limitavam nomes a tr\u00eas caracteres, e alguns servidores n\u00e3o a incluem na lista de arquivos de \u00edndice. Prefira <code>.html<\/code>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Preciso saber programar para criar um index.html?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">N\u00e3o. HTML n\u00e3o \u00e9 linguagem de programa\u00e7\u00e3o \u2014 \u00e9 <strong>linguagem de marca\u00e7\u00e3o<\/strong>, que descreve conte\u00fado sem executar l\u00f3gica. Para uma p\u00e1gina simples, basta um editor de texto e a estrutura b\u00e1sica mostrada neste guia.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Como fa\u00e7o o upload do index.html para o meu site?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Pelo Gerenciador de Arquivos do painel de controle \u2014 cPanel ou DirectAdmin \u2014, enviando o arquivo para a pasta <code>public_html<\/code>. A alternativa \u00e9 um programa de FTP, como o FileZilla, que \u00e9 mais pr\u00e1tico quando voc\u00ea envia muitos arquivos de uma vez.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Preciso de um servidor para testar meu index.html?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">N\u00e3o para testar. <strong>Basta abrir o arquivo com dois cliques<\/strong> e ele carrega no navegador, direto do seu computador. O servidor s\u00f3 \u00e9 necess\u00e1rio quando voc\u00ea quiser que outras pessoas acessem a p\u00e1gina pela internet.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Meu site j\u00e1 tem um index.html. Posso substituir?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Pode, mas <strong>baixe uma c\u00f3pia do atual antes<\/strong>. Enviar um arquivo com o mesmo nome sobrescreve o anterior sem aviso, e o conte\u00fado antigo se perde \u2014 a menos que exista backup da hospedagem.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Por que os acentos aparecem como s\u00edmbolos estranhos?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Falta a linha <code>&lt;meta charset=\"UTF-8\"&gt;<\/code> no <code>&lt;head&gt;<\/code>, ou o arquivo foi salvo em outra codifica\u00e7\u00e3o. <strong>Verifique as duas coisas:<\/strong> a tag no cabe\u00e7alho, e a codifica\u00e7\u00e3o do arquivo no editor de texto, que deve ser UTF-8.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Posso criar o index.html pelo celular?<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">D\u00e1 para escrever num aplicativo de notas e enviar pelo Gerenciador de Arquivos do painel, acessando pelo navegador. <strong>Mas n\u00e3o \u00e9 confort\u00e1vel<\/strong> \u2014 alguns aplicativos de notas salvam em formatos que n\u00e3o s\u00e3o texto puro, e o arquivo pode n\u00e3o funcionar. Para um arquivo s\u00f3, funciona; para mais que isso, use o computador.<\/p>\n\n\n\n<script type=\"application\/ld+json\">\n{\n\"@context\": \"https:\/\/schema.org\",\n\"@type\": \"FAQPage\",\n\"mainEntity\": [\n{\"@type\":\"Question\",\"name\":\"Para que serve o arquivo index.html?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"\u00c9 o arquivo que o servidor exibe automaticamente como p\u00e1gina inicial do site. Quando algu\u00e9m digita o endere\u00e7o do seu dom\u00ednio, \u00e9 o conte\u00fado do index.html que aparece, sem precisar informar o nome do arquivo na URL.\"}},\n{\"@type\":\"Question\",\"name\":\"Onde devo salvar o arquivo index.html?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Na pasta public_html, que \u00e9 a raiz p\u00fablica do seu site na hospedagem. Arquivos colocados fora dela n\u00e3o aparecem, e essa \u00e9 a causa mais comum de subir o arquivo e nada mudar.\"}},\n{\"@type\":\"Question\",\"name\":\"Por que meu index.html n\u00e3o abre como p\u00e1gina inicial?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Tr\u00eas causas, nesta ordem: o nome do arquivo est\u00e1 diferente de index.html, existe um index.php na mesma pasta com prioridade, ou o arquivo n\u00e3o est\u00e1 dentro da public_html. Confira as tr\u00eas antes de mexer em qualquer configura\u00e7\u00e3o.\"}},\n{\"@type\":\"Question\",\"name\":\"Qual a diferen\u00e7a entre index.html e index.php?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"O index.html exibe conte\u00fado est\u00e1tico, sempre igual. O index.php gera conte\u00fado din\u00e2mico, processado pelo servidor a cada acesso. Se os dois existirem na mesma pasta, o servidor geralmente prioriza o index.php, e o HTML \u00e9 ignorado.\"}},\n{\"@type\":\"Question\",\"name\":\"O nome do arquivo index.html pode ter mai\u00fascula?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"N\u00e3o conv\u00e9m. Em servidores Linux, que s\u00e3o a maioria das hospedagens, Index.html e index.html s\u00e3o arquivos diferentes, e s\u00f3 o segundo \u00e9 reconhecido como p\u00e1gina inicial. Use sempre min\u00fasculas.\"}},\n{\"@type\":\"Question\",\"name\":\"Posso usar .htm em vez de .html?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Funciona na maioria dos servidores, mas n\u00e3o \u00e9 o padr\u00e3o. A extens\u00e3o .htm \u00e9 heran\u00e7a de sistemas antigos que limitavam nomes a tr\u00eas caracteres, e alguns servidores n\u00e3o a incluem na lista de arquivos de \u00edndice. Prefira .html.\"}},\n{\"@type\":\"Question\",\"name\":\"Preciso saber programar para criar um index.html?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"N\u00e3o. HTML n\u00e3o \u00e9 linguagem de programa\u00e7\u00e3o, e sim linguagem de marca\u00e7\u00e3o, que descreve conte\u00fado sem executar l\u00f3gica. Para uma p\u00e1gina simples, basta um editor de texto e a estrutura b\u00e1sica mostrada neste guia.\"}},\n{\"@type\":\"Question\",\"name\":\"Como fa\u00e7o o upload do index.html para o meu site?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Pelo Gerenciador de Arquivos do painel de controle, seja cPanel ou DirectAdmin, enviando o arquivo para a pasta public_html. A alternativa \u00e9 um programa de FTP, como o FileZilla, que \u00e9 mais pr\u00e1tico quando voc\u00ea envia muitos arquivos de uma vez.\"}},\n{\"@type\":\"Question\",\"name\":\"Preciso de um servidor para testar meu index.html?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"N\u00e3o para testar. Basta abrir o arquivo com dois cliques e ele carrega no navegador, direto do seu computador. O servidor s\u00f3 \u00e9 necess\u00e1rio quando voc\u00ea quiser que outras pessoas acessem a p\u00e1gina pela internet.\"}},\n{\"@type\":\"Question\",\"name\":\"Meu site j\u00e1 tem um index.html. Posso substituir?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Pode, mas baixe uma c\u00f3pia do atual antes. Enviar um arquivo com o mesmo nome sobrescreve o anterior sem aviso, e o conte\u00fado antigo se perde, a menos que exista backup da hospedagem.\"}},\n{\"@type\":\"Question\",\"name\":\"Por que os acentos aparecem como s\u00edmbolos estranhos?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Falta a linha meta charset UTF-8 no cabe\u00e7alho, ou o arquivo foi salvo em outra codifica\u00e7\u00e3o. Verifique as duas coisas: a tag no cabe\u00e7alho, e a codifica\u00e7\u00e3o do arquivo no editor de texto, que deve ser UTF-8.\"}},\n{\"@type\":\"Question\",\"name\":\"Posso criar o index.html pelo celular?\",\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"D\u00e1 para escrever num aplicativo de notas e enviar pelo Gerenciador de Arquivos do painel, acessando pelo navegador. Mas n\u00e3o \u00e9 confort\u00e1vel, porque alguns aplicativos de notas salvam em formatos que n\u00e3o s\u00e3o texto puro e o arquivo pode n\u00e3o funcionar.\"}}\n]\n}\n<\/script>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Conclusao\"><\/span>Conclus\u00e3o<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Criar um <code>index.html<\/code> \u00e9 a coisa mais simples que se pode fazer na web \u2014 um arquivo de texto, um nome espec\u00edfico, e uma pasta certa. E \u00e9 tamb\u00e9m o momento em que um site deixa de ser uma ideia e passa a existir num endere\u00e7o.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Tr\u00eas coisas decidem se ele funciona.<\/strong> O <strong>nome exato<\/strong>, tudo em min\u00fasculas \u2014 <code>Index.html<\/code> ou <code>index.htm<\/code> podem n\u00e3o ser reconhecidos. A pasta <strong><code>public_html<\/code><\/strong>, que \u00e9 onde o servidor procura. E a aus\u00eancia de um <code>index.php<\/code> na mesma pasta, que teria prioridade sobre ele.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Se a p\u00e1gina n\u00e3o abrir depois do upload<\/strong>, \u00e9 quase sempre uma dessas tr\u00eas. E se abrir, voc\u00ea acabou de publicar um site \u2014 que \u00e9 um passo pequeno com uma diferen\u00e7a grande.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>O arquivo index.html \u00e9 a p\u00e1gina inicial do seu site \u2014 \u00e9 ele que aparece quando algu\u00e9m digita o endere\u00e7o do seu dom\u00ednio no navegador. Por isso, criar esse arquivo costuma ser o primeiro passo de qualquer site feito do zero. Neste guia, voc\u00ea vai aprender o passo a passo para criar um arquivo index.html, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":12752,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_helpful_status":1,"_lmt_disableupdate":"","_lmt_disable":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3],"tags":[],"class_list":["post-12684","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-criar-sites"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Como criar o arquivo index.html: gerador, template e passo a passo | Homehost<\/title>\n<meta name=\"description\" content=\"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Como criar o arquivo index.html: gerador, template e passo a passo | Homehost\" \/>\n<meta property=\"og:description\" content=\"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/\" \/>\n<meta property=\"og:site_name\" content=\"Homehost\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Homehost\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-03T18:53:28+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-06T21:28:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Gustavo Gallas\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Homehost\" \/>\n<meta name=\"twitter:site\" content=\"@Homehost\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Gustavo Gallas\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/\"},\"author\":{\"name\":\"Gustavo Gallas\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#\\\/schema\\\/person\\\/df8002f43fc55e7f4e132abb2a6ddbc4\"},\"headline\":\"Como criar o arquivo index.html: gerador, template e passo a passo\",\"datePublished\":\"2024-01-03T18:53:28+00:00\",\"dateModified\":\"2026-10-06T21:28:59+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/\"},\"wordCount\":2097,\"publisher\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png\",\"articleSection\":[\"Criar sites\"],\"inLanguage\":\"pt-BR\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/\",\"url\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/\",\"name\":\"Como criar o arquivo index.html: gerador, template e passo a passo | Homehost\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png\",\"datePublished\":\"2024-01-03T18:53:28+00:00\",\"dateModified\":\"2026-10-06T21:28:59+00:00\",\"description\":\"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png\",\"contentUrl\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/12\\\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png\",\"width\":1200,\"height\":630},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/criar-sites\\\/criar-arquivo-index-html\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Como criar o arquivo index.html: gerador, template e passo a passo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/\",\"name\":\"Homehost\",\"description\":\"Hospedagem De Sites\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#organization\",\"name\":\"Homehost\",\"url\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/10\\\/logo-detalhes.png\",\"contentUrl\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/10\\\/logo-detalhes.png\",\"width\":150,\"height\":48,\"caption\":\"Homehost\"},\"image\":{\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/Homehost\\\/\",\"https:\\\/\\\/x.com\\\/Homehost\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.homehost.com.br\\\/blog\\\/#\\\/schema\\\/person\\\/df8002f43fc55e7f4e132abb2a6ddbc4\",\"name\":\"Gustavo Gallas\",\"description\":\"Analista de sistemas, formado pela PUC-Rio. Programador, gestor de redes e diretor da empresa Homehost. Pai do B\u00f3ris, seu pet de estima\u00e7\u00e3o. Gosta de rock'n'roll, cerveja artesanal e de escrever sobre assuntos t\u00e9cnicos. Contato: gustavo.blog@homehost.com.br\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Como criar o arquivo index.html: gerador, template e passo a passo | Homehost","description":"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.","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:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/","og_locale":"pt_BR","og_type":"article","og_title":"Como criar o arquivo index.html: gerador, template e passo a passo | Homehost","og_description":"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.","og_url":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/","og_site_name":"Homehost","article_publisher":"https:\/\/www.facebook.com\/Homehost\/","article_published_time":"2024-01-03T18:53:28+00:00","article_modified_time":"2026-10-06T21:28:59+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","type":"image\/png"}],"author":"Gustavo Gallas","twitter_card":"summary_large_image","twitter_creator":"@Homehost","twitter_site":"@Homehost","twitter_misc":{"Escrito por":"Gustavo Gallas","Est. tempo de leitura":"12 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#article","isPartOf":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/"},"author":{"name":"Gustavo Gallas","@id":"https:\/\/www.homehost.com.br\/blog\/#\/schema\/person\/df8002f43fc55e7f4e132abb2a6ddbc4"},"headline":"Como criar o arquivo index.html: gerador, template e passo a passo","datePublished":"2024-01-03T18:53:28+00:00","dateModified":"2026-10-06T21:28:59+00:00","mainEntityOfPage":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/"},"wordCount":2097,"publisher":{"@id":"https:\/\/www.homehost.com.br\/blog\/#organization"},"image":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#primaryimage"},"thumbnailUrl":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","articleSection":["Criar sites"],"inLanguage":"pt-BR"},{"@type":"WebPage","@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/","url":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/","name":"Como criar o arquivo index.html: gerador, template e passo a passo | Homehost","isPartOf":{"@id":"https:\/\/www.homehost.com.br\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#primaryimage"},"image":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#primaryimage"},"thumbnailUrl":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","datePublished":"2024-01-03T18:53:28+00:00","dateModified":"2026-10-06T21:28:59+00:00","description":"Crie seu index.html em minutos: gerador com template pronto, metatags certas e layout para celular \u2014 e o passo a passo para enviar \u00e0 hospedagem.","breadcrumb":{"@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#primaryimage","url":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","contentUrl":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","width":1200,"height":630},{"@type":"BreadcrumbList","@id":"https:\/\/www.homehost.com.br\/blog\/criar-sites\/criar-arquivo-index-html\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/www.homehost.com.br\/blog\/"},{"@type":"ListItem","position":2,"name":"Como criar o arquivo index.html: gerador, template e passo a passo"}]},{"@type":"WebSite","@id":"https:\/\/www.homehost.com.br\/blog\/#website","url":"https:\/\/www.homehost.com.br\/blog\/","name":"Homehost","description":"Hospedagem De Sites","publisher":{"@id":"https:\/\/www.homehost.com.br\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.homehost.com.br\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/www.homehost.com.br\/blog\/#organization","name":"Homehost","url":"https:\/\/www.homehost.com.br\/blog\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.homehost.com.br\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2022\/10\/logo-detalhes.png","contentUrl":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2022\/10\/logo-detalhes.png","width":150,"height":48,"caption":"Homehost"},"image":{"@id":"https:\/\/www.homehost.com.br\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Homehost\/","https:\/\/x.com\/Homehost"]},{"@type":"Person","@id":"https:\/\/www.homehost.com.br\/blog\/#\/schema\/person\/df8002f43fc55e7f4e132abb2a6ddbc4","name":"Gustavo Gallas","description":"Analista de sistemas, formado pela PUC-Rio. Programador, gestor de redes e diretor da empresa Homehost. Pai do B\u00f3ris, seu pet de estima\u00e7\u00e3o. Gosta de rock'n'roll, cerveja artesanal e de escrever sobre assuntos t\u00e9cnicos. Contato: gustavo.blog@homehost.com.br"}]}},"modified_by":"ad_hmhst","jetpack_featured_media_url":"https:\/\/www.homehost.com.br\/blog\/wp-content\/uploads\/2023\/12\/Guia-Passo-a-Passo-para-Criar-um-Arquivo-index.html.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/posts\/12684","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/comments?post=12684"}],"version-history":[{"count":29,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/posts\/12684\/revisions"}],"predecessor-version":[{"id":18433,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/posts\/12684\/revisions\/18433"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/media\/12752"}],"wp:attachment":[{"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/media?parent=12684"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/categories?post=12684"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.homehost.com.br\/blog\/wp-json\/wp\/v2\/tags?post=12684"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}