Learning Course is designed to support learners. When you make a purchase through one of our links, we may receive an affiliate commission.

Responsive Web Design + CSS avanzato – tecniche Front End

Overview

Gli argomenti e le tecniche affrontate in questo corso vertono su 2 macro-argomenti:

Responsive Web Design (RWD)

CSS avanzato

L’approccio è quello del learning by doing cioè imparare tramite degli esempi pratici ma se hai seguito degli altri miei corsi saprai già che il mio approccio in linea di massima consiste nello spiegarti in maniera decontestualizzata un argomento per poi calarlo in un esempio semplice e se poi riesco contestualizzarlo in un esempio più complesso.

Inoltre il corso è disseminato di assegnazioni ed esercizi in cui sarai sfidato a scrivere codice in prima persona per mettere in pratica quello che hai imparato. Il mio mantra è che nel web developing è fondamentale scrivere codice in autonomia per poter dire di avere effettivamente capito un argomento. Ovviamente tali esercizi saranno corredati dalla mia soluzione sia video che come codice in modo che tu possa confrontare la tua soluzione con la mia o visionare la soluzione nel caso in cui non sei riuscito a implementarla.

Per affrontare questo corso sarebbe ideale se hai già acquistato e studiato le tematiche dei miei corsi

1)HTML+CSS

2)Javascript base

Alcune delle tecniche di RWD e di CSS avanzato lambiscono gioco forza anche javascript ma se non hai questa skill puoi saltare gli argomenti inerenti Javascript senza inficiare la comprensione degli argomenti successivi.

Inoltre il corso è acquistabile anche da chi non viene dai miei precedenti corsi ed ha una conoscenza ,perlomeno basilare, di Html e Css ed è comunque interessato alle tematiche affrontate che vado a delinearti più nel dettaglio.

RWD significa rendere fruibile il nostro layout per qualunque tipo di device che sia uno smartphone,un tablet, un computer desktop,pc,tv ecc.
Esistono principalmente due approcci:

1)Desktop First
2)Mobile First

che verranno spiegati entrambi.  L’approccio principale per rendere un layout responsive sono le media query (anche se non è l’unico) e verranno prese in esame le principali media queries.

RWD non riguarda solo il layout ma anche la tipografia (dimensione del testo mutevole alle varie dimensioni dello schermo),le immagini,i video le tabelle ecc. cioè i singoli componenti delle pagine web e questi richiedono delle trattazioni ad hoc (ad esempio per le immagini si ricorre al tag picture e ad attributi particolari del tag img). Vedremo anche come usare le media queries lato javascript ed a cosa servono. Ti parlerò anche delle container queries per applicare delle regole non in base alla dimensione del layout ma in base alla dimensione di un elemento della pagina. Personalizzazioni per la stampa. Tecniche ed accorgimenti per rendere fruibile il sito anche nel mobile. Eventi javascript touch e pointer. Come gestire l’hover e il click e altri aspetti anche nei touch screen. Infine ti farò vedere alcune tecniche responsive che sono media-query free.

CSS avanzato è una miscellanea di tecniche e proprietà CSS non affrontate nel mio precedente corso HTML + CSS che ti consento di portare la tua conoscenza sul Css “at the next level”. Ti fornisco un elenco non esaustivo  di quello che vedremo:

  • Flexbox e Gridbox

  • Unità di misura svh,dvh e ch. Funzione clamp()

  • Pseudoclassi target e checked e vari ambiti di applicazione

  • Pseudoclassi after e before e vari esempi di applicazione.

  • Click del mouse in css

  • CSS sprite

  • Validazione di form quasi in html-css only

  • Web Icon Font (ad esempio Fontawesome) per usare delle icone

  • creare un Web Icon Font personalizzato con Fontello

  • z-index e stacking context

  • Font-size fluida

  • Proprietà margin,padding,border inline e block

  • Proprietà object-fit e object-position per realizzare thumbnail di immagini

  • Tecnica data uri ed svg inline

  • Formati di immagini e fallback

  • Libreria Modernizr

Tutto il codice è messo a disposizione ed è scaricabile.

Inoltre se qualcosa non ti dovesse essere chiaro o ci fossero dei problemi di solito rispondo abbastanza velocemente.

Aziende che fanno formazione in ambito web developing vendono percorsi di apprendimento che trattano gli argomenti presentati in questo corso a prezzi esorbitanti e molto spesso senza il grado di approfondimento che contraddistingue questo corso.
Tramite questo corso acquisteresti 2 corsi al prezzo di uno ad un prezzo irrisorio, non lasciarti sfuggire questa incredibile occasione.

Responsive Web Design + CSS avanzato - tecniche Front End

Reviews

John Doe
John Doe@username
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
John Doe
John Doe@username
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
John Doe
John Doe@username
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Scroll to Top