Scribd Logo
Fazer o upload

Bem-vindo(a) ao Scribd!

  • Ficha HTML

    Enviado por

    Teresa Oliveira
    25 visualizações3 páginas
    Este documento descreve um exercício de estruturação de um documento HTML com diferentes seções e elementos, como cabeçalhos, parágrafos, listas e tabelas. Instruções passo-a-passo são fornecidas para adicionar este conteúdo a um arquivo HTML existente e validar a estrutura resultante usando uma ferramenta online.

    Descrição original:

    Ficha HTML

    Direitos autorais

    © © All Rights Reserved

    Formatos disponíveis

    PDF, TXT ou leia online no Scribd

    Você considera este documento útil?

    Este conteúdo é inapropriado?

    Denunciar este documento
    Este documento descreve um exercício de estruturação de um documento HTML com diferentes seções e elementos, como cabeçalhos, parágrafos, listas e tabelas. Instruções passo-a-passo são fornecidas para adicionar este conteúdo a um arquivo HTML existente e validar a estrutura resultante usando uma ferramenta online.

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    25 visualizações3 páginas

    Ficha HTML

    Enviado por

    Teresa Oliveira
    Este documento descreve um exercício de estruturação de um documento HTML com diferentes seções e elementos, como cabeçalhos, parágrafos, listas e tabelas. Instruções passo-a-passo são fornecidas para adicionar este conteúdo a um arquivo HTML existente e validar a estrutura resultante usando uma ferramenta online.

    Direitos autorais:

    © All Rights Reserved
    Baixe no formato PDF, TXT ou leia online no Scribd
    Sinalizar o conteúdo como inadequado
    de 3

    HTML

     
    Ficha  de  Exercícios.  

    Comunicações  Digitais  e  Internet  


    Ciências  da  Comunicação,  U.Porto  2011/12  

    ESTRUTURAR  DOCUMENTO  EM  LINGUAGEM  HTML  


    O  primeiro  exercício  consiste  na  estruturação  de  um  documento  usando  a   versão   5   da  linguagem  
    HTML.   Para   criar   o   documento   deve   ser   usado   o   Notepad++   do   Windows   ou   outra   ferramenta   de  
    edição  de  texto  sem  formação.  

    A  estrutura  base  do  documento  deve  ser  a  seguinte:  

    DOCTYPE  à   <!DOCTYPE html>


     
     
     
    Início  do  
    elemento  HTML  à   <html>
     
     
    Início  do  
    cabeçalho  à   <head>
     
     
    Título  do  
    documento  à   <title>Título do Documento</title>
     
     
     
    Fim  do  
    cabeçalho  à   </head>
     
     
    Início  do  corpo  
    do  documento  à   <body>
     
     
     
    Fim  do  corpo  
    do  documento  à   </body>
     
    Fim  do  
    elemento  HTML  à   </html>
     

    Qualquer  documento  HTML  começa  obrigatoriamente  com  a  definição  do  tipo  de  documento,  o  
    chamado  DOCTYPE.  Neste  caso,  o  DOCTYPE  indica  que  se  trata  de  um  documento  do  tipo  HTML.  
    O  elemento  html,  designado  como  elemento  raiz,  delimita  o  início  e  o  fim  do  documento  HTML.  
    Todos  os  restantes  elementos  são  encaixados  dentro  do  elemento  html.  

    Os  documentos  HTML  dividem-­‐se  em  duas  partes  principais,  o  cabeçalho  e  o  corpo.  O  cabeçalho  é  
    definido  com  recurso  ao  elemento  head  e  permite  indicar  meta-­‐informação  sobre  o  documento,  
    bem  como  instruções  de  processamento  para  o  navegador  web.  O  corpo  é  definido  com  recurso  
    ao  elemento  body  e  delimita  todo  o  conteúdo  que  é  apresentado  na  janela  principal  do  navegador  
    web.  
    Esta   página   deve   ser   gravada   num   ficheiro   com   o   nome   html-­‐simples.html.   Depois   de   gravada   a  
    página,  usar  um  navegador  web  para  ver  o  resultado.  Reparar  que  o  texto  “Título  do  Documento”,  
    anotado  em  HTML  com  a  marca  title,  surge  na  barra  superior  da  janela  do  navegador.  O  corpo  do  
    documento  está  em  branco  uma  vez  que  não  foi  inserido  qualquer  conteúdo  dentro  do  elemento  
    body.  

    ADICIONAR  CONTEÚDO  AO  DOCUMENTO  HTML  


    Volte   a   editar   o   documento   html-­‐simples.html   e   adicione   os   conteúdos   indicados   em   baixo.  
    Durante  esta  fase  é  importante  verificar  o  resultado  num  navegador  web  após  cada  edição.  Este  
    acompanhamento  facilitará  a  detecção  de  possíveis  erros.  

    a. O  título  da  página  deve  ser  “Comunicações  Digitais  e  Internet,  2011/12”.  

    b. Deve  existir  um  cabeçalho  de  nível  1  (elemento  h1)  com  o  texto  “Comunicações    Digitais  
    e  Internet,  2011/12”.  

    c. Deve  existir  um  cabeçalho  de  nível  2  com  o  texto  “Ciências  da    Comunicação,  U.Porto”.  

    d. Um  novo  cabeçalho  de  nível  3  com  o  texto  “Objectivos”.  

    e. Após  este  cabeçalho,  deve  surgir  um  parágrafo  com  o  texto  “Esta  disciplina  tem  como  
    objectivos  dotar  os  estudantes  de:”,  seguido  de  uma  lista  (elementos  ul  e  li)  com  os  
    seguintes  tópicos:  

    • “Conhecimentos  sobre  os  meios  de  comunicação  digitais  com  particular  


    destaque  para  a  Internet.”  
    (O  destaque  do  texto  é  feito  com  o  elemento  strong).  

    • “Conhecimentos  práticos  sobre  a  análise,  concepção,  arquitetura  e  produção  de  


    sítios  web.”  

    • “Conhecimentos  sobre  a  arquitetura  e  desenho  de  informação,  orientados  


    para  o  desenvolvimento  de  conteúdos  web.”  

    f. Criar  uma  nova  secção  com  o  título  “Avaliação”,  ao  mesmo  nível  da  anterior  secção  
    “Objectivos”.  

    g. Criar  uma  tabela  em  HTML  (elementos  table,  th,  tr  e  td)  com  a  seguinte  informação  sobre  
    a  avaliação:  

      Informática   Design  
    Artigo   —   5%  
    Análise  do  Sítio  Web   10%   5%  
    Projeto  Final   20%   20%  
    Exame   30%   10%  
     

    h. Criar  uma  nova  secção  (h3)  com  o  título  “Ligações  Úteis”.  


    i. Criar  uma  nova  lista  com  3  itens:  “Página  de  CDI  no  SIGARRA”  e  “Prof.  Sérgio  Nunes”,  
    “Prof.  Bruno  Giesteira”.  Cada  item  deve  ter  uma  ligação  para  a  página  web  
    correspondente.  Por  exemplo,  o  item  “Página  de  CDI  no  SIGARRA”  deve  permitir  a  
    ligação  para  a  página  da  disciplina  de  CDI  no  SIGARRA.  A  construção  de  ligações  em  
    HTML  é  feita  com  o  elemento  a.  

    VALIDAR  O  DOCUMENTO  HTML  


    A   linguagem   HTML   tem   uma   sintaxe   e   gramática   definidas   pelo   consórcio   W3C.   Estas   regras  
    podem   ser   usadas   para   validar   um   documento   HTML.   Descubra   o   endereço   da   ferramenta   de  
    validação  fornecida  pelo  W3C  e  valide  o  documento  anterior.  

    Se  forem  encontrados  erros,  corrija-­‐os  de  forma  a  que  no  final  o  documento  seja  válido.  

    .  

    Você também pode gostar