Criar página da web

peter alien

peter alien

Power Member
Boas a todos,

estou a tentar criar um layout de uma webpage utilizando tabelas, onde existe um header, uma barra de separação, um menu horizontal com 5 opções (com botões do tipo rollover), uma zona de conteudos logo abaixo, e um footer.

Queria que quando se clicasse num botão o conteudo da referida zona de conteudo aparecesse, mas sem o resto precisar de fazer um refresh uma vez que as imagens nas outras zonas da página são sempre as mesmas.

Tentei colocar um iframe na referida zona de conteudos, mas ele não cola bem com a zona mais baixa do menu... não sei porquê!?

alguém me pode dar uma dicas de como fazer da melhor maneira possivel esta página, mesmo que não utilize tabelas...



Obrigadão
 
Bem.. O site assim irá ficar uma grande confusão.. O melhor mesmo que poderias fazer era usar <frameset>.. Desenhas primeiro o layout num papel e depois desenhas isso dessa maneira.. Assim evitas os refresh consecutivos onde n queiras!

Se precisares de ajuda apita! ;)

Cumps,
Morphine0225
 
eu consigo criar o layout quer com tabelas quer com divs, mas é do tipo, se clicar num dos botões (com rollovers) é executado o salto para outra página que é exactamente igual à anterior excepto a zona de conteudos que é diferente. O que eu queria mesmo era que só que a zona de conteudos sofresse um "refresh", como tudo o resto, se mantem igual não valeria a pena andar a refrescar por exemplo o header, o footer, os botões, etc...


Morphine0225, diz-me uma coisa, como usei tabelas, coloquei cada elemento que mencionei dentro de celulas dessa tabela, ou seja do tipo:

_________ Header_________
____ Barra de Separação ___
__ Botão 1 | .... | Botão 5 __
____ zona de conteudos ____
_________ Footer __________


será que dentro da celula (<TD> ... </TD>) onde está a zona de conteudo, posso colocar lá o frameset, ou o frameset tem sempre de ser criado fora de qualquer tabela (TABLE)?
 
Última edição:
Eu não sou nenhum expert em fazer websites, mas o pouco que sei já me permite esses refresh que falas.. ;) Tenho a minha header com os botões que quero lá colocar e quando clico num deles a header não mexe. Penso que seja isso que pretendes!

Começo sempre por construir um ficheiro index.htm e o código que utilizo normalmente é este:

Código: 
<html>
<head>
<title>Teu Titulo</title>
<link rel="shortcut icon" href="images/icon.png_ou_a_localização_do_teu_icone_para_ficar_antes_do_link">
</head>

    <frameset border="0" rows="1, *, 5">
        <frame frameborder="0" name="top_empty" src="top_empty.htm">

        <frameset border="0" cols="*, 750, *">
            <frame frameborder="0" name="left_empty" src="left_empty.htm">
            
            <frameset border="0" rows="150, *, 25">
                <frame frameborder="0" noresize name="top" src="top.htm" scrolling="no">
                    
                <frameset border="0" cols="0, *">
                    <frame frameborder="0" noresize name="left" src="left.htm">
                    <frame frameborder="0" noresize name="main" src="main.htm">
                </frameset>
                
                <frame frameborder="0" noresize name="bottom" src="bottom.htm" scrolling="no">
            </frameset>
            
            <frame frameborder="0" name="right_empty" src="right_empty.htm">
        </frameset>
        
        <frame frameborder="0" name="bottom_empty" src="bottom_empty.htm">
    </frameset>

</html>
As medidas vais ter de ser tu a mudar! Adaptas ao teu gosto. ;)

Depois o que faço é construir as várias frames. Como deves ter reparado nesse código, tenho as frames top_empty.htm; left_empty.htm; top.htm; left.htm; main.htm; bottom.htm; right_empty.htm; bottom_empty.htm.


layoutkn0.jpg


As frames que vês seguidas de _empty são as que tão a vermelho. Podes ajustar a medida delas conforme queiras. ;) O left.htm podes meter a medida com "0" e assim ela fica invisivel.

Agora em cada frame o código que apenas faço é o seguinte:

Código: 
<body>

Hoje em dia penso que nem isto seja necessário por os browsers automaticamente reconhecem o código sem ser preciso o <html></html> ou o <body></body>

</body>
No top.htm coloco o seguinte código para cada botão:

Código: 
    <table border="0" class="menudesloc">
        <tr>
            <td height="22" width="83" class="top">
            <a href="main.htm" target="main">Home</a>
            </td>
            
            <td height="22" width="83" class="top">
            <a href="sites.htm" target="main">Sites</a>
            </td>
            
            <td height="22" width="83" class="top">
            <a href="layouts.htm" target="main">Layouts</a>
            </td>
            
            <td height="22" width="83" class="top">
            <a href="galeria.htm" target="main">Galeria</a>
            </td>
            
            <td height="22" width="83" class="top">
            <a href="links.htm" target="main">Links</a>
            </td>
        </tr>        
    </table>
