Réutiliser, partager et maintenir ses objets CSS : c’est possible !
Par ce terme j’entends l’organisation de feuilles de styles sous forme d’objet pouvant être : déclinées et surchargées, réutilisées pour d’autres projets, partagées avec d’autres développeurs et intégrateurs, maintenables au cours des différentes versions du site ou de l’application.
Krátká prezentace poslední verze Macdom preprocesoru. Ukázka syntaxe, předvedení práce s textem, selektory, makry, replikátorem a quick atributy. Seznam možností v nastavení a srovnánÍ s preprocesory jako je Haml, Jade a Slim.
Macdom lze nalézt na https://github.com/Machy8/Macdom.
The backbone of Progressive Web Apps has to be the ServiceWorker. A new browser paradigm, nearly every new browser api that controls network events, offline functionality, push notifications, background sync, and more are all powered by it. We will go over the path that led to the ServiceWorker design, as well as how to implement a number of cutting ed features on your website or webapp today!
Crea un tema compatibile con le ultime novità WordPressSkillsAndMore
Presentazione rilasciata al WordCamp Torino 2017 all'interno della quale vengono presentate le novità per creare un tema WordPress e migliorare il nostro lavoro da sviluppatori.
Trovi tutte le informazioni necessarie a questo indirizzo: https://skillsandmore.org/corso/crea-il-tuo-primo-tema-wordpress/
Personnaliser le back office de WordPress pour votre clientBenjamin Denis
[NEW] Le plugin WP Admin UI est disponible en freemium pour appliquer toutes les techniques décrites dans ses slides : http://wpadminui.net/
Créez une expérience unique pour vos clients en personnalisant de A à Z le back-office de WordPress.
Tout y passe : écran de connexion, widgets du dashboard, barre et menu d’admin…
Supprimez le superflu, ajoutez des options, réordonnez l’ensemble afin d’offrir à votre webmaster une interface adaptée à son besoin et une meilleure appropriation de l’outil.
WordPress en marque blanche ? Oui c’est possible ! C’est tout l’enjeu de cette conférence.
Réutiliser, partager et maintenir ses objets CSS : c’est possible !
Par ce terme j’entends l’organisation de feuilles de styles sous forme d’objet pouvant être : déclinées et surchargées, réutilisées pour d’autres projets, partagées avec d’autres développeurs et intégrateurs, maintenables au cours des différentes versions du site ou de l’application.
Krátká prezentace poslední verze Macdom preprocesoru. Ukázka syntaxe, předvedení práce s textem, selektory, makry, replikátorem a quick atributy. Seznam možností v nastavení a srovnánÍ s preprocesory jako je Haml, Jade a Slim.
Macdom lze nalézt na https://github.com/Machy8/Macdom.
The backbone of Progressive Web Apps has to be the ServiceWorker. A new browser paradigm, nearly every new browser api that controls network events, offline functionality, push notifications, background sync, and more are all powered by it. We will go over the path that led to the ServiceWorker design, as well as how to implement a number of cutting ed features on your website or webapp today!
Crea un tema compatibile con le ultime novità WordPressSkillsAndMore
Presentazione rilasciata al WordCamp Torino 2017 all'interno della quale vengono presentate le novità per creare un tema WordPress e migliorare il nostro lavoro da sviluppatori.
Trovi tutte le informazioni necessarie a questo indirizzo: https://skillsandmore.org/corso/crea-il-tuo-primo-tema-wordpress/
Personnaliser le back office de WordPress pour votre clientBenjamin Denis
[NEW] Le plugin WP Admin UI est disponible en freemium pour appliquer toutes les techniques décrites dans ses slides : http://wpadminui.net/
Créez une expérience unique pour vos clients en personnalisant de A à Z le back-office de WordPress.
Tout y passe : écran de connexion, widgets du dashboard, barre et menu d’admin…
Supprimez le superflu, ajoutez des options, réordonnez l’ensemble afin d’offrir à votre webmaster une interface adaptée à son besoin et une meilleure appropriation de l’outil.
WordPress en marque blanche ? Oui c’est possible ! C’est tout l’enjeu de cette conférence.
En muchas ocasiones, necesitaremos programar el front-end de un sitio web a partir de un diseño a medida. Paso a paso, repasaremos las características de los themes WordPress, aprendiendo a organizarlos, optimizarlos y alimentarlos.
Fernando Arias para WP Argentina (wpargentina.org)
en Buenos Aires WordPress Meetup
28 de octubre de 2014
Joomla in a Box – A Vagrant box for local Joomla developmentJoomlatools
Joomla developers and agencies face the same challenges everyday. Testing their extensions against different Joomla versions, bugs that only happen in certain PHP versions, telling people "works on my machine" over and over again...
What if we didn't have to suffer all this? What if it took 5 seconds to set up a new Joomla site or 2 minutes to test a new PHP version? And what if all your coworkers had the exact same setup as you do?
In this presentation, we introduce Vagrant, a virtual machine manager, and walk through the benefits of using it for development. The slides take you through the different steps to setup a complete local Joomla environment in just minutes, install a site and install an extension from Git. At the end we also include information of the different productivity tools that are installed in the box.
If you develop with Joomla locally then this presentation is one you shouldn’t miss out on. Happy coding !
Hero Video Performance - DrupalCamp RuhrWalter Ebert
The document provides tips and techniques for optimizing video performance on websites, including:
1. Using autoplay, loop, and muted attributes to autoplay videos silently by default.
2. Removing audio tracks from videos to reduce file sizes using FFmpeg or Handbrake.
3. Adding the faststart flag when encoding videos with FFmpeg to optimize buffering and playback.
4. Checking features like connection type, reduced motion preferences, and do not track settings to determine when autoplay is appropriate.
This document discusses various techniques for optimizing video playback on websites. It covers topics like removing audio, improving loading speeds, detecting device/connection properties, and fallback options when autoplay is disabled. Code snippets demonstrate how to conditionally autoplay video based on factors like screen width, connection type, and browser capabilities. The goal is to provide the best video experience across different environments while being mindful of data usage and user preferences.
Using browser settings for performanceWalter Ebert
The document discusses various browser settings and APIs that can be used for performance optimizations on websites. It covers techniques like using JavaScript to load different video files for mobile vs desktop, detecting mobile browsers, respecting the prefers-reduced-motion media feature, and proposed new media features in CSS5. It also discusses the DonotTrack header, high contrast mode, dark mode, JavaScript modules, the Network Information API, and Client Hints HTTP headers.
En muchas ocasiones, necesitaremos programar el front-end de un sitio web a partir de un diseño a medida. Paso a paso, repasaremos las características de los themes WordPress, aprendiendo a organizarlos, optimizarlos y alimentarlos.
Fernando Arias para WP Argentina (wpargentina.org)
en Buenos Aires WordPress Meetup
28 de octubre de 2014
Joomla in a Box – A Vagrant box for local Joomla developmentJoomlatools
Joomla developers and agencies face the same challenges everyday. Testing their extensions against different Joomla versions, bugs that only happen in certain PHP versions, telling people "works on my machine" over and over again...
What if we didn't have to suffer all this? What if it took 5 seconds to set up a new Joomla site or 2 minutes to test a new PHP version? And what if all your coworkers had the exact same setup as you do?
In this presentation, we introduce Vagrant, a virtual machine manager, and walk through the benefits of using it for development. The slides take you through the different steps to setup a complete local Joomla environment in just minutes, install a site and install an extension from Git. At the end we also include information of the different productivity tools that are installed in the box.
If you develop with Joomla locally then this presentation is one you shouldn’t miss out on. Happy coding !
Hero Video Performance - DrupalCamp RuhrWalter Ebert
The document provides tips and techniques for optimizing video performance on websites, including:
1. Using autoplay, loop, and muted attributes to autoplay videos silently by default.
2. Removing audio tracks from videos to reduce file sizes using FFmpeg or Handbrake.
3. Adding the faststart flag when encoding videos with FFmpeg to optimize buffering and playback.
4. Checking features like connection type, reduced motion preferences, and do not track settings to determine when autoplay is appropriate.
This document discusses various techniques for optimizing video playback on websites. It covers topics like removing audio, improving loading speeds, detecting device/connection properties, and fallback options when autoplay is disabled. Code snippets demonstrate how to conditionally autoplay video based on factors like screen width, connection type, and browser capabilities. The goal is to provide the best video experience across different environments while being mindful of data usage and user preferences.
Using browser settings for performanceWalter Ebert
The document discusses various browser settings and APIs that can be used for performance optimizations on websites. It covers techniques like using JavaScript to load different video files for mobile vs desktop, detecting mobile browsers, respecting the prefers-reduced-motion media feature, and proposed new media features in CSS5. It also discusses the DonotTrack header, high contrast mode, dark mode, JavaScript modules, the Network Information API, and Client Hints HTTP headers.
This document discusses the importance of website speed and provides tips to optimize performance. It notes that 53% of mobile site visits are abandoned after 3 seconds and shares examples of sites that saw major increases in conversions from reducing load times. To improve speed, it recommends strategies like caching, image optimization, lazy loading images, concatenating and minifying CSS and JS, output compression, browser caching, and using a content delivery network. The document aims to explain why performance matters and provide specific techniques to make sites faster.
This document discusses options for local and virtual machine-based web development environments, including local development tools like XAMPP, MAMP, and Laravel Valet. It also covers using virtual machines with tools like VirtualBox, Vagrant, Docker, and virtual machine images for WordPress development. Finally, it discusses deployment options like FTP, rsync, and Git as well as continuous integration/delivery services like Jenkins, Travis CI, and GitLab CI.
The document discusses modernism in web design and its key principles. It references influential modernist architects and designers like Ludwig Mies van der Rohe and Dieter Rams. Some principles of modernist web design mentioned are form follows function, less is more, and good design is as little design as possible. The document also provides examples of early modernist web designs from the 1990s and references the focus on simplicity and minimalism in more recent sites like Google and Facebook.
This document discusses various techniques for optimizing images and other media on websites. It covers file formats like JPEG, PNG and SVG as well as tools for optimizing images. It also discusses responsive images, video optimization, icon fonts and animated GIF alternatives. HTTP/2 optimizations are mentioned at the end.
WordPress mit Composer und Git verwaltenWalter Ebert
This document provides instructions and examples for installing, configuring, and using Composer to manage WordPress and other PHP projects. It covers downloading and installing Composer, installing packages and dependencies, updating packages, using Composer scripts, setting up a WordPress project structure with Composer, and additional tips and strategies for version control and deployment.
The document discusses various image formats (GIF, PNG, JPEG), optimization tools, responsive image techniques (srcset, picture), lazy loading, icon fonts versus SVG sprites, and video optimization. It provides information on each topic and examples of how to implement the different techniques for optimizing images and other assets for faster page loads.
The document discusses making websites secure by default through HTTPS. It covers the required technology and best practices for configuring HTTPS, migrating sites to HTTPS to make them more secure and user-friendly, and improving performance. Implementing HTTPS properly can help protect user privacy and data security.
WordPress-Templates mit Twig erstellen - PHPUGFFMWalter Ebert
This document provides information about using Twig as a templating language for WordPress projects. It discusses advantages of Twig like separation of HTML and PHP. It also covers how to install and configure Twig, use Twig syntax in templates, integrate Twig with plugins like Timber, extend Twig functionality, and lists some WordPress projects that use Twig. Finally, it provides some resources for getting started with WordPress development using Composer and Twig.
1. WordPress-Themes
mit Twig entwickeln
Walter Ebert @wltrd
WordCamp Berlin 14. November 2015
https://www.flickr.com/photos/37872410@N00/4653843463/https://www.flickr.com/photos/37872410@N00/4653843463/
4. Vorteile von Twig
• Trennung von HTML und PHP
• Einfacher für Anfänger
• Mehr Sicherheit
• Vererbung von Templates
• Erfahrung aus andere PHP-Projekte nutzen