12
Profissão Front-End

Profissão Front-end

Embed Size (px)

DESCRIPTION

Conheça a profissão front-end. O que é front-end? O que o profissional front-end faz? Principais ferramentas e tecnologias usadas pelo front-end. HTML - CSS - JavaScript. Modelo conceitual das etapas do front-end.

Citation preview

Page 1: Profissão Front-end

Front-End

Profissão Front-End

Page 2: Profissão Front-end

Front-End

O que é front-end?

Front-end é a parte visível do site é a montagem do layout em estruturas compatíveis para o uso em browsers (programa de navegação da internet como o Firefox, Chrome, Internet Explorer, etc), tornando sua interface inte-rativa com o usuário através de clique, campos de textos ou toque na tela.

Também é responsável pelo comportamento do site em diversos nave-gadores e plataformas como desktop, notebooks, tablets e celulares.

- - - - - - - - - - - -

Page 3: Profissão Front-end

Front-End

- - - - - - - - - - - -

O que o profissional front-end faz?

O profissional front-end é quem dá vida ao layout (no formato de imagem), para códigos que serão interpretados por nave-gadores, tornando interativo e usual. Também é responsável pela otimização das interfaces e:

- Assegurar compatibilidade em vários navegadores;- Produzir código limpo, bem documentado e estruturado;- Criar páginas web rápidas;- Seguir os padrões e tendências da web;- Aplicar técnicas de SEO (Search Engine Optimization),otimização de busca.

Page 4: Profissão Front-end

Front-End

- - - - - - - - - - - -

Principais ferramentas e tecnologiasusadas pelo front-end

As principais ferramentas usadas pelo front-end são programas editores de códigos e textos, estes são alguns dos programas que facilitam a edi-ção de texto: Dreamweaver, Notepad++, Sublime entre outros.

As principais tecnologias são: HTML, CSS e JavaScript sendo que existem muitos profissionais front-end que não fazem o uso do JavaScript, apenas formata o site preparado-o para a programação.

Page 5: Profissão Front-end

Front-End

- - - - - - - - - - - -

< HTML >

O que é HTML?

É a abreviatura de HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto. São códigos marcado-res que dizem ao navegador como deve ser apresentado. É a arquitetura e o corpo da aplicação.

No HTML encontramos tags como: div, table, form entre outras, para que o CSS e a programação seja aplicada conforme está estruturado.

Page 6: Profissão Front-end

Front-End

HTML - Modo de visualização

- - - - - - - - - - - -

Page 7: Profissão Front-end

Front-End

- - - - - - - - - - - -

{ CSS }

O que é CSS?

Cascading Style Sheets que significa Folhas de Estilo em Cas-cata. São códigos de estilização usados na parte visual do site como: cores, formas, fontes, botões, campos de textos entre outras.

O CSS lê as marcações do HTML e altera a forma de exibição do conteúdo apresentado no navegador.

Page 8: Profissão Front-end

Front-End

CSS - Modo de visualização

- - - - - - - - - - - -

Page 9: Profissão Front-end

Front-End

- - - - - - - - - - - -

( JavaScript )

O que é JavaScript?

Trata-se de uma linguagem de programação do lado do cliente (client-side), e interage com o usuário sem a necessidade deste script passar pelo servidor.

Com Javascript podemos criar efeitos especiais nas páginas e definir interatividades com o usuário. Tem como as principais ações: efeitos dinâmicos e ações interativas.

Page 10: Profissão Front-end

Front-End

- - - - - - - - - - - -

JavaScript - Modo de visualização

Page 11: Profissão Front-end

Front-End

- - - - - - - - - - - -

Modelo conceitual das etapas do front-end

HTML = Marcação CSS = Estilo JavaScript = Comportamento

Page 12: Profissão Front-end

Front-End

- - - - - - - - - - - -

Marconi A. Pacheco

Bacharel em Design - FUCAPI - AM. Coordenação de Graduação em Design de Interface Digital.

Experiência Profissional:Desenvolvimento em projetos web sites, arquitetura de informação, wireframes, layouts e front-end.

Projetos gráficos e comunicação visual para mídias impressas de pequeno e grande formato.