default-logo


06.97.60.13.05
info@archimedeinformatica.it

Corso Progettista Web: Web Design + Programmatore Web

  • Il Progettista Web è il top dei corsi che il nostro istituto propone. E' l'unione di due corsi: Web Design e Programmazione web. Grazie a questo Master sarete in grado di proporre una soluzione completa di supporto nell'ottica di risolvere problematiche e di proporre soluzioni alternative per realizzare piattaforme professionali di supporto ai servizi web. Saprete cosi realizzare un sito Web completo sia dal punto di vista grafico che dal punto di vista della programmazione. Un corso per lo sviluppo di siti web,completo a 360 gradi.
  • L'obiettivo del corso è la formazione di una figura in grado di realizzare portali e siti web di alta qualità tramite la creazione di pagine dinamiche. Lo sviluppo di interfacciamenti a database, form...sono solo alcuni degli aspetti che riguardano l'ingegnerizzazione di un sito web, la cui realizzazione è possibile grazie alla diffusione e all'utilizzo delle tecnologie di Script Lato Client e lato Server.
  • Prenota ora! Segui online!

Programma

Corso Progettista Web

  • Html 5 e CSS 3
  • WordPress
  • Adobe Photoshop
  • Adobe Dreamweaver
  • Responsive Web Design + Bootstrap
  • Database relazionali + MySQL
  • PHP + Symfony3
  • Test Driven Development
  • REST API
  • Sistemi di versioning: GIT
  • Javascript e Jquery
  • AJAX, XML, JSON

Durata del corso, giorni e orari di frequenza e prezzo del corso sono riportati a fondo pagina.

 

Concetti generali sul Web

Introduzione al World Wide Web

  • Tipologia di siti, dinamici e statici
  • Tipologie e linguaggi utilizzati
  • Differenze tra l’ Html e i Css e i linguaggi di programmazione
  • Funzionamento delle pagine Web
  • L’Html – Hyper Text Markup Language tag e sintassi, dall’xhtml all’html5
  • L’html5 e l’evoluzione del Web
  • Iter di costruzione di un sito Web
  • Pubblicizzare il vostro sito Web

 

HTML5

Lo scopo dell’HTML (Hyper Text Markup Language) è quello di fornire attraverso dei Tag o contrassegni la struttura e una formattazione del documento. Tramite questi Tag il Browser saprà come rappresentare la pagina Web.

  • Storia dell’HTML5 e differenze con XHTML e HTML4
  • I tag ereditati dalle versioni precedenti dell’Html
  • Tag per la formattazione del testo, elementi in linea e di blocco
  • Inserimento delle immagini  e immagini di sfondo
  • La creazione di link tag e attributi
  • Le tabelle tag e attributi
  • I nuovi elementi introdotti in HTML5, il concetto di tag semantico
  • Elementi Header e Footer
  • Elementi Section e Article
  • Elemento Hgroup
  • La navigazione semantica con l’elemento Nav
  • Elemento Aside
  • Integrazione tra i nuovi e vecchi tag
  • Le form e la multimedialità con HTML5
  • Il tag Audio e Video e i loro attributi
  • formati audio e video supportati
  • I form
  • Le novità per le form in HTML5
  • Nuove possibilità per la validazione delle form
  • Integrazione tra i tag vecchi e nuovi nei form
  • Esempio di un form completo
  • Le funzionalità avanzate
  • Il supporto dei browser

 

