Posted by : Philipe Monteiro in (Cultura)
[HTML] – Códigos básicos
Tagged Under : alterar fundo Html, Códigos HTML, colocar comentário html, comandos html, Como inserir uma imagem html, estrutura site html, posicionar texto html, texto em negrito
Olá rapaziada, HTML é a base de tudo não é mesmo?
Toda linguagem de programação para web, seja ela PHP, ASP, ou aquele site mais simples feito com Java Script, todos eles usam como base o HTML (HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto).
E foi pensando nisso que decidi reunir para vocês uma lista com alguns códigos bem simples porém muito utilizados e indispensáveis na hora da criação de um site, mesmo para aqueles que usam CMS (Content Management System – Sistema de gerenciamento de conteúdo) que é o caso de sites feitos em Joomla, Wordpress e muitos outros, é necessário ter um conhecimento básico desta estrutura, por isso segue a lista de alguns comandos na para utilizar na hora da criação de seu site, com o tempo irei colocar cada vez mais comandos neste mesmo post portanto não deixe de acompanha-lo.
*(Todos meus comentários estarão entre parenteses.)
<HTML>
<HEAD>
<TITLE> Titulo do site (o que aparecerá na barra do navegador) </TITLE>
</HEAD>
<BODY>
Aqui vão todos os códigos HTML e é onde fica todo corpo do seu site.
</BODY>
</HTML>
(Lembrando que dentro das tags <HEAD> e </HEAD> podemos colocar informações para os sites de busca como KeyWords e outras informações como o nome do dono do site.
<img src=”AQUI FICA O ENDEREÇO DA IMAGEM”> (Neste caso colocamos na atributo src o link onde se encontra a imagem, por exemplo : http://www.zoomdigital.org/imagens/banner120×60.png (Este é o link de onde está localizado nosso logo))
<a href=”ENDEREÇO DO SITE QUE DESEJA REDIRECIONAR”></a> (Neste caso podemos colocar o texto que será exibido no link antes do fechamento da tag </a> poderiamos também inserir uma imagem através do “img src” caso desejássemos que o link seja uma imagem qualquer )
<B> Texto </B> – Texto fica em Negrito.
<U> Texto </U> – Texto Sublinhado.
<I> Texto </I> – Texto em Itálico.
(Neste caso iremos utilizar as tags, center, left e right) como no exemplo a seguir:
<CENTER> Texto </CENTER> (Para ficar centralizado)
<LEFT> Texto </LEFT> (Para ajustar a esquerda)
<RIGHT> Texto </RIGHT> (Para ajustar a direita)
(Para alterar a cor do nosso fundo iremos utilizar o seguinte código dentro da tag body como no exemplo a seguir:)
<BODY BGCOLOR=”Nome da cor em ingles ou código dela em linguagem de máquina”>
<!– –>
<!– Para colocar comentários em meu código HTML, ele deverá estar dentro dos seguintes senparadores (<!– O comentário vai aqui –>)sendo assim ele não será exibido na sua página HTML apenas no código –>
Bom rapaziada por enquanto é isto, futuramente irei encorpar mais a nossa lista de códigos, portanto continuem sempre acompanhando este post porque muitas novidades irão aparecer.
Att
Poderá gostar também de
20 de novembro de 2009 -- It was introduced… Google Chrome OS
27 de outubro de 2009 -- UOL Host compra carteira de clientes da Insite
3 de fevereiro de 2010 -- Citrix permite rodar Windows 7 no Ipad
25 de novembro de 2008 -- [Tecnologia-Negra] Celular-revólver é usado pela máfia italiana
Oi Phillipe, acho a idéia de ensinar o básico de html muito legal. Mas não se pode continuar passando adiante essas formas de marcação, o html tem que ser usado apenas para a marcação e não para a formatação dos textos, para isso existe o css. Por exemplo alinhamento, o correto é usar a propriedade text-align do css e não as tags center, right e left.
Não é por mal, mas eu acredito é melhor que as pessoas já aprendam usando os padrões w3c e não as coisas surgidas na guerra dos browsers (vide a tag blink).
Mais uma vez parabéns pelo texto, mas fica aí a minha dica para melhorarmos a qualidade dos desenvolvedores web.
Grande abraço
InFog
Olá InFog. Muito obrigado pelo seu comentário.
Realmente os padrões mudaram, mas como todo bom inicio ao html é legal mostrar estes comandos para que o pessoal tenha uma ideia melhor na introdução do próprio HTML.. Ou seja apenas mostrei os códigos, também concordo que quando voce diz que agente pode acabar se confundindo por misturar 2 estruturas depois realmente pode ficar mais dificil fazer uma introdução ao CSS e tudo mais.. A dica é muito válida e realmente vale a pena frizar… Hoje em dia a tendencia é separar a estrutura do design como o HTML e a parte do design deixando por conta do css..
Vlw A dica Infog..
Lembrando que nosso colunista Juan posta otimos artigos sobre CSS neste link:
http://www.zoomdigital.org/categorias/curso-css/
Att
Olá Philipe.
Realmente o HTML é a base de tudo! Porém em meus códigos por exemplo, eu prefiro usar as marcações “strong” em substituição ao “b” para negrito e “em” ao invés de “i” para itálico. Assim tenho certeza de seguir os padrões e etc, etc, etc… já o velho sublinhado é um ítem que podemos retirar de páginas HTML para não confundir usuários. Isso claro é só um palpite.
Abraços
Alexsandro Felix
Olá Felix..
É verdade.. realmente inclusive os novos CMS já estão utilizando estas marcações em seus editores, o próprio wordpress é exemplo disto, com o tempo irei lançar atualizações neste post (Deve ficar bem grande rs)
E também colocarei estas dicas com os novos padrões.
Obrigado
Att
Muito bom cara, ficou muito interessante!
olá
OLÁ CARO COLEGA, GOSTARIA DE INSERIR NO MEU SITE UM FORMULARIO DE COMENTÁRIO DESSE COMO O SEU, VC PODE ME AJUDAR!!!
Olá Deivson,
este sistema de comentário é feito por causa do sistema onde está o Zoom Digital no caso é o Wordpress, voce pode criar este sistema programando, no caso o site scriptbrasil.com.br disponibiliza diversos scripts prontos creio que o de comentário esteja lá também, basta escolhar a plataforma, php,asp ..
Espero que tenha lhe ajudado
Até
khkh
Show!
nohwcniodcnkln dknk sdl
Peço desculpas amigo…. copiei e estava testando como colocar um comentário no site…. Mais só considere os de nome Madson ok.. Brigaduuuuuuuuu
Sem problemas Madson,
Espero que o tutorial tenha ajudado.
Abraços