Parte 3 - HTML. Tópicos abordados neste capítulo Conceitos Básicos O que é uma Página Web? Como se cria uma Página Web?
|
|
- Gonçalo Nunes Gesser
- 8 Há anos
- Visualizações:
Transcrição
1 Parte 3 - HTML Tópicos abordados neste capítulo Conceitos Básicos O que é uma Página Web? Como se cria uma Página Web? Como são os Tags HTML? A estrutura de uma Página HTML Principais Elementos de uma Página HTML Cabeçalhos, Parágrafos e Formatação de Texto Cabeçalhos Parágrafos e quebras de linha Estilos de texto Textos pré-formatados
2 Um exemplo completo Listas Listas não ordenadas Listas ordenadas Listas aninhadas URLs e Links Vinculando seções de uma página Vinculando arquivos locais Vinculando arquivos de outros servidores Imagens Padrões Utilizados Obtendo uma imagem Inserindo imagens no documento Usando imagens como links Tabelas Fundamentos das tabelas
3 Inserindo imagens e vínculos em tabelas Equações e símbolos matemáticos HTML Com o Auxílio de Editores Criando, salvando e abrindo uma página Formatando um parágrafo Inserindo listas e ajustando recuos Inserindo vínculos Inserindo imagens Inserindo tabelas
4 3.1 - Conceitos Básicos Para criar cursos à distância utilizando a Web, é necessário criar documentos que possam ser lidos pelos navegadores. Esses documentos, muitas vezes também chamados de páginas Web, são criados utilizando a linguagem HTML (Hipertext Markup Language). Nosso objetivo neste módulo é estudar esta linguagem, aprendendo, então, como criar documentos para a Web. Nesta seção serão mostrados alguns conceitos básicos da linguagem.
5 O que é uma página Web? Uma página Web é um documento composto basicamente de textos e códigos especiais chamados tags que possibilitam a exibição do documento na World Wide Web. Os navegadores, ou browsers, são os programas que interpretam o código HTML de uma página e a constroem graficamente na tela. Eles estão preparados para trabalhar com documentos que contêm hipertexto. Além da informação textual, as páginas Web podem conter imagens, som, animações e até mesmo vídeo. Estas páginas ainda podem conter links ou ligações para outras páginas armazenadas no mesmo computador ou em qualquer outro local da rede. Uma página Web é também chamada por alguns de home page.
6 Como se cria uma página Web? Uma página Web, como já foi dito, compõe-se de textos e comandos especiais (tags) de uma linguagem chamada HTML (Hipertext Markup Language). Essa linguagem é bastante simples e tem como finalidade básica formatar o texto exibido e criar ligações entre páginas Web, 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. Não é necessário estar conectado à rede para utilizar o browser. Geralmente as páginas são criadas e armazenadas no disco rígido. Elas podem ser testadas com o browser e, depois de prontas, deve-se enviá-las a um servidor para que fiquem disponíveis aos outros usuários da rede. O código-fonte pode ser escrito usando o mais simples dos editores de texto - até mesmo o programa Notepad do Windows pode ser usado para isso. Contudo, a forma mais prática e produtiva para escrever uma página Web é usar um editor HTML. Estes editores encurtam o tempo de geração da página pois geram o código fonte para você. Além disso, o que se vê na tela desses programas é bem parecido com a visualização final que será obtida no browser. Entretanto, o conhecimento básico de como se construir uma página HTML através do código fonte pode trazer grandes vantagens no sentido de complementar o trabalho realizado com os editores. Neste curso serão abordados alguns aspectos da linguagem HTML, a partir dos comandos ou tags, e posteriormente será dada uma introdução sobre a utilização dos editores na construção das páginas.
7 Como são os tags (etiquetas) HTML? Quando um browser exibe uma página Web, ele lê o texto da página e procura símbolos especiais denominados tags, ou etiquetas, que dizem como o texto, ou informação, deve ser exibido. Por exemplo, um tag pode dizer que um texto deve ser exibido em negrito, itálico, com um determinado tipo de fonte, etc. Além do aspecto físico do texto, um tag pode indicar que determinado texto é na verdade o endereço de outras páginas Web que devem ser acessadas no caso de o texto ser clicado. Os tags normalmente são especificados em pares, delimitando um texto que sofrerá algum tipo de formatação. Contudo, existem vários tags individuais. Os tags são identificados por serem envolvidos pelos sinais "<>" ou "</>", onde a barra indica que o tag está finalizando a marcação de um texto. Dessa forma, o formato genérico de um tag é: <nome do tag>texto</nome do tag> Alguns tags podem conter atributos, que são incluídos logo após o nome do tag. <tag atributo1="valor1" atributo2="valor2">...</tag> Veja a seguir alguns comandos e o efeito que eles causam na exibição: <b>este texto está em negrito</b> enquanto esta <i>palavra</i> está em itálico.<br> <h3>este comando gera um cabeçalho título de tamanho 3.</h3> Resultados:
8 Este texto está em negrito enquanto esta palavra está em itálico. Este comando gera um cabeçalho título de tamanho 3. Note que, para quebrar a linha, foi utilizado o tag <br>.
9 Estrutura de uma página HTML Assim como em outras linguagens, existem algumas estruturas básicas que identificam partes de um programa HTML. O esquema abaixo mostra os comandos básicos de uma página. <html> <head> <title>título da Página</Title> </head> <body> ********************************** Área para os comandos da linguagem ********************************** </body> </html> Esses comandos não são obrigatórios nos browsers mais modernos. Dependendo da página que se deseja criar, eles não farão falta. É interessante, entretanto, que eles sejam incluídos em suas páginas de forma a criar uma padronização de código. Em resumo, o comando <HTML> é usado em par com o comando </HTML>. Eles delimitam a área dos comandos HTML. O par de comando <HEAD></HEAD> é usado para especificar poucos comandos, sendo o mais importante deles o título da página. Esse título será mostrado na linha de título da janela do browser. O par de comandos <BODY></BODY> deve ser usado para envolver todos os comandos de formatação da página.
10 Principais elementos de uma página HTML Uma página HTML é composta basicamente por títulos, textos, parágrafos, imagens e links, responsáveis pela chamada de outras páginas para a tela. Todos estes elementos são posicionados na página através de comandos específicos da linguagem. Os editores HTML nos ajudam bastante nessa tarefa, mas, inicialmente, mostraremos como construir os documentos sem o auxílio deles.
11 3.2 - Cabeçalhos, Parágrafos e Formatação de Texto A linguagem HTML nos permite a formatação do texto de uma página, com recursos semelhantes aos dos editores de texto. Uma boa diagramação, com destaque para as partes mais importantes do texto e um bom visual, são importantes na composição de um curso à distância. Nesta seção mostraremos algumas possibilidades da linguagem com relação à formatação de textos.
12 Cabeçalhos (Headings) Os cabeçalhos são as linhas do documento que aparecem com um tamanho de letra diferenciado do restante do texto, com a finalidade de se identificar o início de uma seção ou tópico. O comando <h> é usado para identificar um cabeçalho. Existem seis tamanhos ou modelos que podem ser associados aos cabeçalhos. A sintaxe tem a seguinte forma: <hn>texto do Cabeçalho</hn> onde "n" deve ser substituído por um número de 1 a 6. O maior tamanho é especificado com o comando <h1> e o menor tamanho com o comando <h6>. Toda vez que um cabeçalho é especificado, o browser irá inserir uma linha em branco após sua linha. Existem outras formas de criar linhas de texto com tamanho e tipo de letras diferentes. Contudo, os comandos de cabeçalhos são a forma mais rápida de se conseguir esse efeito. O comando <hr> traça uma linha horizontal e salta uma linha a partir do ponto onde é inserido.
13 Parágrafos e quebras de linha Nas páginas HTML é possível digitar o texto exatamente no lugar onde você deseja que ele apareça na tela, da mesma forma que é feito com um editor de textos comum. A principal diferença está no fato do HTML não reconhecer o fim de um parágrafo quando se pressiona a tecla Enter. É necessário forçar o fim do parágrafo e a quebra de linha usando comandos especiais. O comando <p> é o responsável pela criação de parágrafos. Veja o exemplo abaixo. <h3>exemplo de Parágrafos e quebras de linhas</h3> <p>a linguagem html ignora a tecla enter pressionada no final da linha.</p> <p> <p> <p>note que, apesar de inseridos 3 comandos para quebra de linha, apenas uma linha em branco é inserida.</p> <hr> Como não foi especificada a fonte, o texto é exibido com a fonte padrão do browser (geralmente Times new roman). Resultado: Exemplo de Parágrafos e quebras de linhas A linguagem html ignora a tecla enter pressionada no final da linha. Note que, apesar de inseridos 3 comandos para quebra de linha, apenas uma linha em branco é inserida. Como não foi especificada a fonte, o texto é exibido com a fonte padrão do browser (geralmente Times new roman). No caso de redimensionamento da janela do browser, o texto será rearranjado e algumas linhas serão quebradas automaticamente de forma que todo o texto será mostrado no novo espaço. Contudo, os comandos <p> continuam valendo.
14 Às vezes pode ser necessária uma quebra de linha mas com o texto continuando na linha seguinte. O comando <br> nos permite isso. Ao contrário do comando <p>, ele não insere uma linha em branco, apenas passa para a linha seguinte.
15 Estilos de Texto Assim como nos editores de texto, a linguagem HTML permite a criação de uma série de efeitos no texto, seja alterando sua forma, tamanho ou estilo de fonte. Todos os comandos que alteram o estilo do texto são do tipo liga-desliga, ou seja, precisam ser especificados em pares, marcando o início e o fim do texto que sofrerá formatação. Os principais comandos de estilo de texto estão mostrados na tabela abaixo. Comando Sintaxe Função Negrito <b>texto</b> Aplica o estilo negrito Itálico <i>texto</i> Aplica o estilo itálico Sublinhado <u>texto</u> Aplica um sublinhado Strong <strong>texto</strong> Similar ao negrito Typewriter <tt>texto</tt> Deixa o texto com espaçamento regular Big <big>texto</big> Aumenta a fonte e aplica negrito Small <small>texto</small> Reduz e altera a fonte Sobrescrito <sup>texto</sup> Eleva o texto e diminui seu corpo Subscrito <sub>texto</sub> Rebaixa o texto e diminui seu corpo Strike <s>texto</s> O texto sai riscado Pulsante (*) <blink>texto</blink> Texto fica intermitente (*) não funciona em todos os navegadores Um dos recursos de tratamento de texto mais interessantes da linguagem HTML é a possibilidade de se alterar o tamanho, a cor e o tipo da fonte utilizada no texto. O comando responsável por isso é o <font>, que também é do tipo contêiner. Sua sintaxe é a seguinte:
16 <font size="n" face="fonte" color="cor">texto</font> O tamanho "n" pode ir de 1, o menor, até 7, o maior. Se nenhum tamanho é especificado, é assumido o valor padrão 3. Se for especificado um número antecedido do sinal de mais ou de menos, o tamanho da fonte será aumentado ou diminuído daquele valor. No lugar de "fonte", escreva o nome da fonte que se deseja para o texto. Um detalhe importante é que o texto somente será exibido na fonte indicada se o computador que estiver lendo a página possuir aquela fonte instalada. Portanto, é interessante que na construção das páginas sejam usadas somente fontes que geralmente todos possuem, como Arial, Times New Roman ou Courier. Uma opção mais simples é não indicar qual fonte a ser utilizada, deixando que o browser utilize sua configuração padrão. Para escolher a cor, pode-se escrever o seu nome, como red, blue, yellow, green, etc. Porém, para tons intermediários, é necessário que se conheça o código RGB da cor em algarismos hexadecimais. Os dois primeiros algarismos representam a quantidade de vermelho (red), os algarismos do meio, a quantidade de verde (green) e os dois últimos a quantidade de azul (blue) presente na cor. Por exemplo, color="#00ffff" irá colocar o texto na cor azul claro; color="#ff0000" irá colocar o texto na cor vermelho e assim por diante. Existem tabelas para referência com os códigos das cores.
17 Textos pré-formatados Através do comando <pre> é possível incluir um texto preservando sua formatação original, tal como marcas de tabulação, fim de linha gerado pela tecla enter e outros formatos. Veja o exemplo abaixo. <html> <head> <title>textos pré-formatados</title> </head> <body> <pre> Aqui eu coloco o que quiser Enter no final da linha funciona! /------\ * * Os tags também <b>funcionam</b>. </pre> </body> </html> Se você quiser testar o efeito do comando <pre>, copie o texto do exemplo acima e cole no Notepad (bloco de notas). Salve-o com um nome qualquer com a extensão htm ou html. Em seguida abra-o com seu browser (o procedimento para abrir um arquivo é semelhante para os diversos browsers. Geralmente clica-se em "Arquivo" e depois em "abrir" e escolhe-se o arquivo a partir da janela de busca). Você deve obter um resultado como mostrado abaixo:
18
19 Um exemplo completo Para exemplificar com mais detalhes os comandos mostrados até agora, criamos um exemplo simples, que é mostrado abaixo. Nosso objetivo com esse exemplo é apenas mostrar o efeito dos comandos, deixando de lado a estética. <html> <head> <title>exemplo com os recursos mostrados até o momento</title> </head> <body> <h3 align="center">exemplo Completo</h3> <p><font size="3" face="arial" color="blue">o uso correto dos recursos e um pouco de imaginação podem trazer bons resultados.</font> <hr size="3" width="50%"> <p align="center"><font size="4" face="times New Roman" color="teal"> Os tags podem ser combinados, de forma a criarem um efeito <blink><big><i>conjunto.</big></i></blink> <br>reparem que este parágrafo está centralizado.</font> <hr size="5" width="60%"> <div align="right"><pre> Vamos colocar agora um texto pré-formatado alinhado à direita </pre></div> </body> </html>
20 A visualização deste código no browser é mostrada abaixo. Neste exemplo foi introduzido o atributo align (alinhamento) para o cabeçalho, para os parágrafos e para o texto pré formatado. Se este atributo não é especificado, o browser mantém o alinhamento à esquerda. Um comando novo que aparece no exemplo é o comando <div>, que é utilizado para envolver uma área do texto ou divisão que pode receber parâmetros específicos de alinhamento. As linhas horizontais inseridas com o comando <hr> também ganharam atributos. A largura (size) e o comprimento (width) foram especificados de forma diferente nas duas linhas para destacar a ação dos parâmetros. A palavra "conjunto" está sob o efeito de vários tags ao mesmo tempo. Exemplo Completo O uso correto dos recursos e um pouco de imaginação podem trazer bons resultados. Os tags podem ser combinados, de forma a criarem um efeito conjunto. Reparem que este parágrafo está centralizado Vamos colocar agora um texto pré-formatado alinhado à direita Muito bem. Neste ponto você já sabe como criar um documento HTML e colocar texto formatado de diversas formas em seu conteúdo. Já é possível notar que a linguagem HTML é bastante simples e intuitiva, o que torna rápido o seu aprendizado. Na próxima seção mostraremos como funcionam as listas, um recurso muito importante que essa linguagem também oferece.
21 3.3 - Listas Uma forma de se estruturar um documento HTML é através das listas. As listas podem funcionar como um sumário, menu ou resumo do conteúdo do documento. Além disso, são excelentes para funcionar como ponto de partida para outras partes do documento. Existem basicamente dois tipos de listas. As listas não ordenadas, que encadeiam uma série de ítens sem numerá-los, e as listas ordenadas, que atribuem um número para cada elemento da lista.
22 Listas não ordenadas Para criar uma lista não ordenada, você deve usar o comando <ul> (unordered list) e o comando <li> (line item). O comando <ul> é do tipo liga-desliga e deve envolver todos os elementos da lista. Cada item da lista deve ser precedido do comando <li>. A sintaxe é mostrada abaixo. <ul> <li>texto do item 1 <li>texto do item <li>texto do item n </ul> No ítem seguinte são introduzidas as listas ordenadas e há um exemplo com ambos os tipos de listas.
23 Listas ordenadas As listas ordenadas são criadas de forma semelhante às não ordenadas. O comando que gera uma lista ordenada é <ol> (ordered list) e, como nas listas não ordenadas, o comando <li> deve preceder cada linha. A sintaxe é mostrada abaixo. <ol> <li>texto do item 1 <li>texto do item <li>texto do item n </ol> Para ilustrar a utilização das listas, considere o exemplo abaixo. <h4>exemplo de Lista Não Ordenada</h4> <ul> <li>página 1 <li>página 2 <li>página 3 </ul> <hr width="60%"> <h4>exemplo de Lista Ordenada</h4> <ol> <li>capítulo 1 <li>capítulo 2 <li>capítulo 3 </ol> Veja a seguir o efeito desses comandos.
24 Exemplo de Lista Não Ordenada Página 1 Página 2 Página 3 Exemplo de Lista Ordenada 1. Capítulo 1 2. Capítulo 2 3. Capítulo 3 Essas listas poderiam ser utilizadas como um índice para outros documentos, bastando apenas atribuir vínculos às palavras que serviriam como ligação. Veremos como fazer isso na próxima seção.
25 Listas aninhadas É possível aninhar diversas listas para criar estruturas hierárquicas, podendo inclusive mesclar listas ordenadas e não ordenadas. A sintaxe das listas aninhadas é essencialmente a mesma das listas normais, exceto que se começa uma nova lista antes de fechar a primeira e assim por diante. A idéia de aninhamento de listas ficará bem clara a partir do exemplo abaixo. <h3>exemplo com listas aninhadas</h3> <ol> <li>este é o primeiro ítem da lista principal <li>segundo ítem da lista principal <ul> <li>subitem do segundo ítem da lista principal <li>outro subitem <ol> <li>este é o terceiro nível, um subitem de um subitem <li>continuamos no terceiro nível. </ol> <li>não se perca, este é mais um subitem do segundo item </ul> <li>terceiro item da lista principal e chega. </ol> Veja os resultados: Exemplo com listas aninhadas 1. Este é o primeiro ítem da lista principal 2. Segundo ítem da lista principal Subitem do segundo ítem da lista principal Outro subitem 1. Este é o terceiro nível, um subitem de um subitem 2. Continuamos no terceiro nível. Não se perca, este é mais um subitem do segundo item 3. Terceiro item da lista principal e chega.
26 É interessante notar que a numeração é reiniciada para cada novo nível. Dentro das listas pode-se usar qualquer formatação de texto normalmente. No caso das listas aninhadas, deve-se prestar bastante atenção para casar todos os comandos, ou seja, cada lista aberta deve ser fechada pelo comando correspondente.
27 3.4 - URLs e Links A principal atração da World Wide Web é a possibilidade de utilização do conceito de hipertexto, que é a conexão de um documento a outros através de vínculos especiais chamados hiperlinks (ou simplesmente links). Dessa forma, a partir de uma página Web poderíamos ir para outra, não importando se ela está no mesmo computador ou em qualquer outro servidor da rede. O uso de hipertexto também facilita a utilização de documentos extensos cujas seções ou tópicos podem ser rapidamente acessados por meio dos links. Um bom exemplo é o glossário deste curso. Através das iniciais, você pode se dirigir para qualquer parte do documento, e encontrar rapidamente a expressão procurada.
28 Vinculando seções de uma página Para dominar o uso do hipertexto, deve-se conhecer bem o funcionamento de dois comandos da linguagem HTML: o comando A NAME e o comando A HREF. Criando uma âncora (bookmark) Para vincular partes de uma página, é preciso criar uma âncora no início de cada seção que será referenciada por um link. Uma âncora é um ponto de referência ou endereço que será acessado por um link. Ela geralmente marca o início de uma seção do documento. Essa âncora recebe um nome que será a forma com que o link a acessará. O comando usado para criar uma âncora é: <a name="nome da âncora">texto alvo do link</a> Criando o link para a âncora Para criar um link para uma âncora, deve-se utilizar o comando A HREF, especificando o nome da âncora que se deseja acessar através do link. O texto envolvido por esse comando mudará de cor e ficará sublinhado para se diferenciar do restante do texto. No browser, um clique nesse texto o levará diretamente para o local onde foi criada a âncora. A sintaxe é a seguinte: <a href="#nome da âncora de destino">texto do link</a> O símbolo "#" é importante pois avisa ao browser que se trata de um link para o documento atual. O exemplo abaixo mostra a utilização dos vínculos em uma mesma página.
29 <h4 align="center">exemplo de links na mesma página</h4> <a name="inicio">início do documento</a> <p><a href="#parte1">parte 1 - Introdução</a></p> <p>clique no links acima para acessar o texto correspondente</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <p>essas linhas são somente para separar os tópicos</p> <a name="parte1"><h4>introdução</h4></a> <p><a href="#inicio">volta ao início do documento</a></p> Veja os resultados:
30 Exemplo de links na mesma página Início do documento Parte 1 - Introdução Clique no links acima para acessar o texto correspondente Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Essas linhas são somente para separar os tópicos Introdução Volta ao início do documento Neste exemplo, temos duas âncoras e dois links. As âncoras marcam o início do documento e o início da "introdução". O link no começo aponta para a âncora "parte1", na introdução, e o link no final aponta para a âncora "início", no início do documento.
31 Vinculando arquivos locais Fazer a ligação de um texto do seu documento HTML com uma página local é uma tarefa bastante simples. É necessário que se especifique, através do comando A HREF, o nome completo do arquivo que será chamado. É necessário que se coloque a extensão do arquivo. Se o arquivo for um documento HTML (*.htm ou *.html), um arquivo texto (*.txt) ou uma imagem (*.gif ou *.jpg), o browser o abrirá automaticamente. Alguns arquivos de outras extensões podem ser abertos pelo browser, mas alguns deles exigem um plugin, que é um programa, geralmente fornecido gratuitamente pelo fabricante, que complementa o browser, permitindo que ele abra arquivos de extensões especiais. Se o vínculo aponta para um arquivo que não é html nem algum outro reconhecido pelos plugins, o browser irá perguntar se deve salvar o arquivo ou escolher um aplicativo instalado para abrí-lo. A sintaxe do comando é a seguinte: <a href="nome_do_arquivo.extensão">texto do link</a> Para compreender melhor as referências a arquivos, considere os exemplos abaixo. <a href="introd.html">introdução</a> <a href="introd.html#parte2">parte 2 dentro da Introdução</a> <a href="../aulas/aula3.html">aula 3 no diretório aulas em um nível acima</a> <a href="imagens/figura1.jpg">figura em um diretório dentro do diretório atual</a> No primeiro exemplo, a referência é valida se o arquivo "introd.html" estiver no mesmo diretório que o documento atual. O browser usa como referencial o diretório atual para iniciar a busca de páginas. Você não deve especificar o caminho do DOS, mas sim especificar um caminho relativo ao diretório atual. Além disso, na Web são usadas barras normais "/" no lugar das barras invertidas "\" usadas para indicar os caminhos no DOS. Uma possibilidade interessante é mostrada no segundo exemplo. Este vínculo levará diretamente à âncora "parte2" dentro do arquivo introd.html. O terceiro e o quarto exemplo mostram como referenciar arquivos em diretórios diferentes. Os sinais "../" são usados para subir um nível na árvore de diretórios e depois entrar no diretório indicado. No quarto exemplo, o arquivo que se deseja está dentro do diretório "imagens" que, por sua vez, está dentro do diretório atual.
32 Vinculando arquivos de outros servidores Através de um esquema de endereçamento chamado URL (Uniform Resource Locator), é possível acessar um arquivo em um computador em qualquer lugar do planeta, desde que este esteja adequadamente conectado à Internet. O URL é composto por duas partes principais. A primeira é o protocolo Internet do documento e a segunda parte é o endereço do servidor e da página. A sintaxe é: protocolo://servidor/arquivo onde protocolo é o tipo de servidor que está sendo acessado (http, ftp, telnet); servidor é o computador que contém a página; arquivo é o caminho do arquivo. Por exemplo, a página da UFMG tem a URL: e pode ser acessada a partir de um documento HTML através do comando <a href=" da UFMG</a> Note que não há indicação quanto ao caminho do arquivo, somente ao protocolo e ao servidor. Isso é possível graças à configuração padrão dos navegadores que, quando não sendo indicado o caminho do arquivo, procuram pelo arquivo index.html. Portanto, a página principal de um site deve se chamar sempre index.html (ou index.htm). Se na referência se deseja um arquivo que não seja o index.html, deve-se especificar o caminho completo do arquivo, incluindo diretórios e a extensão, como no exemplo abaixo. <a href=" estatuto da UFMG</a>
33 3.5 - Imagens A possibilidade de inclusão de imagens nos documentos HTML dá uma nova dimensão para a transmissão da informação. Imagens e ilustrações podem tornar a informação muito mais atraente. O princípio básico é reduzir ao máximo o tamanho das imagens, a fim de facilitar o download das páginas e não esgotar a paciência do visitante. Ilustrações a partir de 50 KB já podem ser consideradas excessivamente grandes, principalmente quando há mais de uma na mesma página. Portanto, a recomendação é que se usem imagens pequenas, com resolução de 78 pixels por polegada, que é a resolução usada no padrão VGA e SVGA da maioria dos usuários.
34 Padrões Utilizados Os arquivos de imagens GIF e JPEG (extensão JPG) são os padrões da Web. A principal razão para essa preferência está no grau de compressão embutido nesses formatos. Assim, quando se tem uma foto ou ilustração em formatos como BMP, TIF ou EPS, é necessário transformá-la em um arquivo GIF ou JPG, se quiser usá-la na Web. O GIF, sigla de Graphics Interchange Format, foi desenvolvido pela Compuserve e pode comprimir figuras a até 1 centésimo do tamanho original. Mas a taxa de compressão varia muito, dependendo da imagem. Quanto mais redundante a figura, maior a compressão. Para imagens complexas, sem padrões repetitivos, o melhor que se consegue é reduzir o tamanho a cerca de 80% do original. As imagens GIF têm limitações. A principal é que suportam apenas 256 cores. As imagens JPG, diferentemente do padrão GIF, possuem maior número de cores (16,7 milhões) e aceitam que se defina o grau de compactação desejado. Quanto menor o arquivo obtido, também menor será a qualidade da imagem. Imagem no padrão JPG, com tamanho de 15KB. A mesma imagem no formato GIF tem 84KB, sendo, portanto, desaconselhável
35 A conclusão é que o padrão JPEG é mais adequado para imagens mais complexas, como fotos que apresentam muitas cores e detalhes. Já o padrão GIF combina melhor com imagens mais simples e com pequena variação de tonalidades. O padrão GIF possui também um recurso adicional. Quando se salva uma imagem no formato GIF, pode-se escolher uma cor da imagem para ser transparente. Isso faz com que toda a área da imagem que possuir aquela cor fique transparente, permitindo a visualização do que há "por baixo" da imagem, como a cor de fundo de um documento HTML. Com a prática, vai se percebendo qual a opção mais desejável para cada aplicação. Imagem no formato GIF, com tamanho de 4KB. No formato JPG ela teria 7,5KB, ou seja, quase o dobro A mesma imagem GIF com a cor marrom claro do cabelo do personagem escolhida como transparente. O que é mostrado em seu lugar é o que está
36 Dentro do padrão GIF temos uma aplicação muito útil e interessante, os GIFs animados. Eles são compostos por uma sequência de imagens que são alternadas rapidamente, passando a impressão de movimento. Existem programas que combinam as imagens e formam um GIF animado, ou seja, uma vez criados os quadros com um editor de imagens comum, esses programas se encarregam de sequenciar as figuras e compor a imagem final. É possível, dependendo do programa, mudar o tempo de exibição de cada quadro e o número de vezes que o ciclo se repetirá. Geralmente os GIFs animados se repetem indefinidamente, enquanto a página estiver sendo visualizada. Os GIFs animados têm a mesma extensão das imagens GIF comuns e são inseridos no documento também da mesma forma. Em um curso à distância, eles podem ser uma opção interessante para se mostrar como fazer algo através de uma pequena sequência de passos, ou simplesmente para animar um pouco as páginas. Exemplo de GIF animado. Cada quadro é uma imagem GIF e a imagem final, obtida com o auxílio de um programa especial para sequenciar as imagens, também tem a extensão GIF.
Word 1 - Introdução 1.1 - Principais recursos do word 1.2 - A janela de documento 1.3 - Tela principal
Word 1 - Introdução O Word para Windows ou NT, é um processador de textos cuja finalidade é a de nos ajudar a trabalhar de maneira mais eficiente tanto na elaboração de documentos simples, quanto naqueles
Leia maisPassa a passo para construir uma página pessoal - Parte 1
Passa a passo para construir uma página pessoal - Parte 1 Quais ferramentas são necessárias? - Editor de texto básico (sem formatações): use o Bloco de Notas (não use o MS Word e WordPad) - Navegador (browser):
Leia maisAdapti - Technology Solutions www.adapti.net Leonor cardoso nº 331 Fone : (041) 8844-7805 81240-380 Curitiba - PR MANUAL DO USUÁRIO
MANUAL DO USUÁRIO 1 Índice Administração de Documentos...2 Lista de documentos criados...3 Criando um novo documento...3 Barra de ferramentas do editor...4 Editando um documento...7 Administrando suas
Leia maisTutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados
Tutorial Plone 4 Manutenção de Sites Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Sumário Introdução 1 Como fazer a autenticação do usuário 1.1 Através do
Leia maisIntrodução. História. Como funciona
Introdução O HTML é uma linguagem de marcação utilizada para desenvolvimento de sites. Esta linguagem surgiu junto com o HTTP, ambos possibilitaram a internet ser popularizada. História O HTML foi criado
Leia maisBarra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas
Microsoft Power Point 2003 No Microsoft PowerPoint 2003, você cria sua apresentação usando apenas um arquivo, ele contém tudo o que você precisa uma estrutura para sua apresentação, os slides, o material
Leia maisGuia de Início Rápido
Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido
Leia maisRoteiro 2: Conceitos de Tags HTML
Roteiro 2: Conceitos de Tags HTML Objetivos Detalhar conceitos sobre TAGS HTML: elementos, atributos, elemento vazio, links. Implementar páginas de internet com uso da linguagem HTML; Ferramentas Necessárias
Leia maisDicas para usar melhor o Word 2007
Dicas para usar melhor o Word 2007 Quem está acostumado (ou não) a trabalhar com o Word, não costuma ter todo o tempo do mundo disponível para descobrir as funcionalidades de versões recentemente lançadas.
Leia mais02 - Usando o SiteMaster - Informações importantes
01 - Apresentação do SiteMaster - News Edition O SiteMaster foi desenvolvido para ser um sistema simples de gerenciamento de notícias, instalado em seu próprio computador e com configuração simplificada,
Leia maisMicrosoft Office FrontPage 2003
Instituto Politécnico de Tomar Escola Superior de Gestão Área Interdepartamental de Tecnologias de Informação e Comunicação Microsoft Office FrontPage 2003 1 Microsoft Office FrontPage 2003 O Microsoft
Leia maisDesenvolvedor Web Docente André Luiz Silva de Moraes
Roteiro 2: Introdução a Linguagem HTML Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção de páginas de internet e é responsável
Leia maisManual do Publicador. Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web
Manual do Publicador Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web Sumário Painel de Administração... 3 1 - Inserção de post... 5 2 Publicação de post com notícia na área headline (galeria de
Leia maisClaudio Damasceno. Avançar
Claudio Damasceno Conteúdo Alinhamento Âncoras, Links Tabelas Formatação Próximo Capítulo HTML prof.claudiodamasceno@hotmail.com 2 Recapitulando - Estrutura básica título DA PÁGINA
Leia maisEditando textos no Siga-Doc
Editando textos no Siga-Doc Introdução...2 Executando o editor de textos...3 Acessando pela primeira vez...3 Se o editor de textos não for exibido...4 Trabalhando com tabelas...6 Inserindo uma tabela...6
Leia maisAPOSTILA WORD BÁSICO
APOSTILA WORD BÁSICO Apresentação O WORD é um editor de textos, que pertence ao Pacote Office da Microsoft. Suas principais características são: criação de textos, cartas, memorandos, documentos, mala
Leia maisStatus. Barra de Título. Barra de Menu. Barra de. Ferramentas Padrão. Caixa de nomes. Barra de. Ferramentas de Formatação. Indicadores de Coluna
O que é uma planilha eletrônica? É um aplicativo que oferece recursos para manipular dados organizados em tabelas. A partir deles pode-se gerar gráficos facilitando a análise e interpretação dos dados
Leia maisMicrosoft Word INTRODUÇÃO
INTRODUÇÃO O Word é uma ferramenta utilizada para o processamento e editoração eletrônica de textos. O processamento de textos consiste na possibilidade de executar e criar efeitos sobre um texto qualquer,
Leia maisComo incluir artigos:
Como incluir artigos: O WordPress é uma ferramenta muito flexível, com muitas variações e ajustes que podem torná-lo algo muito simples e também muito sofisticado conforme os recursos que são configurados
Leia maisCONCEITOS INICIAIS. Agenda A diferença entre páginas Web, Home Page e apresentação Web;
CONCEITOS INICIAIS Agenda A diferença entre páginas Web, Home Page e apresentação Web; O que é necessário para se criar páginas para a Web; Navegadores; O que é site, Host, Provedor e Servidor Web; Protocolos.
Leia mais15. OLHA QUEM ESTÁ NA WEB!
7 a e 8 a SÉRIES / ENSINO MÉDIO 15. OLHA QUEM ESTÁ NA WEB! Sua home page para publicar na Internet SOFTWARES NECESSÁRIOS: MICROSOFT WORD 2000 MICROSOFT PUBLISHER 2000 SOFTWARE OPCIONAL: INTERNET EXPLORER
Leia maisWeb Design. Prof. Felippe
Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre
Leia maisDesenvolvimento de Sites com PHP e Mysql Docente André Luiz Silva de Moraes
Roteiro 2: Introdução a Linguagem HTML Desenvolvimento de Sites com PHP e Mysql Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção
Leia maisCurso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2
Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Objetivo. O objetivo da disciplina é conhecer os princípios da programação de
Leia mais1 2 3 W O R K S H O P 4 5 6 W O R K S H O P 7 W O R K S H O P 8 9 10 Instruções gerais para a realização das Propostas de Actividades Para conhecer em pormenor o INTERFACE DO FRONTPAGE clique aqui 11 CONSTRUÇÃO
Leia maisManual do Painel Administrativo
Manual do Painel Administrativo versão 1.0 Autores César A Miggiolaro Marcos J Lazarin Índice Índice... 2 Figuras... 3 Inicio... 5 Funcionalidades... 7 Analytics... 9 Cidades... 9 Conteúdo... 10 Referência...
Leia maisInstrução de Trabalho Base de Conhecimento
Aprovado por Comitê da Qualidade Analisado criticamente por Dono do processo 1. OBJETIVOS Esta instrução de trabalho tem como objetivo orientar os colaboradores da SINFO, de como a será mantida e acessada.
Leia maisBem- Vindo ao manual de instruções do ECO Editor de COnteúdo.
Manual de Instruções ECO Editor de Conteúdo Bem- Vindo ao manual de instruções do ECO Editor de COnteúdo. O ECO é um sistema amigável e intui?vo, mas abaixo você pode?rar eventuais dúvidas e aproveitar
Leia maisPoder Judiciário Tribunal Regional Federal da Terceira Região
Poder Judiciário Tribunal Regional Federal da Terceira Região DIMI - Divisão de Microinformática e Redes Índice: O que é a Internet? 3 O que são Intranets? 3 Sobre o Nestcape Navigator 3 Para iniciar o
Leia maisPortal da Prefeitura de São Paulo SECOM. MANUAL DO WARAM v. 1.5 Secretarias
SECOM MANUAL DO WARAM v. 1.5 Secretarias WARAM 1.5 Ferramenta de atualização do Portal da Prefeitura de São Paulo. Use preferencialmente o navegador Internet Explorer superior ou igual a 7.0. No campo
Leia mais4.14 - Imagens: <img src="..."> src <img src="tecnologia.jpg"> único atributo que não pode ser omitido neste TAG Nota: img
4.14 - Imagens: O TAG utilizado para a inclusão de imagens em páginas html é o: O atributo src especifica o local onde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso
Leia maisRoteiro 7: Ferramentas de trabalho Editores de texto
Roteiro 7: Ferramentas de trabalho Editores de texto Objetivos Detalhar conceitos sobre ferramentas de edição de texto; Explorar recursos do libreoffice writer; Explorar recursos do Microsoft Word; Explorar
Leia maisBanco de Dados BrOffice Base
Banco de Dados BrOffice Base Autor: Alessandro da Silva Almeida Disponível em: www.apostilando.com 27/02/2011 CURSO TÉCNICO EM SERVIÇO PÚBLICO Apostila de Informática Aplicada - Unidade VI Índice Apresentação...
Leia maisDesenvolvendo Websites com PHP
Desenvolvendo Websites com PHP Aprenda a criar Websites dinâmicos e interativos com PHP e bancos de dados Juliano Niederauer 19 Capítulo 1 O que é o PHP? O PHP é uma das linguagens mais utilizadas na Web.
Leia maisCICLO DE APERFEIÇOAMENTO PROFISSIONAL DOS SERVIDORES MUNICIPAIS DE MARICÁ- RJ EDITOR DE TEXTO - WORD
Faculdade de Administração, Ciências Contábeis e Turismo Pós-Graduação em Gestão de Negócios CICLO DE APERFEIÇOAMENTO PROFISSIONAL DOS SERVIDORES MUNICIPAIS DE MARICÁ- RJ EDITOR DE TEXTO - WORD EMENTA
Leia maisLidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado.
, ()! $ Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. Uma estratégia muito utilizada para organizar visualmente informações numéricas
Leia maisASSOCIAÇÃO CRISTÃ DE MOÇOS DO RIO GRANDE DO SUL DEPARTAMENTO DE TECNOLOGIA DA INFORMAÇÃO
MANUAL MEDIAWIKI Manual Media Wiki Página 2 Sumário O que é MediaWiki... 4 Acesso ao sistema... 5 Criação do índice principal... 7 Criação de página... 14 Bloqueio/Proteção de página... 17 Manual Media
Leia maisAPOSTILA DE EXEMPLO. (Esta é só uma reprodução parcial do conteúdo)
APOSTILA DE EXEMPLO (Esta é só uma reprodução parcial do conteúdo) 1 Índice Aula 1 - Área de trabalho e personalizando o sistema... 3 A área de trabalho... 3 Partes da área de trabalho.... 4 O Menu Iniciar:...
Leia maisManual de Gerenciamento de Conteúdo
Manual de Gerenciamento de Conteúdo 1 Sumário 1) O que é um Gerenciador de Conteúdo...3 2) Como o Site está Estruturado...3 3) Como Gerenciar o Conteúdo do Site...5 3.1) Adicionar Itens no Menu de Navegação...6
Leia maisWebdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza
Webdesign HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML
Leia maisATENÇÃO: * Arquivos com tamanho superior a 500 KB NÃO SERÃO ACEITOS * SOMENTE serão aceitos documentos do formato: PDF
TUTORIAL DE DIGITALIZAÇÃO DIRIGIDO AO USO DO PROCESSO ELETRÔNICO Adaptado do tutorial elaborado pelo colega MAICON FALCÃO, operador de computador da subseção judiciária de Rio Grande. Introdução Este tutorial
Leia maisFluxo de trabalho do Capture Pro Software: Indexação de código de barras e separação de documentos
Este procedimento corresponde ao fluxo de trabalho de Indexação de código de barras e de separação de documentos no programa de treinamento do Capture Pro Software. As etapas do procedimento encontram-se
Leia maisOFICINA BLOG DAS ESCOLAS
OFICINA BLOG DAS ESCOLAS Créditos: Márcio Corrente Gonçalves Mônica Norris Ribeiro Março 2010 1 ACESSANDO O BLOG Blog das Escolas MANUAL DO ADMINISTRADOR Para acessar o blog da sua escola, acesse o endereço
Leia maisWebDesign. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br. Escola CDI de Videira
WebDesign Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Entendendo Alguns Conceitos Antes de prosseguirmos é importante ter em mente o motivo pelo
Leia maisFluxo de trabalho do Capture Pro Software: Indexação de OCR e separação de documentos de código de correção
Este procedimento corresponde ao fluxo de trabalho de Indexação de OCR com separação de código de correção no programa de treinamento do Capture Pro Software. As etapas do procedimento encontram-se na
Leia maisIniciação à Informática
Meu computador e Windows Explorer Justificativa Toda informação ou dado trabalhado no computador, quando armazenado em uma unidade de disco, transforma-se em um arquivo. Saber manipular os arquivos através
Leia maisAPOSTILA DE EXCEL 2007
APOSTILA DE EXCEL 2007 1. Introdução Quando você cria uma planilha nova, a tela do computador é dividida em linhas e colunas, formando uma grade. A interseção de uma linha e de uma coluna é chamada de
Leia mais4.14 - Imagens: <IMG SRC="..."> SRC <IMG SRC="tecnologia.jpg"> único atributo que não pode ser omitido neste tag Nota: img
4.14 - Imagens: O tag utilizado para a inclusão de imagens em páginas html é o: O atributo SRC especifica o local aonde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso
Leia maisANDRÉ APARECIDO DA SILVA APOSTILA BÁSICA SOBRE O POWERPOINT 2007
ANDRÉ APARECIDO DA SILVA APOSTILA BÁSICA SOBRE O POWERPOINT 2007 CURITIBA 2015 2 SUMÁRIO INTRODUÇÃO AO MICROSOFT POWERPOINT 2007... 3 JANELA PRINCIPAL... 3 1 - BOTÃO OFFICE... 4 2 - FERRAMENTAS DE ACESSO
Leia maisCurso PHP Básico. Jairo Charnoski do Nascimento
Curso PHP Básico Jairo Charnoski do Nascimento Agenda Ferramentas necessárias Introdução HTML HTML? Tags Construindo seu primeiro website Observações sobre a estrutura Mais tags Atributos Agenda Cores
Leia maisQUEM FEZ O TRABALHO?
Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA 1 QUEM FEZ O TRABALHO? Com as tagsaprendidas hoje, faça uma página HTML sobre você com as seguintes informações: Seu nome
Leia maisApostila de PowerPoint 2013
Iniciando o Power Point 2013...01 Nova apresentação baseada no modelo...01 Escolhendo o esquema de cores do fundo do slide manualmente...02 Modificando o layout do slide... 03 Inserindo textos no slide...
Leia maisSumário. 1 Tutorial: Blogs no Clickideia
1 Tutorial: Blogs no Clickideia Sumário Introdução... 2 Objetivos... 2 Instruções para utilização do Tutorial... 2 Acesso ao Portal e a Home Blog... 3 Página Inicial da área do Blog... 4 Apresentação da
Leia mais1. HTML - Introdução. Hyper Text Markup Language. É uma linguagem de formatação de conteúdos. Portável. Ficheiros de pequena dimensão
1. HTML - Introdução Hyper Text Markup Language É uma linguagem de formatação de conteúdos Não é uma linguagem de programação Portável Não depende da plataforma em que é vizualizado Ficheiros de pequena
Leia maisServiço Técnico de Informática. Curso Básico de PowerPoint
Serviço Técnico de Informática Curso Básico de PowerPoint Instrutor: Tiago Souza e Silva de Moura Maio/2005 O Microsoft PowerPoint No Microsoft PowerPoint, você cria sua apresentação usando apenas um arquivo
Leia maisIntrodução 1ª Parte Web Web Web Web Browsers Editores Editores Etiquetas (tags) base indica que se trata de uma página escrita em linguagem HTML. Esta deve abranger todo o código;
Leia maisO Microsoft Office é composto por diversos softwares, dentre eles o Word, o Excel, o Access e o Power Point.
Editor de Texto Microsoft Word 1. Microsoft Office O Microsoft Office é composto por diversos softwares, dentre eles o Word, o Excel, o Access e o Power Point. O Word é um editor de texto com recursos
Leia maisMicrosoft Office PowerPoint 2007
INTRODUÇÃO AO MICROSOFT POWERPOINT 2007 O Microsoft Office PowerPoint 2007 é um programa destinado à criação de apresentação através de Slides. A apresentação é um conjunto de Sides que são exibidos em
Leia maisAula 01 - Formatações prontas e condicionais. Aula 01 - Formatações prontas e condicionais. Sumário. Formatar como Tabela
Aula 01 - Formatações prontas e Sumário Formatar como Tabela Formatar como Tabela (cont.) Alterando as formatações aplicadas e adicionando novos itens Removendo a formatação de tabela aplicada Formatação
Leia maisMICROSOFT OFFICE EXCEL 2007
LEIAME Nenhuma informação da APOSTILA - MICROSOFT OFFICE EXCEL 2007 poderá ser copiada, movida ou modificada sem autorização prévia e escrita do autor. MICROSOFT OFFICE EXCEL 2007 Efetue cálculos, analise
Leia maisTutorial Gerar arquivo PDF. Gerando um documento pdf com várias imagens 1- Inserir imagem no Word
Tutorial Gerar arquivo PDF. Com o objetivo de simplificar e diminuir o tamanho de arquivos anexos nos projetos, elaboramos um pequeno tutorial mostrando como gerar um único arquivo no formato pdf contendo
Leia maisRedimensionamento de Imagens no Catálogo de Produtos
REDIMENSIONAMENTO DE IMAGENS NO PORTAL DE OPERAÇÕES DO CARTÃO BNDES Redimensionamento de Imagens no Catálogo de Produtos Atualizado em 15/05/14 Pág.: 1/14 Introdução Este manual destina-se a orientar os
Leia mais1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2.
1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2. Editando um Artigo 4.3. Excluindo um Artigo 4.4. Publicar
Leia maisÍNDICE. www.leitejunior.com.br 16/06/2008 17:48 Leite Júnior
ÍNDICE MICROSOFT INTERNET EXPLORER 6 SP2 (IE6 SP2)...2 JANELA PRINCIPAL...2 PARTES DA JANELA...2 OS MENUS DO IE6...3 MENU ARQUIVO...3 MENU EDITAR...3 MENU EXIBIR...3 MENU FAVORITOS...4 MENU FERRAMENTAS...4
Leia maisÍNDICE MANUAL SITE ADMINISTRÁVEL TV. 1. Introdução 2. Acessando o site administrável/webtv SITE ADMINISTRÁVEL 3. CONFIGURAÇÕES
MANUAL SITE ADMINISTRÁVEL TV ÍNDICE 1. Introdução 2. Acessando o site administrável/webtv SITE ADMINISTRÁVEL 3. CONFIGURAÇÕES 3.1 - Dados Cadastrais 3.2 - Noticias 3.3 Redes Sociais 3.4 - Player 4. DESIGN
Leia maisPortal do Projeto Tempo de Ser
Sumário Portal do Projeto Tempo de Ser O que é um Wiki?...2 Documentos...2 Localizando documentos...3 Links...3 Criando um Documento...4 Criando um link...4 Editando um Documento...5 Sintaxe Básica...5
Leia maisEsse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5.
Esse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5. Ele considera que você já tem o Joomla! instalado no seu computador. Caso você queira utilizá lo em um servidor na web,
Leia maisCAPÍTULO 06. AG8 Informática. Este capítulo abrangerá :
3ª PARTE CAPÍTULO 06 Este capítulo abrangerá : 1. Tags de formatação de texto lógicas e físicas 2. Texto pré-formatado 3. Endereços, citações e comentários 38 TAGS DE FORMATAÇÃO Assim como em um editor
Leia maisTutorial SGCD. 1. Efetuando Login no Sistema. 2. Criando uma nova página. 3. Editando uma página já existente
Tutorial SGCD 1. Efetuando Login no Sistema 2. Criando uma nova página 3. Editando uma página já existente 4. Anexando arquivos em páginas e no menu esquerdo 5. Colocando Imagens em páginas 6. Colocando
Leia maisNa tela dele, clique no sinal de + ao lado do nome do seu computador, para expandi-lo. A seguir, expanda também o item "Sites da web".
Servidor WEB Desenvolvedores de sites que querem aprender ou testar ASP, ou mesmo profissionais que precisam desenvolver páginas ASP ou ASP.Net, não precisam necessariamente ter um servidor na web com
Leia maisCRIAÇÃO DE SITES (AULA 4)
Prof. Breno Leonardo Gomes de Menezes Araújo brenod123@gmail.com http://blog.brenoleonardo.com.br CRIAÇÃO DE SITES (AULA 4) O que eu preciso para construir um link? Para construir um link você usa o que
Leia maisO Windows 7 é um sistema operacional desenvolvido pela Microsoft.
Introdução ao Microsoft Windows 7 O Windows 7 é um sistema operacional desenvolvido pela Microsoft. Visualmente o Windows 7 possui uma interface muito intuitiva, facilitando a experiência individual do
Leia maisO Windows 7 é um sistema operacional desenvolvido pela Microsoft.
Introdução ao Microsoft Windows 7 O Windows 7 é um sistema operacional desenvolvido pela Microsoft. Visualmente o Windows 7 possui uma interface muito intuitiva, facilitando a experiência individual do
Leia maisUniversidade Federal do Mato Grosso - STI-CAE. Índice
CAPA Universidade Federal do Mato Grosso - STI-CAE Índice 1. Página da área administrativa... 1.1 Botões e campo iniciais... 2. Explicar como funcionam as seções... 2.1. Seções dinâmicos... 2.1.1 Como
Leia maisMANUAL DO ANIMAIL 1.0.0.1142 Terti Software
O Animail é um software para criar campanhas de envio de email (email Marketing). Você pode criar diversas campanhas para públicos diferenciados. Tela Principal do sistema Para melhor apresentar o sistema,
Leia maisHTML. Conceitos básicos de formatação de páginas WEB
HTML Conceitos básicos de formatação de páginas WEB HTML HyperText Markup Language Linguagem utilizada para criar hipertexto na web Ou seja, criar documentos estruturados utilizando para tal um conjunto
Leia mais> Herbet Ferreira Rodrigues > contato@herbetferreira.com
Curso HTML & CSS > Herbet Ferreira Rodrigues > contato@herbetferreira.com Sumário > Apresentação > Introdução ao HTML História Começando a Programar > Tags em HTML Headings (Cabeçalhos) Parágrafos Formatação
Leia maismkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Criando uma Calculadora Primeiramente deve se criar uma estrutura para armazenar os arquivos necessários para o funcionamento da calculadora.
Leia maisComo Gerar documento em PDF com várias Imagens
Como Gerar documento em PDF com várias Imagens Para Gerar documento em PDF com várias Imagens, temos que seguir dois passos: 1. Inserir Imagens no Word 2. Gerar PDF a partir de documento do Word 1- Inserir
Leia maisCOMO COLABORAR NO WIKI DO MOODLE 1. Orientações para produção escolar colaborativa no wiki do Moodle:
COMO COLABORAR NO WIKI DO MOODLE 1 Ilse Abegg e Fábio da Purificação de Bastos e-mail: iabegg@mail.ufsm.br O wiki no Moodle é uma ferramenta de atividade que visa produção escolar colaborativa. Isso significa
Leia maisLINGUAGEM DE PROGRAMAÇÃO HTML COMPONENTES: ROBSON EDMILSON
COMPONENTES: ROBSON EDMILSON O HTML (Hiper Text Mark-up Language) é uma linguagem de programação hipertexto. O HTML tem códigos para criar páginas na web. Estes códigos que definem o tipo de letra, qual
Leia maisBem vindo ao ajuda do software QUICKFISH para criação de sites.
Bem vindo ao ajuda do software QUICKFISH para criação de sites. SUMÁRIO 1 Exemplo de site criado no software QUICKFISH...02 2 Salvando Seu Site...03 3 Publicando Seu Site...03 4 Visão inicial do Software
Leia maisUniversidade Federal de Santa Maria UFSM Centro de Tecnologia CT. Power Point. Básico
Universidade Federal de Santa Maria UFSM Centro de Tecnologia CT Power Point Básico Santa Maria, julho de 2006 O Power Point é um aplicativo do Microsoft Office direcionado à criação de apresentações.
Leia maisALBUM DE FOTOGRAFIAS NO POWER POINT
ALBUM DE FOTOGRAFIAS NO POWER POINT O PowerPoint é uma poderosa ferramenta que faz parte do pacote Office da Microsoft. O principal uso desse programa é a criação de apresentação de slides, para mostrar
Leia maisMicrosoft PowerPoint 2003
Página 1 de 36 Índice Conteúdo Nº de página Introdução 3 Área de Trabalho 5 Criando uma nova apresentação 7 Guardar Apresentação 8 Inserir Diapositivos 10 Fechar Apresentação 12 Abrindo Documentos 13 Configurar
Leia maisEXEMPLO DE COMO FAZER UMA MALA DIRETA
EXEMPLO DE COMO FAZER UMA MALA DIRETA OBS: Para esta nota de aula foi utilizada como referência: Apostila Mala Direta Santos, Jorge Rodrigues dos. Foram adaptados os comando para utilizar mala direta no
Leia maisMANUAL DE UTILIZAÇÃO SISTEMA DE CADASTRO INTRANET
MANUAL DE UTILIZAÇÃO SISTEMA DE CADASTRO INTRANET I Sumário 1. Objetivo do Documento... 1 2. Início... 1 3. Cadastro de Pessoa Física... 3 3.1. Preenchimentos Obrigatórios.... 4 3.2. Acesso aos Campos
Leia maisTable of Contents. PowerPoint XP
Table of Contents Finalizando a apresentação...1 Usando anotações...1 Desfazer e repetir...1 Localizar e substituir...2 Substituir...2 Efeitos de transição...3 Esquema de animação...6 Controlando os tempos
Leia maisPDI 1 - Projeto e Design de Interfaces Web
Introdução a HTML e XHTML Elementos básicos parte 2 Professor: Victor Hugo L. Lopes Agenda: --Adicionando imagens; --Trabalhando com vídeos e sons em HTML; Disponível em http://wp.me/p48yvn-43 2 Inserindo
Leia maisCriando um script simples
Criando um script simples As ferramentas de script Diferente de muitas linguagens de programação, você não precisará de quaisquer softwares especiais para criar scripts de JavaScript. A primeira coisa
Leia maisConstrução Páginas de Internet
Construção Páginas de Internet Definir um Site no Frontpage Objectivos da sessão: No final da sessão os formandos deverão ser capazes de: Saber o que são os metadados do Frontpage; Distinguir entre Sites
Leia maisProcedimentos para Reinstalação do Sisloc
Procedimentos para Reinstalação do Sisloc Sumário: 1. Informações Gerais... 3 2. Criação de backups importantes... 3 3. Reinstalação do Sisloc... 4 Passo a passo... 4 4. Instalação da base de dados Sisloc...
Leia maisProgramação para Internet I
Programação para Internet I Aula 05 e 06 Fernando F. Costa nando@fimes.edu.br 1 Tags de Formatação de Texto - Permite que um texto se mova de um lado para o outro da página. Sintaxe:
Leia mais1 Crie uma pasta (dentro do seu diretório) com o seu nome. 2. Se tiver dúvida pergunte o seu professor
i.exe FrontPage Criação de Home Page s PPaaggi innaa 1 Sobre FrontPage Parte 1 Front Page é uma ferramenta para criação e gerenciamento de web s.o aluno não necessita de nenhum conhecimento de programação
Leia maisGoogle Drive. Passos. Configurando o Google Drive
Google Drive um sistema de armazenagem de arquivos ligado à sua conta Google e acessível via Internet, desta forma você pode acessar seus arquivos a partir de qualquer dispositivo que tenha acesso à Internet.
Leia maisMANUAL DO INSTAR-MAIL 1.0. Pagina de login e senha do Instar-Mail
1º Passo: Acesse o seguinte endereço http://www.smtp.com.br/sg/cliente/logar.php MANUAL DO INSTAR-MAIL 1.0 2º Passo: Será apresentada uma tela solicitando o seu login e senha: Sendo assim: Digite o seu
Leia maisManual do Plone (novo portal do IFCE)
Manual do Plone (novo portal do IFCE) Dezembro/2015 Índice Como criar submenus... 3 Como criar banner rotativo... 4 Como remover um banner... 5 Como criar uma notícia... 6 Como inserir imagem na notícia...
Leia mais