I Fogli di stile  Css 3

  • Definizione dei Css, funzionalità e rapporto con l’Html
  • Compatibilità dei Css con i Browser
  • Tipologie dei Css (in linea, interni, esterni) e loro regole e sintassi
  • Categorie delle dimensioni nei Css
  • Dimensioni nei Css
  • I selettori Css e pseudo-selettori
  • I nuovi selettori Css3, le pseudo classi strutturali
  • La struttura a “cascata” dei Css
  • Gestire i Css, inserimento, cancellazione, modifica
  • I Css e i testi, regole di formattazione, i colori, font e stili del testo
  • Formattazione del testo generale e eccezioni stilistiche
  • Utilizzo del selettore discendente
  • Elementi di blocco ed elementi in linea, l’importanza del tag <div>
  • Colori di sfondo nella pagina web e nei singoli oggetti con i Css
  • I bordi Css, le gabbie
  • Margini esterni (proprietà Margin), spaziature interne (proprietà Padding)
  • Applicazione delle proprietà di margini e spazi interni alle gabbie dei testi e alle immagini
  • Nidificazione dei tag Html e gestione dei Css, l’importanza della proprietà overflow
  • Gestione delle dimensioni: altezza e larghezza concetto di Box model
  • Immagini di sfondo con i Css
  • Selettori avanzati: le Classi e selettore ID
  • Esempi di utilizzo dei selettori class e ID
  • Aspetto dei Link con i Css
  • Creare una pulsantiera verticale con i Css
  • Creare una pulsantiera orizzontale con i Css, differenze tra gli elementi in linea e quelli di blocco
  • Css esterni, creazione di un file .css, collegare il file .css alle pagine html
  • Affiancare le gabbie sulla pagina la proprietà float
  • Caratteristiche del float, utilizzo della proprietà clear
  • Esempi di affiancamento
  • Progettare un semplice layout da Css

 

Cenni all’utilizzo dei Css con i form

  • I fogli di stile CSS3, le nuove proprietà
  • I colori rgba, arrotondare i bordi dei box, inserire ombreggiature
  • Sfondi multipli per pagine web e gabbie
  • I gradienti di colore Css3
  • Le nuove possibilità per l’utilizzo dei font
  • Variazioni al concetto di box model
  • Le transizioni Css3

 

WordPress

  • Introduzione a WordPress.
  • Installazione di WordPress
  • WordPress Opzioni (wordpress config) e WordPress Opzioni tema (tema config)
  • Creazione di pagine e post
  • La Bacheca di WordPress
  • Installare Temi
  • i Plugin e i widget
  • Creazione di menu (menu a discesa, genitore e voci di menu per bambini)
  • Ottimizzazione SEO – permalink
  • Categorie e tag
  • Gestione di immagini e contenuti
  • Barre laterali e le zone Widget
  • Plugins / Installazione (moduli di contatto, gestione dei contenuti e SEO plugin)
  • Account utente e Privilegi Account
  • Esaminare della struttura dei file di WordPress
  • Formattazione Html
  • Personalizzazione dei temi con l’editor CSS
  • WordPress Tags
  • Modifica del Layout e Personalizzazione
  • Interpretazione del Codice Html

 

Adobe Photoshop 

Photoshop è uno dei più potenti programmi per il fotoritocco e  la progettazione e realizzazione di elementi grafici sia per la produzione cartacea che per il Web. In quest’ultimo ambito, esso permette di modificare le immagini, ottimizzarle, esportale, di creare un logo, dei menù, pulsanti per effetti di rollover. Una soluzione pressoché completa per la realizzazione grafica del sito Web.

  • Introduzione alla grafica per il Web
  • I formati grafici, grafica pittorica (Raster) e grafica vettoriale
  • Il pannello degli strumenti di Photoshop, l’interfaccia del software
  • Modifica di oggetti bitmap
  • Le selezioni, gestione e modifica, le selezioni sfumate
  • La finestra dei livelli
  • Riempimenti e sfumature
  • Copia, taglia, incolla
  • Usare i gradienti di colore in Photoshop
  • Importare immagini dal Web, risoluzione dei problemi
  • Modifica e ridimensionamento dell’immagine
  • Semplici ritocchi alle immagine (luminosità, contrasti, colori)
  • Alcuni esempi di effetti grafici sulle immagini
  • Utilizzare i filtri, selezioni ed immagini
  • Il testo e sua formattazione
  • Integrazione del testo con gli altri elementi grafici
  • Gli effetti di livello
  • Esportazione delle immagini nei formati per il Web e loro caratteristiche
  • La finestra di Photoshop “Salva per il web”
  • Realizzazione di pulsanti, icone ed altri elementi grafici
  • Le forme vettoriali di Photoshop, creare icone
  • Creazione di una gallery fotografica, preparazione delle foto
  • Creazione dell’intestazione grafica di un sito
  • Utilizzo del formato .png per la grafica del sito
  • Preparazione di un layout web

 

