SlideShare une entreprise Scribd logo
1  sur  49
Télécharger pour lire hors ligne
Workshop Tecnologia Web
Workshop Tecnologia Web
.
Desenvolvedor fanático por programar;
Formado em ciências da computação,
Fundador da Code By & Cuide.me;
Mais de 30 projetos online;
Trabalho com diversas linguagens web;
Primeiro a implementar OpenERP no brasil;
Primeiro em introduzir E-commerce Responsivel na VTEX
Certificado pela Google em Google Analytics;
Mais: br.linkedin.com/in/fellipeg
.
.
.
CLIENTE
SERVIDOR
Workshop Tecnologia Web
HEADER
FOOTER
NAV
ARTICLE
SECTION
FIGURE
IMG
CAPTION
UL
LI
H1
P
........
<header role="menu">
<nav>
<ul>
<li> Olá</li>
</ul>
</nav>
</header>
<article>
<section>
<h1>TITULO</h1>
<h2>SUBTITULO</h2>
<p><strong>CONTEUDO</strong></p>
<time>22 de Janeiro de 2015</time>
<section>
</article>
<footer>
Final da Página
</footer>
CLASS
ID
ROLE
DATA
TITLE
ALT
SRC
STYLE
SEMPRE QUE ABRIR UMA TAG FECHE
NUNCA ESQUEÇA DA ACESSIBILIDADE
se não seu código ficará igual esse desenho
Sim no HTML!
Workshop Tecnologia Web
Workshop Tecnologia Web
HTML5
Seletores Propriedades
Workshop Tecnologia Web
@FONTFACE – SIM FONTS NA WEB
Border-radius – Bordas Arredondadas
RGBA
BOX SHADOW
TEXT-SHADOW
FILTERS
LINEAR GRADIENT
MEDIAQUERIES – PRINT, ALL, SCREEN, TV, max-Width, min-width
Transitions
INSERT TEXT
-WEB-KITS
NULL
SEMPRE QUE FAZER UMA APLICAÇÃO WEB
SE DER PROBLEM, NÃO USE HACKS CORRIJA SEU CÓDIGO, TÁ BUGADO
CS3
Workshop Tecnologia Web
Definindo variáveis e loops
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
ISSO SÓ COLOCANDO DUAS TAGS DO BOOTSTRAP
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
RUBY
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web
Workshop Tecnologia Web

Contenu connexe

Tendances

Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...
Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...
Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...Paulo Fernandes
 
Android – fullscreen
Android – fullscreenAndroid – fullscreen
Android – fullscreenReuel Lopes
 
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 Conteúdo
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 ConteúdoComo Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 Conteúdo
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 ConteúdoFran-Oliveira-LW
 
Instalando o google chrome
Instalando o google chromeInstalando o google chrome
Instalando o google chromeIncubadoraelc
 
Dicas para-blogueiros-iniciantes
Dicas para-blogueiros-iniciantesDicas para-blogueiros-iniciantes
Dicas para-blogueiros-iniciantesPaulo Dantas
 
Primeiros Passos no Magento Commerce
Primeiros Passos no Magento CommercePrimeiros Passos no Magento Commerce
Primeiros Passos no Magento CommerceAndre Gugliotti
 
As 3 Fases do Negócio na Internet
As 3 Fases do Negócio na InternetAs 3 Fases do Negócio na Internet
As 3 Fases do Negócio na InternetMiguel Duarte
 
Programas Gratuitos para Vídeo Marketing
Programas Gratuitos para Vídeo MarketingProgramas Gratuitos para Vídeo Marketing
Programas Gratuitos para Vídeo MarketingSandra Borges
 
Tutorial Sobre Flogs
Tutorial Sobre FlogsTutorial Sobre Flogs
Tutorial Sobre Flogsneuza
 

Tendances (11)

Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...
Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...
Performance ao extremo para aplicações Web Mobile Apresentaçao por Alexandre ...
 
Android – fullscreen
Android – fullscreenAndroid – fullscreen
Android – fullscreen
 
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 Conteúdo
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 ConteúdoComo Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 Conteúdo
Como Divulgar Meu Blog – 20 Fontes de Tráfego Com Apenas 1 Conteúdo
 
Instalando o google chrome
Instalando o google chromeInstalando o google chrome
Instalando o google chrome
 
Oficina de blog 2012
Oficina de blog 2012 Oficina de blog 2012
Oficina de blog 2012
 
Dicas para-blogueiros-iniciantes
Dicas para-blogueiros-iniciantesDicas para-blogueiros-iniciantes
Dicas para-blogueiros-iniciantes
 
Primeiros Passos no Magento Commerce
Primeiros Passos no Magento CommercePrimeiros Passos no Magento Commerce
Primeiros Passos no Magento Commerce
 