Como podes reparar esse exemplo que tens ai, foram uns botões que fiz agora dentro de uma <table> para veres o "target". Quando clicas em cada botão, vai mudar a frame que havia antes por uma nova, sem tocar nas outras! ;)

Essas frames que coloquei são as principais, depois podes fazer mais frames ao teu gosto. Eu tenho uma links.htm; galeria.htm; sites.htm...

O que tens de fazer é colocar essas mesma frames nos "href" e depois o "target" que queres para cada. ;)

Mais dúvidas que tenhas força!

Cumps,
Morphine0225
 
Última edição:
:P Eu digo que percebo pouco porque nunca usei um programa de edição... Tudo o que fiz até agora de websites foi no nosso belo amigo bloco de notas... Notepad++ é o único que usei até agora!

SadiM obrigado!

Q dicas queres que poste aqui? Podem perguntar a vontade. O q souber tento explicar o máximo! ;)

peter alien que precisas mais que te ajude? ;)

Cumps!
 
Bem :D posso-te dizer que foi um rico comentário que postaste... fiquei perfeitamente esclarecido.

É que até hoje só tinha usado layouts "fixos", onde no caso de se clicar num botão, toda a página sofria um refresh, ou então, usava um iframe (inline frame).

Vou estudar o que postaste... valeu... 5 estrelas! Obrigadão.
 
peter alien disse:
Bem :D posso-te dizer que foi um rico comentário que postaste... fiquei perfeitamente esclarecido.

É que até hoje só tinha usado layouts "fixos", onde no caso de se clicar num botão, toda a página sofria um refresh, ou então, usava um iframe (inline frame).

Vou estudar o que postaste... valeu... 5 estrelas! Obrigadão.
Clicar para expandir...

:D Tou cá para isso! Sempre que poder ajudar ajudo! ;)

Se precisares de mais informação diz que se eu poder ajudo! ;)


Abraço
 
Ola pessoal...tenho que fazer uma pag de net para apresentar num trabalho....mas nao estou mto a vontade com HTML....por acaso nao me podem indicar um programa que seja facil de fazer a programação da pag?»?

aguardo resposta.......abraçu.....
 
jnightz disse:
Um dos mais fáceis que em principio toda a gente deve ter é o FrontPage que custuma vir com o Office.

Quando procuro outros custumo ir a sites deste tipo (http://baixaki.ig.com.br/categorias.asp?cat=125&licenprog=2&order=down) e ordeno a lista pelo nº de downloads, porque em principio o programa mais 'sacado' deve ser o melhor :)
Clicar para expandir...

O frontpage além de não prestar para rigorosamente nada (cria demasiado lixo) penso que já tenha sido substituido por um outro da Microsoft.

Para quem quer aprender HTML, eu aconselho mesmo o uso de um editor de texto corrente..O melhor deve ser o notepad ++.

Cumps,
Morphine0225
 
Morphine0225 disse:
O frontpage além de não prestar para rigorosamente nada (cria demasiado lixo) penso que já tenha sido substituido por um outro da Microsoft.

Para quem quer aprender HTML, eu aconselho mesmo o uso de um editor de texto corrente..O melhor deve ser o notepad ++.

Cumps,
Morphine0225
Clicar para expandir...


He he :lol:

Acho que é o InfoPath, isso sim que é só lixo, aquilo não presta para nada, parece que só serve para relatorios e formularios (pelo menos é o que lá diz, acho eu :)) e depois o codigo é uma 'salganhada' de xml sem interesse nenhum :)


Mas o frontpage sempre dá algum jeito, pelo menos para fazer forms e tabelas para não estar a escrever os <input type... e <tr><td>... tudo á mão, assim é só fazer copy-paste do código e já está.
Já agora ao fazer a mesma coisa no outro aparece muito codigo xml que não serve para nada. TAGS <o:... e <w:... só lixo!

Depois no notepad ou outro editor decente altero algumas coisas e removo o lixo :)
 
Última edição:
Frameset está out, demodé...

O truque é carregares toda a informação e depois usares javascript para mudares os conteúdos

e.g. http://www.panic.com/coda

(a página carrega-se toda, e depois realmente navega-se no conteúdo)

Pelo que percebi queres que mude o conteúdo colocado abaixo do menu... Faz donwload do dreamweaver (versão demo) que tens lá todo o código necessário, que serja com "onmouseover"'s quer seja com as novas classes SPRY - Progamas que são carregados automaticamente, mas que editas em Wisiwyg... isto para simplificar.
 
Inicie sessão ou registe-se para poder participar.
Back
Topo