Adobe Dreamweaver 
Dreamweaver è uno dei più potenti software per editare HTML, ma al tempo stesso è estremamente facile da utilizzare, ed altamente professionale. Esso è uno dei software più usati dai Web Design professionisti, permette infatti di realizzare pagine Web complete in tempi brevissimi con il metodo conosciuto col nome WYSIWYG (in inglese “what you see is what you get”).

  • L’interfaccia grafica di Dreamweaver
  • Definizione del sito
  • L’importanza della “definizione sito” per un corretto lavoro sul Web
  • Definizione del sito, l’FTP e lo spazio Web
  • Creazione e salvataggio di una pagina Web, i modelli di pagina di Dreamweaver
  • Anteprima nel browser, impostare i diversi browser
  • Visualizzazione codice e visualizzazione grafica, inserire i commenti
  • La gestione del testo e formattazione veloce
  • Intestazioni, Titoli ed elenchi puntati e numerati
  • Gestione della pagina Web, margini e colori
  • Inserimento di immagini e gestione nel progetto
  • Gestione dei Css in Dreamweaver
  • I collegamenti ipertestuale, i Link e loro tipologie (interni, esterni, email, file scaricabili, immagini)
  • Le modalità di creazione dei Link in Dreamweaver
  • Inserire le tabelle
  • I Form

Il software Dreamwever sarà usato come supporto visivo e interfaccia codice durante il corso per svolgere i punti elencati relativi ai moduli dedicati Html 5 e CSS 3

Responsive web design + Bootstrap

Sempre più device compongono il panorama tecnologico ed ognuno ha una differente peculiarità. Il responsive web design cerca di fornire uno standard per realizzare applicativi consultabili da qualsiasi dispositivo. Bootstrap è una libreria che consente di scrivere i propri frontend in ottica responsive.

  • L’attributo HTML media: realizzare stili differenti per differenti media
  • Le Media QueriesCSS3 per gestire schermi di diverse grandezze
  • Definire i breakpoint con le Media Queries CSS3
  • Da un layout multicolonne ad un layout monocolonna

 

Bootstrap

  • Bootstrap: il framework CSS/JS
  • Differenze tra bootstrap 3 e bootstrap 4
  • Responsive bootstrap
  • Bootstrap per il mobile
  • Elementi di bootstrap
  • CSS di base e avanzato
  • Componenti JS (Accordion, Tabs, Tooltips, Popover, Carousel…)
  • Personalizzazione di bootstrap
  • Temi
  • Componenti aggiuntivi di terze parti

 

Database relazionali + MySQL

Un database in senso generale è un sistema di raccolta persistente di dati. I database relazionali rappresentano una tra le tipologie di database più diffuse e consolidate nel mondo informatico. Nell’architettura web il database è un componente fondamentale poiché in esso sono memorizzate tutte le informazioni mostrate agli utenti.
MySQL è un database relazionale molto utilizzato, stabile e performante. Esso sarà il database utilizzato per la creazione dei progetti.

  • Progettazione logica e fisica di un database
  • Il linguaggio Sql
  • PhpmyAdmin: lo strumento di Management per MySql
  • Creare un database
  • Lavorare con le tabelle
  • Creare, modificare e cancellare una tabella
  • Gestire i campi delle tabelle
  • I tipi di dato
  • Inserire, modificare e cancellare un record
  • Le relazioni fra i dati: la Chiave primaria (primary key) e la Chiave esterna (foreign key)
  • Tipi di relazione: uno a uno, uno a molti, molti a molti
  • Indicizzare le tabelle per migliorare le performance di accesso ai dati
  • Le query di selezione
  • Legami tra i dati: Inner Join e Left Join
  • Filtri sui dati con operatori algebrici, logici e letterali
  • Ordinamenti e raggruppamenti
  • Query di aggiornamento: inserimento, modifica e cancellazione
  • Funzioni interne del linguaggio Sql: (sum, min, max, avg, count, replace, substring)
  • Le Viste: memorizzare una query nel database
  • Le query di Unione

 