As 3 Fases do Negócio na Internet
As 3 Fases do Negócio na InternetAs 3 Fases do Negócio na Internet
As 3 Fases do Negócio na Internet
 
Dicas Nova Vitrine
Dicas Nova VitrineDicas Nova Vitrine
Dicas Nova Vitrine
 
Programas Gratuitos para Vídeo Marketing
Programas Gratuitos para Vídeo MarketingProgramas Gratuitos para Vídeo Marketing
Programas Gratuitos para Vídeo Marketing
 
Tutorial Sobre Flogs
Tutorial Sobre FlogsTutorial Sobre Flogs
Tutorial Sobre Flogs
 

Similaire à Workshop Tecnologia Web

Aula de HTML5 - DevCampos - www.devcampos.com.br
Aula de HTML5 - DevCampos - www.devcampos.com.brAula de HTML5 - DevCampos - www.devcampos.com.br
Aula de HTML5 - DevCampos - www.devcampos.com.brDevCampos
 
Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)andreluizlc
 
Slide 02 introdução ao code igniter, utilização do bootstrap
Slide 02   introdução ao code igniter, utilização do bootstrap Slide 02   introdução ao code igniter, utilização do bootstrap
Slide 02 introdução ao code igniter, utilização do bootstrap Raniere de Lima
 
CODE N' TELL 17/02/2014
CODE N' TELL 17/02/2014CODE N' TELL 17/02/2014
CODE N' TELL 17/02/2014Rodrigo Donini
 
COMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLCOMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLRenato Melo
 
Projetando para WordPress
Projetando para WordPressProjetando para WordPress
Projetando para WordPressHaste Design
 
Tutorial sobre Bootstrap
Tutorial sobre BootstrapTutorial sobre Bootstrap
Tutorial sobre BootstrapIvo Calado
 
CEPUG 2 - Bem-vindo a Framework CodeIgniter
CEPUG 2 - Bem-vindo a Framework CodeIgniterCEPUG 2 - Bem-vindo a Framework CodeIgniter
CEPUG 2 - Bem-vindo a Framework CodeIgniterEric Silva
 
Orientações para implementação na rede colaborativa de aprendizagem do uca
Orientações para implementação na rede colaborativa de aprendizagem do ucaOrientações para implementação na rede colaborativa de aprendizagem do uca
Orientações para implementação na rede colaborativa de aprendizagem do ucarositalima
 
Desenvolvendo mvp com python
Desenvolvendo mvp com pythonDesenvolvendo mvp com python
Desenvolvendo mvp com pythonBruno Rocha
 
Criando e Usando Helpers
Criando e Usando HelpersCriando e Usando Helpers
Criando e Usando HelpersJoaoVagner
 
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...Rodrigo Branas
 
Desenvolvimento para a Web com CakePHP
Desenvolvimento para a Web com CakePHPDesenvolvimento para a Web com CakePHP
Desenvolvimento para a Web com CakePHPMarcelo Andrade
 
Web Development em 2015
Web Development em 2015Web Development em 2015
Web Development em 2015Emanuel Santos
 

Similaire à Workshop Tecnologia Web (20)

Curso de HTML5 CSS3 e JS
Curso de HTML5 CSS3 e JSCurso de HTML5 CSS3 e JS
Curso de HTML5 CSS3 e JS
 
Aula de HTML5 - DevCampos - www.devcampos.com.br
Aula de HTML5 - DevCampos - www.devcampos.com.brAula de HTML5 - DevCampos - www.devcampos.com.br
Aula de HTML5 - DevCampos - www.devcampos.com.br
 
Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)
 
Slide 02 introdução ao code igniter, utilização do bootstrap
Slide 02   introdução ao code igniter, utilização do bootstrap Slide 02   introdução ao code igniter, utilização do bootstrap
Slide 02 introdução ao code igniter, utilização do bootstrap
 
CODE N' TELL 17/02/2014
CODE N' TELL 17/02/2014CODE N' TELL 17/02/2014
CODE N' TELL 17/02/2014
 
COMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLCOMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTML
 
Html5 workshop
Html5 workshopHtml5 workshop
Html5 workshop
 
Curso de css
Curso de cssCurso de css
Curso de css
 
Projetando para WordPress
Projetando para WordPressProjetando para WordPress
Projetando para WordPress
 
Tutorial sobre Bootstrap
Tutorial sobre BootstrapTutorial sobre Bootstrap
Tutorial sobre Bootstrap
 
Html5 ass
Html5 assHtml5 ass
Html5 ass
 
CEPUG 2 - Bem-vindo a Framework CodeIgniter
CEPUG 2 - Bem-vindo a Framework CodeIgniterCEPUG 2 - Bem-vindo a Framework CodeIgniter
CEPUG 2 - Bem-vindo a Framework CodeIgniter
 
