Estude fácil! Tem muito documento disponível na Docsity
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Prepare-se para as provas
Estude fácil! Tem muito documento disponível na Docsity
Prepare-se para as provas com trabalhos de outros alunos como você, aqui na Docsity
Encontra documentos específicos para os exames da tua universidade
Prepare-se com as videoaulas e exercícios resolvidos criados a partir da grade da sua Universidade
Responda perguntas de provas passadas e avalie sua preparação.
Ganhe pontos para baixar
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Saiba como criar a estrutura básica de uma página html utilizando tags como <html>, <head>, <title>, <body>, <h1> a <h6>, <p>, <br>, <hr>, <font>, <img> e <table>. Aprenda a centralizar texto, alterar a cor de fundo e de texto, e criar listas e tabelas.
Tipologia: Notas de estudo
1 / 30
Esta página não é visível na pré-visualização
Não perca as partes importantes!
As redes de computadores existem há mais de vinte anos e são utilizadas por milhões de pessoas em todo o mundo. A primeira rede , ARPANET, que na sua origem conectava centros militares e de pesquisas, foi utilizada por alguns cientistas de computação para obter acesso a computadores, compartilhar arquivos e enviar mensagens eletrônicas Hoje em dia ,cientistas, engenheiros professores, estudantes, bibliotecários, médicos, homens de negócios, políticos e até crianças, o utilizam para receber jornais eletrônicos, ter acesso a "Bulletins boards"(BBS – Visto mais adiante) , consultar bases de dados e utilizam, remotamente, vários equipamentos. Atualmente, dentro da comunicação global, a informação disponível na INTERNET ultrapassa os limites físicos, políticos e as estruturas econômicas de todas as partes do planeta, transformandose em um fórum universal que independente de raça ,profissão ou idade, disponibiliza informações das mais variadas para todos que se ligam a rede. A ARPANET "foi aposentada" em 1990 , a CSNET deixou de existir em 1991 e a INTERNET continua crescendo incontrolavelmente. Hoje, ela engloba mais de 5000 redes espalhadas em 145 países espalhados pelos 5 continentes. Estima-se um crescimento de 10%ao mês e um intercâmbio de mais de 15 milhões de mensagens entre a INTERNET e todas as demais redes conectadas. A INTERNET começou a ser utilizada no Brasil, em meados de 89/90, somente por Instituições de pesquisas e um pouco depois por Universidades, permanecendo , assim , até o final de 1995, quando a exploração comercial teve início com a liberação de um BackBone lançado pela EMBRATEL, com um grande incentivo para a sua propagação da mídia, que passou a abordar o assunto, utilizando-se até de novelas. A INTERNET nasceu em 1969 para descentralizar informações militares norte-americanas em várias redes, a fim de se evitar que um ataque soviético estratégico destruísse informações militares armazenadas em grandes computadores. Com isso, surgiu a ARPANET (rede da Advance Research Projects Agency), um projeto experimental do departamento de defesa norte americano que interligava computadores a centros de comando remotos. Algumas redes experimentais se juntavam a ARPANET através de rádios e satélites. No final dos anos 70 surgiu a USENET (Users Network) prestando serviços a comunidades universitárias e algumas organizações comerciais. No início da década de 80, a ARPANET dividiuse em : ARPANET e MILNET (também militar), mantendo a comunicação entre ambas originou o nome de DAR INTERNET e depois se abreviou para INTERNET. Em 1986, foi criada a NSFNET (National Science Foundation Network) para viabilizar a conexão de pesquisadores aos cincos grandes centros dos EUA e abrangendo, rapidamente redes acadêmicas
TCP/IP (Trasmission Control Protocol / INTERNET Protocol) é a família de protocolos da INTERNET, desenvolvida nos anos 70 e utilizada pela primeira vez em 1983.É considerado um protocolo aberto e "sem dono". O que significa dizer que não é produto de empresa nenhuma específica. Cada vez que ocorre uma transferência, o protocolo age quebrando a informação , formando diversos pacotes e roteadores, que estão programados para enviá-los corretamente ao seu destino. As redes de nível captam o tráfego nos "BackBones"(redes de alta velocidade) e o distribuem para suas próprias redes e vice-versa.
WWW é um serviço baseado um hipertextos (documentos que possuem , dentro de si , conexões com outros documentos) que permite buscar e recuperar informações distribuídas por diversos computadores da rede. O hipertexto é uma forma de apresentação gráfica de informação que contém palavras com ligações subjacentes com outros textos , o que torna possível leituras diversas , não - lineares. Você pode selecionar uma das palavras que aparece assinalada e ter acesso a um novo documento , associado com o termo selecionado. O novo documento , por sua vez , é um outro hipertexto com novas palavras assinaladas. Assim , como o gopher, o servidor WWWpode interligar-se com diversos outros servidoresWWW, possibilitando a navegação em informações disponíveis na rede. Torna-se , assim , irrelevante para o usuário a localização física dos documentos recuperados. O documento recuperado não precisa ser necessariamente em texto. Também pode conter outros tipos de informação , tais como imagens , gráficos e sons. Cabe lembrar que através de um servidor WWW, é possível não só o acesso a documentos , mas também o acesso aos demais serviços da rede , como ftp,wais,gopher ,telnet, os quais você verá posteriormente.
É o servidor básico de comunicação em redes de computadores. O processo de troca de mensagens eletrônicas é bastante rápida e fácil ,necessitando apenas de um programa de correio eletrônico e do endereço eletrônico dos envolvidos.
[email protected]ínio EX: joã[email protected] Uma mensagem é composta de cabeçalho e corpo. O cabeçalho informa a data do envio da mensagem, o endereço do emitente , um título sobre o assunto , além de informações de controle. O corpo da mensagem é o seu conteúdo. Embora a grande maioria das mensagens trocadas via rede sejam constituídas por informação puramente textual, também é possível obter outros tipos de informação , tais como sons e imagens. Através do correio eletrônico, também é possível utilizar outros serviços de rede , tais como listas de discussão, USENET News , ftp , archie.
Protocolo de transferência de arquivos é o serviço básico de transferências de arquivos na rede. Com a devida permissão , é possível copiar um arquivo de um computador a distância para o seu computador ou transferir um arquivo do seu computador para um computador remoto , para tanto , você deve ter permissão de acesso ao computador remoto. Ante as restrições para transferência de arquivos foi criado o "FTP Anônimo" para facilitar o acesso de usuários de todo mundo a determinadas máquinas que mantém enormes repositórios de informação. Não é necessário uma permissão de acesso. O usuário irá identificar-se como Anonymous quando o sistema requisitar o "log-in".
Falemos do que interessa mesmo.HTML – abreviação de HiperText Markup Language é a linguagem de programação que usamos para criar uma página Web , que por sua vez será composta de textos e comandos especiais que chamaremos de Tags. Não se assuste com o nome, pois se trata de uma linguagem muito simples , e tem como finalidade básica formatar o texto e imagens exibidos e criar ligações entre páginasWeb , criando assim documentos com o conceito de Hipertexto. Como em qualquer outra linguagem , o programador deve escrever o código - fonte seguindo as regras de sintaxe da linguagem. Este código – fonte é posteriormente interpretado pelo browser , que se encarregará de executar os comandos ou tags do código para formatar e acessar recursos da Web. Em março de 1989, Tim Berners-Lee do European Laboratory for Particle Physics ( mais conhecido como CERN ) , propôs um novo conjunto de protocolos para um sistema de distribuição de
O TAG - que também terá seu tag de fechamento e servirá para delimitar uma área de cabeçalho com poucos TAGS (não é necessário ter esse TAG para sua página funcionar) O TAG - que será usado dentro dos tags <HEAD> , e servirá apenas para colocar um título que aparecerá na barra de título do seu browser ( não esqueça o ). Dentro dos TAGS serão colocados todos os comandos , textos e imagens da sua página. Será o corpo da sua página. Veja um exemplo de estrutura :
Título da página
Aqui você coloca os comandos em HTML , seus Textos e Imagens. Aliás , tanto faz colocar os tags em maiúsculas ou minúsculas.
Vá até a opção Arquivo – Salvar Como do seu Bloco de Notas e salve o exemplo acima como TESTE. HTM. Ao abrir o arquivo no browser , sua primeira página ficou assim : Talvez você tenha de problemas para abrir sua página. Então vou dar uma explicação rápida no Internet Explorer, e no Netscape que são muito parecidos. 1 – Vá até o Menu Arquivo - Abrir… ; 2 – Aparecerá uma caixa para você colocar o endereço da página. Clique no botão Procurar (Browse…) ; 3 – Aparecerá a conhecida caixinha de pastas do Windows. Vá até a pasta onde você gravou sua página e clique em Abrir ( Open ) ; 4 – Você voltará até a caixa para a entrada do endereço , já com o caminho dentro da caixa ; 5 – Aí é só clicar OK.
Agora que aprendemos algumas técnicas , como criar uma página HTML , salvá – la com a extensão. HTM , abrir e vê – la em nosso browser , vamos formatar tudo o que for possível , para dar um ar mais profissional em sua página. Afinal , no exemplo que fizemos até agora , o fundo da nossa página não tem cor , nossas fontes são estáticas o que torna o conjunto da página feio. Vamos ver agora algumas tags que ajudarão a tornar nossas páginas motivo de inveja para qualquer um.
tudo o que escrevemos está alinhado à esquerda da nossa página , enquanto esteticamente , ficaria muito melhor centralizado. Essa é a função do TAG que centraliza um texto , uma imagem ou um elemento da página. Exemplo: Essa frase está centralizada na página
. Ele iniciará um novo parágrafo e pulará uma linha entre o texto. Sua sintaxe é apenas :
Onde : "COR " será a cor do fundo escolhido , que deverá ser escrito em inglês ou em código. Os browsers disponibilizam até 256 cores para serem usadas como cor de fundo, sendo que cada cor é formada por um código RGB ( red / green / blue ). O código é composto por três números nos quais os primeiros dois dígitos representam a intensidade do vermelho ( R ); o segundo , a intensidade do verde ( G ) e o último a intensidade do azul ( B ). Cada cor pode ter um valor que
varia de 0 a 255. Se forem atribuídos os valores mínimos R=000 , G=000 e B=000 , é obtida a cor preta. Se forem atribuídos o valor máximo para cada cor ( 255 ) , é obtida a cor branca. Mas , para facilitar nossa vida , vamos escrever o padrão em inglês , que é muito mais simples. Exemplo : ou O tag BODY BGCOLOR pode ser colocado logo após o tag BODY , ou até mesmo acoplado em um mesmo tag. Veja uma tabelinha de cores e alguns códigos : Código Hexadecimal Black ( Preto ) # White ( Branco ) #FFFFFF Yellow ( Amarelo ) #FFFF Blue ( Azul ) #0000FF Green ( Verde ) #00FF Dark Green ( Verde escuro ) #2F4F2F Red ( Vermelho ) #FF Magenta ( Rosa ) #FF00FF Cyan ( Ciano ) #00FFFF
Incluir uma imagem na sua página é bem simples. Só se exige apenas que você tenha disponível a imagem que será exibida , e que ela esteja em um dos formatos aceitos pelo browser. O formato mais usado e aceito pela WEB é o formato GIF. Esse formato , é uma abreviação de Graphics Interchange Format e pode ser usado em diferentes plataformas de hardware , tais como o PC e o Machintosh. Se comparado com o formato padrão do Windows ( BMP – Bitmaps , também aceito pelos browsers ) , ele gera arquivos de tamanho bem menor. Outro formato bastante usado na WEB ó o JPEG ( Joint Photographic Engineering Group ). Ele consegue reduzir o tamanho de uma imagem em até dez vezes. Mas atenção : não encha sua página de imagens , pois , lembre- se de que , ao usar a rede para transmitir suas páginas e suas imagens , a velocidade de transmissão é muito reduzida , girando em torno de 1 KB por segundo ou , dependendo do tráfego , ela cai ainda mais. Portanto , uma imagem de 100 KB pode levar vários minutos para ser exibida , frustrando a platéia. Tente usar imagens pequenas , com a resolução de 78 pixels por polegada , que é a resolução usada no padrão VGA e SVGA da maioria dos usuários. No caso de fotos , tente usar 256 cores se a qualidade não ficar muito comprometida.
você deverá se mover pela tela através das barras de rolagem , o fundo da sua página acompanhará o movimento da tela , como se estivesse "andando". Isso torna sua página mais lenta para quem está vendo. Para poupar você deste sofrimento existe um complemento para esse tag , chamado BGPROPERTIES. Se você declarar essa propriedade como fixa ( FIXED ) o fundo da sua página ficará estático e apenas o conteúdo da sua página irá se mover. A sintaxe é :
Tente não colocar fundos muito carregados , de tamanho muito grande , pois , quanto maior for o fundo , mais tempo sua página irá demorar para ser carregada.
A principal atração da Internet é a criação de documentos com o conceito de hipertexto , ou seja , um documento que se vincula a outros documentos por meio de ligações especiais chamadas links ou hiperlinks.Com esse conceito , você pode criar documentos que façam referências e permitam ao usuário acessar tais referências não importando se elas estão em outra página Web , no seu micro ou em algum servidor de rede. O uso de hipertexto também facilita a criação de documentos extensos cujas seções ou tópicos podem ser rapidamente acessados por meio dos links. Imagine que você crie uma página sobre
determinado assunto em vários tópicos abordados. Assim como em um livro você cria todo o texto do documento e depois cria , no início , um sumário indicando os tópicos do documento. Se quiser acessar diretamente o texto de um tópico , basta dar um clique sobre o item do tópico no sumário e ele será imediatamente exibido. Um link é reconhecido em uma página por estar em cor normalmente diferente do resto do texto e , ao passar com o mouse sobre esse texto o cursor muda para uma mão apontando para o link.
Uma âncora é um ponto de referência ou endereço que será acessado por um link. Uma âncora é usada dentro do documento para marcar o início de uma seção do documento. Suponha que seu texto seja muito grande , o que tornaria trabalhoso para quem estiver vendo a página conseguir se movimentar entre um tópico e outro. Então faça o seguinte : Nomeie um pedaço da sua página através do tag : Texto ( Lembre –se que "NOME" é fictício, você escolhe o nome…) Depois disso escreva o pedaço que você quer associar a esse Nome. Agora crie um link para chegar até esse pedaço , usando o tag : Clique Aqui Pronto! Ao clicar na mensagem "Clique Aqui" de sua página , o usuário irá até o pedaço que você nomeou. ATENÇÃO : O sinal de cerquilha (#) é necessário para a âncora, pois avisa ao browser para procurar o link no documento atual !!!
diretamente a página INDEX. HTM , ou então dentro de um link de um documento HTML , através do A HREF que cria uma ligação , um link para o URL. MacLinux.net
Listas já foram muito importantes na confecção de páginas HTML, mas hoje poucos sites usam este recurso. A idéia é a de criar uma seqüência de informações de forma ordenada (numeradas uma a uma) ou desordenada (sem numeração). Exemplos : Lista ordenada:
Criando listas
EXEMPLO DE UMA LISTA ORDENADA
Não diga o que fazer, mas sim como fazer Faça tudo com boa vontade Quando quiser ouvir respostas agradáveis, comece você dizendo coisas agradáveis
Se salvarmos este exemplo como LISTA.HTM, podemos visualizá-lo no navegador. Repare que neste exemplo não inserirmos no código da página os números dos itens, pois o comando (Ordened List) insere automaticamente os números da lista , esta é a característica da lista ordenada. Para se montar uma lista desordenada o procedimento é o mesmo porém o comando HTML que inicia uma lista desordenada é (Unordered List).
Criando listas
EXEMPLO DE UMA LISTA DESORDENADA
Acredite em você Pare de reclamar Aja e faça corretamente
Um outro tipo de lista além da ordenada e da desordenada é a de tipo glossário. Uma lista do tipo glossário tem esta aparência: HTML Hyper Text Markup Language, linguagem usada na Internet para a confecção de Home-Pages. SGML Standard Generalized Markup Language, é a partir desta linguagem que se derivou o HTML. É uma linguagem mais rica em comandos e uma pouco mais complexa. VRML Virtual Reality Modeling Language, é a mais avança das linguagens de formatação (Markup) e serve para se criar modelos de realidade virtual para a Internet.
Vamos discutir, nesta parte, quais são os comandos para se criar uma tabela e mostrar alguns exemplos. Claro que você deverá praticar e principalmente planejar a sua tabela, pois sem isso, fica muito difícil de controlar o código HTML da sua home-page. O comando para se inserir uma tabela é ; para iniciar uma linha devemos introduzir a tag e para uma célula (alguns preferem dizer coluna) . Todos estes comandos são encerrados como , e respectivamente. Vejamos um exemplo. Vamos supor que queiramos montar uma tabela 3X2, ou seja de 3 colunas por 2 linhas, o código HTML para isso é :
Criando Tabelas
TABELA
PRIMEIRA COLUNA
SEGUNDA COLUNA TERCEIRA COLUNA
PRIMEIRA COLUNA SEGUNDA COLUNA TERCEIRA COLUNA
Salve este exemplo como TABELA.HTM e abra o arquivo num Browser para ver como ficou. Com isto você já consegue Ter uma idéia de como montar suas tabela. O segredo para se conseguir fazer estas tabelas de forma eficiente é planejar e ter a idéia exata do conteúdo desta tabela. Nas células da tabela você pode inserir desde simples frases até figuras inteiras. Parâmetros podem ser acrescidos às tabelas, tais como : aumentar ou diminuir a largura de uma célula; distanciar as células uma das outras; inserir cor de fundo dentro da célula etc.
Vamos procurar trabalhar com vários exemplos para visualizarmos melhor o uso destes parâmetros.
WIDTH=100 WIDTH=200 (PIXELS)
O parâmetro WIDTH pode receber dois tipos de valores, em pixels como no exemplo acima ou em porcentagem, como mostrado no exemplo a seguir. Também dentro da tag vemos um outro parâmetro que é VALIGN=MIDDLE, este parâmetro tem por função alinhar o conteúdo da célula no meio da mesma, ou seja, dentro da célula as frases são alinhadas com relação ao seu centro. Exemplo2:
WIDTH=25% WIDTH=75%
VERMELHO AZUL VEMELHO
AZUL VEMELHO AZUL