PHP 

PHP è uno dei linguaggi di programmazione più utilizzati al mondo soprattutto per il web. Il PHP è un linguaggio molto maturo che ha subito un miglioramento costante negli anni. Grandi portali come facebook lo utilizzano per la realizzazione del loro codice.

  • Linguaggi di programmazione e programmazione ad oggetti
  • I file di configurazione (.ini)
  • Le variabili e i tipi di dato
  • Operatori aritmetici, operatori di confronto e operatori logici
  • Istruzioni condizionali
  • Istruzioni cicliche
  • Funzioni
  • Ambito delle variabili
  • Lavorare con i moduli in Php
  • Le variabili superglobali $\_POST, $\_GET, $\_SESSION e $\_COOKIE
  • Gestione del Filesystem con PHP:
  • Creare, modificare, cancellare e spostare le cartelle
  • Creare, modificare, cancellare e spostare i file
  • Leggere e scrivere in un file
  • Listare il contenuto delle cartelle
  • Scorrere l’albero delle directory
  • Upload di un file: metodi del Filesystem e del File Transfer Protocol (FTP)
  • PDO: gestione accesso al database

 

Symfony3

Symfony è un framework web scritto in PHP che consente allo sviluppatore di non dover reinventare la ruota ma di utilizzare una struttura standard per la creazione di siti web.

  • Introduzione al design pattern MVC
  • Installazione e configurazione
  • Creazione delle pagine
  • Routing
  • Controller
  • Template
  • Model + Doctrine ORM
  • Form
  • Creazione dei bundle

 

Test Driven Development

Il TDD (Test Driven Development) è un tecnica legata alle metodologie agili che prevede la scrittura dei test prima della scrittura della logica di business.
Tale approccio consente di ridurre drasticamente gli errori nel codice e di evitare la regressione del codice.

  • Introduzione all’approccio TDD
  • Differenza tra test unitari e test funzionali
  • Lavorare con il Test Client
  • Crawler

 

REST API

Le REST API consentono di esporre i dati della propria applicazione in una modalità “machine-friendly”. Ciò consente il consumo dei dati da qualsiasi tipo di device: desktop, mobile.

  • Cos’è una REST API
  • URI
  • Metodi HTTP
  • Nomi delle risorse
  • Restful

 

Sistema di versionamento: GIT

Un software di versionamento è il compagno di viaggio necessario per qualsiasisviluppatore. Tale software consente di monitorare il proprio lavoro,confrontare il proprio lavoro con altri colleghi, e condividerlo. Git sta diventando il sistema di versionamento standard poiché distribuito e altamente performante.

  • Introduzione ai sistemi di versioning
  • Sistema di versioning distribuito
  • Creazione di un repository
  • Lavorare con il repository locale
  • Lavorare con il repository remoto
  • Creazione dei branch
  • Accenno ai gitflow

 

Javascript e Jquery

Le tecnologie lato client come JavaScript e Jquery consentono di arricchire una pagina web con del codice eseguito sul browser dell’utente che sta navigando.

  • Il linguaggio Javascript e il DOM
  • Introduzione a Javascript
  • Sintassi di base: variabili, tipi
  • Istruzioni condizionali: if, switch
  • Istruzioni cicliche: for, while
  • Operatori aritmetici, di confronto, logici
  • Funzioni
  • Oggetti principali del browser gestiti tramite javascript: window, document, location, history
  • Il DOM (Document Object Model): elementi, attributi, nodi testuali
  • Funzioni per l’interazione con il DOM
  • Manipolare gli stili CSS e il contenuto degli elementi con Javascript e DOM: le proprietà style, innerHTML
  • Introduzione alle librerie jQuery
  • Inglobare in una pagina web le librerie jQuery
  • L’operatore $ e la sintassi di base jQuery: selettori, attributi, classi e metodi base
  • Le funzioni html(), text(), css()
  • Manipolazione degli elementi della pagina e dei CSS: le funzioni append() e appendTo()
  • Effetti e Animazioni: spostare e animare gli oggetti della pagina
  • Le funzioni hide(), show(), fadeIn(), fadeOut(), animate()
  • Le librerie jQuery UI: Datepicker, Accordion, Tabs

 

