HTML é uma sigla para HyperText Markup Language, ou seja é uma linguagem de marcação para hipertexto.
Hipertexto é texto que não é pleno, ou seja, ele tem dados a mais além do texto. Um exemplo: qual a diferença entre escrever no Bloco de Notas e no Word? No word você pode ajustar um tamanho diferente para cada palavra, ajusta fonte, estilos (negrito, italico, sublinhado). No bloco de notas você possui apenas um texto simples, sem nenhuma estilização. Então o HTML é uma linguagem para escrever textos com estilização.
HTML é uma linguagem feita para compor documentos, exatamente como um relatório que você faz no word, por exemplo. Pense primeiro em um conteúdo que você imprimiria, ou enviaria via fax. Um documento de texto possui, basicamente, títulos e paragrafos. Também é possível inserir imagens em meio ao texto, como em artigos cientificos ou jornais. No principio, os sites e páginas web eram apenas meros documentos de hipertexto, com links apontando de uma página para outra. Essa foi a ideia que originou a expressão "navegar na rede", pois o usuário poderia ir passeiando de um site para outro indefinidamente.
HTML é uma implementação da linguagem XML e possui diversas tags nativas. A exemplo temos <h1> (header - do inglês "cabeçalho") e <p> (parágrafo).
<h1>Eu sou o titulo da página</h1>
<p>Eu sou um parágrafo.</p>
Com o bloco de notas, copie esse codigo e salve como "index.html", abra com o seu navegador favorito e vai ver seu primeiro código HTML em ação.
O CSS é uma linguagem usada para estilizar elementos HTML. A sigla vem de Cascading Style Sheets, ou seja, é uma descrição de estilização em cascata. Cascata quer dizer quer dizer que a estilização de um elemento "derrama" para os elementos que estão dentro dele.
Você pode usar o CSS dentro de uma tag <style> ou criar um arquivo .css e referenciar no seu arquivo .html.
Repetindo o exemplo com CSS
<style>
h1 {
background-color: red;
}
</style>
<h1>Eu sou o titulo da página</h1>
<p>Eu sou um parágrafo.</p>
O javascript foi implementado bem depois do HTML. Um navegador experimentou incluir scripts dentro de sites que auxiliariam a fazer algumas ações, como mudar elementos na tela, mostrar avisos, etc. Isso torna a experiencia do usuário mais interativa e permite que os desenvolvedores de sites implementem uma infinidade de recursos.
Com o sucesso da linguagem, outros navegadores também desenvolveram iniciativas parecidas. Porém, logo foi necessária uma padronização em uma linguagem só. Hoje em dia, todos os navegadores utilizam o Javascript. Embora hajam diferenças discretas na implementação da linguagem, conseguimos programar para web de modo a funcionar em todos navegadores, utilizando as convenções.
O Javascript pode ser usado, assim como o CSS, em duas formas,
sendo importado de um arquivo ou sendo escrito direto no documento HTML com a tag <script>.
Repetindo o exemplo
<style>
h1 {
background-color: red;
}
</style>
<h1>Eu sou o titulo da página</h1>
<p>Eu sou um parágrafo.</p>
<script>
alert("ola mundo!");
</script>