Empreendedorismo, SEO, tecnologia e motivação
Curso de Web
HTML – Primeiros passos
34 years ago
by Renan Lima
in Curso de Web
Nesta video aula vamos fazer nossa primeira página web, usando o Bloco de notas. Vamos trabalhar com diversas tags que vimos no Curso de Web 003.Escolhi não colocar no blog o código usado no vídeo, para que vocês os memorizem.
Agora as videoaulas estão com Audio.
Veja abaixo a video-aula:
Curso de Web 003 – Conhecendo novas Tags
74 years ago
by Renan Lima
in Curso de Web
Hoje, em nossa 003 web-aula vamos conhecer algumas tags html.
Abra seu editor preferido e escreva: WEB 2.0
É brincadeira. Alias, você sabe o que é web 2.0?Se quiser saber mais a respeito: http://pt.wikipedia.org/wiki/Web_2.0
Voltemos a nossa aula. Vou falar agora de algumas tags importantes do html.
<br /> Quebra de linha
<p> </p> Parágrafo
<b> </b> Negrito
<strong> </strong> Negrito
<i> </i> Italico
<em> </em> Italico
<span> </span> É utilizada para a configuração de trechos de parágrafos, muito usado com o css quando você quer mudar as propriedades de um elemento neutro.
<div> </div> Bloco contêiner que vamos utilizar muito durante nosso trabalho. Sem o css, o uso da div é inútil.
<blockquote> </blockquote> É o responsável por dar um efeito de endentação, como se você teclasse o TAB no Word, mas este pega em todo o bloco de texto.
Essas tags são as mais usadas. No decorrer das aulas vamos ver mais tags.
Agora vou escrever um código que use todos essas tags.
Obs: Não vamos usar o Span nem a Div antes de vermos o Css. Por tanto, veremos estes bem em breve.
Coloque o código abaixo em seu editor de HTML e salve-o como html para ver o resultado.
<html>
<head>
<title>Testando Tags HTML</title>
</head>
<body>
Estamos aqui usando diversas tags, testamos agora o <b>negrito</b> e o <i>itálico</i>.<br />
<p> Vemos também a tag parágrafo, muito utilizada para organizar um texto. </p>
<blockquote>
O blockquote é muio interessante, perceba que ele dá um espaço parágrafo em todo o texto, não só na primeira linha como a tag parágrafo. Muito útil esta tag.
</blockquote>
</body>
</html>
Testou em seu navegador?
Você deve estar vendo algo semelhante a isto:
Faça seus testes e veja a melhor forma de usá-los. Qualquer dúvida é só postar aqui no blog.
Curso de Web 002 – Criando páginas HTML
124 years ago
by Renan Lima
in Curso de Web
Estamos aqui em nossa segunda web-aula. Como eu disse no post anterior, no post de hoje vamos começar a programar.
Inicialmente vamos estudar html, nosso ponto de partida. Vamos estudá-lo já da forma correta, vamos ver alguns de seus aspectos principais, testar alguns códigos e compreender seus significados.
Como assim programar html da forma correta?
Pois bem, é muito fácil programar em html, você coloca qualquer tag(depois vamos ver isso bem de perto) e a pagina funciona.
Mas cada tag tem seu significado, por isso o conceito tão famoso chamado web-semântica, Semântica significa significado, com isso queremos dizer que cada tag tem um significado.
Essa tal semântica ajuda ao robô do google encontrar nosso site.
Está com mais dúvidas ainda?
Ok, relaxe e deixe a web fluir em você. Ops! Fluir com você. Ops! Fluir sem você. Ahh!
Deixa apenas a web fluir. 
–
Como eu disse, vamos começar a programar. Abra seu dreamweaver, ou algum outro editor de html e digite:
<html>
<head>
<title> </title>
</head>
<body>
</body>
</html>
Nota: No caso do dreamweaver, ao criar uma pagina html, exclua todo o conteúdo da pagina e digite o código acima.
Observe que este conjunto de tags, este código digitado acima é a estrutura de uma página web, poderíamos ficar aqui por horas só falando sobre suas características, mas nesta aula vamos falar somente das características principais.
O que é uma tag?
Tag consiste em estrutura de linguagem de marcação, breve instruções que tem inicio e fim.
O que é linguagem de marcação?
Envolve a codificação simples de seqüências de dados em um arquivo de computador no formato texto-puro.
Simplificando, consiste em marcação de instruções pré-definidas que tem inicio e fim.
Caracteristicas
<html> = Esta tag é a principal, é dentro dela que entra todos os outros dados do html. Todos as outras tags html devem estar localizadas dentro da tag html.
Você colocar por exemplo a tag <br>(quebra de linha) antes da tag html, vai até funcionar, mas não é recomendável e como estamos aqui para aprender o html da forma correta, não iremos fazer desta forma.
<head> = Esta tag comporta diversas outras tags especiais, além de comportar tags que incluem códigos externos.
<title> = Esta tag é o título da página literalmente e o que você colocar dentro dela, aparecerá no topo do navegador.
<body> = Esta é o corpo da pagina, onde todo o conteúdo de uma página web deve ficar.
Agora experimente colocar o seguinte código em seu editor:
<html>
<head>
<title>Aprendendo HTML</title>
</head>
<body>
Olá mundo!
</body>
</html>
Salve-o com a extensão .htm e abra esta página.
Você verá escrito na página: Olá mundo!
Observe que no topo do navegador e não da página, está escrito Aprendendo HTML.
Simples não?
Vamos brincar um pouco com esse código, coloque a tag <b> em volta de onde está escrito Aprendendo HTML. Lembre-se de fechar esta tag.
Ficando dessa forma: <b> Aprendendo HTML </b>
Nota: Para abrir uma tag você usa <tag> e para fechar usamos uma barra na tag ficando dessa forma: </tag>
Toda tag que é aberta precisa ser fechada.
Salve o mesmo documento e abra-o no navegador. Repare que o texto que adicionamos anteriormente foi posto em negrito.
Como prometido na aula anterior, já começamos a programar uma página web, agora você já sabe como inicia a criação de um website. Ainda tem muita coisa pela frente, basta corrermos.
Na próxima aula vamos ver muitas outras tags.
Até lá
Curso de Web 001 – Arrumando a mesa do escritório
74 years ago
by Renan Lima
in Curso de Web
Hoje está começando um curso onde vou mostrar a vocês como se tornar um desenvolvedor web.
O curso é gratuito, mas aceito doações.
Você pode deve comentar cada post (Aula), dando sugestões e até mesmo críticas.Vou começar do zero, indo do básico para o avançado.
Pretendo posteriormente fazer VideoAulas para facilitar o entendimento.
Para tudo ficar mais claro, vamos começar do inicio. Sim! Do inicio.
Só para você ir se preparando, as coisas não entram na sua cabeça do nada, é preciso estudar, e se quiser ser muito bom tem que estudar muito.
Mas é fácil, desde que você se dedique e principalmente goste de web. Pra falar a verdade é indispensável que você ame web.
Você não a ama?
Tudo bem, ela vai te seduzir logo.
Vamos começar a falar como gente grande, nada de bloco de notas. Neste post vamos falar dos softwares usado por profissionais e que são necessários para trabalhar com web.
Necessário na verdade não é, mas eles lhe dão uma assistência que facilita muito e te dá maior performance no desenvolvimento de um projeto.
Na web podemos trabalhar com programação, design, banco de dados, diagramação de informação, Modelação 3D, multimídia e outras coisas mais.
Vou falar sobre os melhores softwares para se utilizar na programação e no desenvolvimento visual para web.
Programação
Mundialmente usado este software da Adobe, te possibilita trabalhar com diversas linguagens de programação, te dá auxílio na produção de um projeto e lhe fornece ferramentas úteis para o desenvolvimento.
Zend Development Environment
Muito conhecido por profissionais de Internet. Usado por programadores avançados e permite uma ótima produtividade para programadores em PHP.
Design
Photoshop
O melhor editor de imagens do mundo, da Adobe, usado por profissionais de altíssima qualidade e por crianças de 10 anos para fazer montagens simples – É verdade!
Fireworks
Um software simples, também da Adobe, que supri a grande maioria das necessidades quando se está desenvolvendo para web.
Em meu trabalho, eu uso o Fireworks e quando preciso fazer algo mais complexo uso o Photoshop.
Todos os softwares acima são pagos, mas pode os encontrar no www.superdownloads.com.br em versão Trial, onde você poderá usar o software gratuitamente por um mês.
Na próxima aula já vamos começar programando bem leve com XHTML, vamos estudar Semântica, conhecer o CSS e bater um papo com o Javascript.
Saindo na frente!!
Para você que está com sede de aprender e quer se adiantar, leia os textos dos links abaixo. Siga esta ordem.
Comentários recentes