AJAX, XML, JSON

La comunicazione asincrona (AJAX) consente di creare applicativi come Gmail e Google Maps. Vedremo nel corso come utilizzare tale tecnologia per costruire pagine moderne che non hanno necessita di ricaricare tutta la pagina per caricare un insieme limitato di dati.

  • Introduzione ad AJAX
  • Interazione asincrona client – server
  • Oggetto HTTPRequest
  • Query asincrone
  • La funzione $.ajax()
  • Introduzione ad XML
  • Introduzione a JSON
  • Gestione delle risposte in formato HTML
  • Gestione delle risposte in formato XML
  • Gestione delle risposte in formato JSON

Dettagli sul corso

Inizio Corso: web design 11/02/2019  Lunedì e mercoledì 14:30 - 16:30 - Programmatore web: 11/02/2019 Lunedì 17-19, mercoledì 16:30 -19 e da metà giugno a metà luglio anche il venerdì dalle 16 alle 19
Durata corso di gruppo ( 4 - 8 persone): 210 ORE -
Prerequisiti: nessuno
Gli allievi più meritevoli verranno segnalati alle aziende per stage e inserimento lavorativo
Costo corso collettivo : € 2160,00 + iva (invece di € 2500,00 + iva) -Modalità di pagamento: Pagamento agevolato 4 rate mensili da € 540,00 + iva oppure POSSIBILITA DI FINANZIAMENTO TRAMITE Agenzia di CONSEL Spa - Società del Gruppo Banca Sella fino a 18 mesi - OFFERTA VALIDA PER LE ISCRIZIONI ENTRO IL 14/12/2018 - UNA POSTAZIONE PER CIASCUN PARTECIPANTE.
+ gratis connessione piattaforma E-learning per riascoltare tutte le lezioni di web design (HTML, CSS, Wordpress, Photoshop, Dreamweaver e php Mysql) - POSSIBILITA' DI ACQUISTARE A PREZZI AGEVOLATI, E SOSTENERE IN SEDE GLI ESAMI DI CERTIFICAZIONE UFFICIALI ADOBE DREAMWEAVER E PHP ON MYSQL  OPPURE L'ESAME MICROSOFT MTA Intro to Programming HTML and CSS (98-383) - ESAMI IN SEDE
Se porti un amico, sconto del 10% se iscritti allo stesso corso
Prima di passare in segreteria è consigliabile fissare un appuntamento -
Ad ogni alunno sarà fornita una Username ed una password per accedere all'area riservata del sito dell’ Archimede informatica dove è possibile seguire i video tutorial delle lezioni svolte in classe (web design e php), in modo da poter risentire a piacimento la lezione o recuperarla in caso di assenza. Inoltre è presente materiale didattico in continuo aggiornamento (es. test di autovalutazione) e un forum sul quale poter contattare il docente per chiarire dubbi e fare domande dal quale si avrà una risposta entro 24 ore lavorative. Su questa piattaforma on line saranno quindi disponibili: • Videolezioni (ripetizione delle lezioni svolte in classe di Web Design e php) • Manuali, file .pdf • Esercitazioni • Quiz auto valutativi • Servizio di Tutoraggio
Sconti per due o più iscritti contemporaneamente allo stesso corso
torna su
Importante
Archimede informatica si riserva il diritto di posticipare le date di inizio dei corsi qualora non si raggiunga il numero minimo necessario per far partire il corso collettivo