Orientações para implementação na rede colaborativa de aprendizagem do uca
Orientações para implementação na rede colaborativa de aprendizagem do ucaOrientações para implementação na rede colaborativa de aprendizagem do uca
Orientações para implementação na rede colaborativa de aprendizagem do uca
 
Desenvolvendo mvp com python
Desenvolvendo mvp com pythonDesenvolvendo mvp com python
Desenvolvendo mvp com python
 
Criando e Usando Helpers
Criando e Usando HelpersCriando e Usando Helpers
Criando e Usando Helpers
 
HTML Básico
HTML BásicoHTML Básico
HTML Básico
 
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
Minicurso - Desenvolvendo aplicações web com JavaScript e AngularJS - Estácio...
 
Apresentacao dev ops
Apresentacao dev opsApresentacao dev ops
Apresentacao dev ops
 
Desenvolvimento para a Web com CakePHP
Desenvolvimento para a Web com CakePHPDesenvolvimento para a Web com CakePHP
Desenvolvimento para a Web com CakePHP
 
Web Development em 2015
Web Development em 2015Web Development em 2015
Web Development em 2015
 

Plus de Fellipe Guimarães

Tendências Tecnológicas para 2022
Tendências Tecnológicas para 2022Tendências Tecnológicas para 2022
Tendências Tecnológicas para 2022Fellipe Guimarães
 
LGPDY - Lei Geral de proteção de dados
LGPDY - Lei Geral de proteção de dadosLGPDY - Lei Geral de proteção de dados
LGPDY - Lei Geral de proteção de dadosFellipe Guimarães
 
Tendências tecnológicas para 2019
Tendências tecnológicas para 2019Tendências tecnológicas para 2019
Tendências tecnológicas para 2019Fellipe Guimarães
 
VTEX PARTNER SUMMIT (VPS) - WRAP UP 2017
VTEX PARTNER SUMMIT (VPS) - WRAP UP  2017VTEX PARTNER SUMMIT (VPS) - WRAP UP  2017
VTEX PARTNER SUMMIT (VPS) - WRAP UP 2017Fellipe Guimarães
 
Facebook vs instagram - Fellipe Guimarães - Instaby
Facebook vs instagram - Fellipe Guimarães - InstabyFacebook vs instagram - Fellipe Guimarães - Instaby
Facebook vs instagram - Fellipe Guimarães - InstabyFellipe Guimarães
 
A importancia do insta marketing para negócios - Instaby
A importancia do insta marketing para negócios - InstabyA importancia do insta marketing para negócios - Instaby
A importancia do insta marketing para negócios - InstabyFellipe Guimarães
 
Instagram - Black Friday - 2015 - Fellipe Guimarães
Instagram - Black Friday - 2015 - Fellipe GuimarãesInstagram - Black Friday - 2015 - Fellipe Guimarães
Instagram - Black Friday - 2015 - Fellipe GuimarãesFellipe Guimarães
 

Plus de Fellipe Guimarães (8)

Tendências Tecnológicas para 2022
Tendências Tecnológicas para 2022Tendências Tecnológicas para 2022
Tendências Tecnológicas para 2022
 
LGPDY - Lei Geral de proteção de dados
LGPDY - Lei Geral de proteção de dadosLGPDY - Lei Geral de proteção de dados
LGPDY - Lei Geral de proteção de dados
 
Tendências tecnológicas para 2019
Tendências tecnológicas para 2019Tendências tecnológicas para 2019
Tendências tecnológicas para 2019
 
Technologies of 2018 - Codeby
Technologies of 2018  - CodebyTechnologies of 2018  - Codeby
Technologies of 2018 - Codeby
 
VTEX PARTNER SUMMIT (VPS) - WRAP UP 2017
VTEX PARTNER SUMMIT (VPS) - WRAP UP  2017VTEX PARTNER SUMMIT (VPS) - WRAP UP  2017
VTEX PARTNER SUMMIT (VPS) - WRAP UP 2017
 
Facebook vs instagram - Fellipe Guimarães - Instaby
Facebook vs instagram - Fellipe Guimarães - InstabyFacebook vs instagram - Fellipe Guimarães - Instaby
Facebook vs instagram - Fellipe Guimarães - Instaby
 
A importancia do insta marketing para negócios - Instaby
A importancia do insta marketing para negócios - InstabyA importancia do insta marketing para negócios - Instaby
A importancia do insta marketing para negócios - Instaby
 
Instagram - Black Friday - 2015 - Fellipe Guimarães
Instagram - Black Friday - 2015 - Fellipe GuimarãesInstagram - Black Friday - 2015 - Fellipe Guimarães
Instagram - Black Friday - 2015 - Fellipe Guimarães
 

Workshop Tecnologia Web