---
title: Use HTML para resolver problemas comuns
slug: Learn/HTML/Howto
translation_of: Learn/HTML/Howto
original_slug: Aprender/HTML/como-fazer
---
<div>{{LearnSidebar}}</div>

<p class="summary">Os links a seguir apontam para soluções de problemas comuns que você precisará resolver utilizando HTML.</p>

<div class="column-container">
<div class="column-half">
<h3 id="Estrutura_Básica">Estrutura Básica</h3>

<p>A aplicação mais básica de HTML é na estrutura de um documento. Se você está começando no HTML, deve começar por aqui.</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document">Como criar um documento básico HTML</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Divide_a_webpage_into_logical_sections">Como separar uma página web em seções lógicas</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#The_basics_headings_and_paragraphs">Como configurar uma estrutura adequada de cabeçalhos e parágrafos</a></li>
</ul>

<h3 id="Semântica_básica_em_nível_de_texto">Semântica básica em nível de texto</h3>

<p>O HTML se especializou em fornecer informação semântica para um documento, portanto o HTML responde muitas questões que você talvez tenha sobre a melhor maneira de passar sua mensagem em um documento.</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists">Como criar uma lista de itens com HTML</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Como destacar ou enfatizar conteúdo</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Como indicar que um texto é importante</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">Como mostrar código de computador com HTML</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Annotating_images_with_figures_and_figure_captions">Como adicionar anotações em imagens e figuras</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations">Como assinalar abreviaturas e torná-las inteligíveis</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Quotations">Como adicionar citações em páginas web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Define_terms_with_HTML">Como definir termos com HTML</a></li>
</ul>
</div>

<div class="column-half">
<h3 id="Hiperlinks">Hiperlinks</h3>

<p>Uma das principais atribuições do HTML é tornar a navegação mais fácil com {{Glossary("hyperlink", "hiperlinks")}}, que podem ser usados de diferentes formas:</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Como criar um hiperlink</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Como criar um menu de navegação com HTML </a></li>
</ul>

<h3 id="Imagens_multimídia">Imagens &amp; multimídia</h3>

<ul>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#How_do_we_put_an_image_on_a_webpage">Como adicionar imagens em uma página web</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Como adicionar conteúdo de vídeo em uma página web</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Como adicionar conteúdo de áudio em uma página web</a></li>
</ul>

<h3 id="Scripts_estilos">Scripts &amp; estilos</h3>

<p>O HTML só configura a estrutura do documento. Para resolver problemas de apresentação, use o {{glossary("CSS")}} ou use scripts para tornar sua página interativa.</p>

<ul>
 <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Como usar CSS em uma página web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">Como usar JavaScript em uma página web</a></li>
</ul>

<h3 id="Conteúdo_embutido">Conteúdo embutido</h3>

<ul>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">Como embutir uma página web dentro de outra página web</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">Como adicionar conteúdo em Flash dentro de uma página</a></li>
</ul>
</div>
</div>

<h2 id="Problemas_incomuns_ou_avançados">Problemas incomuns ou avançados</h2>

<p>Além do básico, o HTML é muito rico e oferece recursos avançados para resolver problemas complexos. Estes artigos lhe ajudam a lidar com casos de uso menos comuns que você possa encontrar:</p>

<div class="column-container">
<div class="column-half">
<h3 id="Formulários">Formulários</h3>

<p>Formulários são uma estrutura complexa em HTML, criada para enviar dados de uma página web para um servidor web. Nós lhe encorajamos a conhecer nosso <a href="/en-US/docs/Web/Guide/HTML/Forms">guia completo</a>. Eis os tópicos onde você deve começar:</p>

<ul>
 <li><a href="/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form">Como criar um formulário Web simples</a></li>
 <li><a href="/en-US/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form">Como estruturar um formulário Web</a></li>
</ul>

<h3 id="Informação_tabular">Informação tabular</h3>

<p>Algumas informações, chamadas de dados tabulares, precisam ser organizadas em tabelas com colunas e linhas. Esta é uma das estruturas HTML mais complexas, e dominá-la não é fácil:</p>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Create_a_data_spreadsheet">Como criar uma planilha de dados</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Make_HTML_tables_accessible">Como tornar as tabelas HTML acessíveis</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Optimize_HTML_table_rendering">Como otimizar a renderização de tabelas HTML</a></li>
</ul>

<h3 id="Representação_de_dados">Representação de dados</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTMLHowto/Represent_numeric_values_with_HTML">Como representar valores numéricos em HTML</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Como usar atributos de dados</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Associate_human_readable_content_with_arbitrary_computer_data_structures">Como associar conteúdo legível por humanos com estruturas arbitrárias de dados</a></li>
</ul>

<h3 id="Interatividade">Interatividade</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Create_collapsible_content_with_HTML">Como criar conteúdo recolhível em HTML</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Add_context_menus_to_a_webpage">Como adicionar menus contextuais em uma página web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Create_dialog_boxes_with_HTML">Como criar caixas de diálogo em HTML</a></li>
</ul>
</div>

<div class="column-half">
<h3 id="Semântica_avançada_de_texto">Semântica avançada de texto</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Take_control_of_HTML_line_breaking">Como controlar quebras de linha em HTML</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Mark_text_insertion_and_deletion">Como destacar mudanças (texto adicionado ou removido)</a></li>
</ul>

<h3 id="Imagens_multimídia_avançados">Imagens &amp; multimídia avançados</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Como adicionar imagens responsivas em uma página web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web">Como adicionar imagens vetoriais em uma página web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">Como adicionar um mapa de links em uma imagem</a></li>
</ul>

<h3 id="Internacionalização">Internacionalização</h3>

<p>HTML não é unilíngue. A linguagem fornece ferramentas para lidar com problemas comuns de internacionalização.</p>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Add_multiple_languages_into_a_single_webpage">Como adicionar múltiplos idiomas em uma única página web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Handle_Japanese_ruby_characters">Como lidar com caracteres ruby em japonês</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Display_time_and_date_with_HTML">Como mostrar data e hora em HTML</a></li>
</ul>

<h3 id="Performance">Performance</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Author_fast-loading_HTML_pages">Como criar páginas HTML que carregam rápido</a></li>
</ul>
</div>
</div>

<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>