‘images’ Videos

  • Bernhard Kau: Better Themes with Scalable Vector Graphics (SVG)

    Bernhard Kau: Better Themes with Scalable Vector Graphics (SVG)

    WordCamp Nuremberg 2016Speaker: Bernhard Kau

    April 21, 2016 — A responsive design has become a standard of modern WordPress theme. But not only the content of a website has to be optimized for the mobile screen. The theme should also provide high resolution images and icons. Using SVG images here is usually the best way to accomplish this goal. This session will give a brief overview on how you can utilize Scalable Vector Graphics.

    Presentation Slides »

  • Walter Ebert: Weniger aus Bilder holen

    Walter Ebert: Weniger aus Bilder holen

    WordCamp Nuremberg 2016Speaker: Walter Ebert

    April 21, 2016 — Bilder sind ein wichtiger Bestandteil unserer Webseiten. Aber leider sind diese oft viel zu groß und verschwenden unnötig mobiles Datenvolumen. In seinem Vortrag wird Walter uns erklären, welche Bildformate wir nutzen können bzw. sollten. Außerdem wird er erklären, wie man WordPress optimiert, um automatisch das richtige Bild für jeden Browser und Endgerät auszuliefern

    Presentation Slides »

  • Piero Bellomo: Immagini responsive – Oltre il max-width: 100%

    Piero Bellomo: Immagini responsive – Oltre il max-width: 100%

    WordPress Meetup TorinoSpeaker: Piero Bellomo

    April 13, 2016 — Viste una serie di richieste sempre più complesse da parte dei clienti molto esigenti, esamineremo i metodi più efficaci di come renderizzare le immagini responsive, e impareremo a incorporarle — fin dall’inizio — nel flusso di lavoro di WordPress.

    Presentation Slides »

  • Piero Bellomo: Responsive Images – Beyond max-width: 100%

    Piero Bellomo: Responsive Images – Beyond max-width: 100%

    WordCamp Torino 2016Speaker: Piero Bellomo

    April 5, 2016 — Through a series of increasingly complex requests from an imaginary, albeit very demanding client, we will review the most effective methods of rendering truly responsive images, and learn how to embed them — right from the start — in your WordPress workflow. You will walk away safe in the knowledge you own all the right tools to achieve bulletproof responsive art-directed seo-friendly lazy-loading images. (phew!)

    Presentation Slides »

  • Jan Henckens: Responsive Images and the Picture Element

    Jan Henckens: Responsive Images and the Picture Element

    WordCamp Berlin 2015Speaker: Jan Henckens

    January 29, 2016 — The picture element and src attributes are coming to all mayor browsers so we can start using them in our code and our sites. Furthermore, responsive images support is coming to WordPress in 4.4, high time for everyone to know about this:)

    Presentation Slides »

  • Toru Miki: レスポンシブ・イメージのWordPressへの実装と4.4

    Toru Miki: レスポンシブ・イメージのWordPressへの実装と4.4

    WordCamp Tokyo 2015Speaker: Toru Miki

    January 20, 2016 — Ethan Marcotte 氏がレスポンシブ・ウェブデザインを提唱して5年以上経ちますが、未だ完全な解決策が無い問題として「レスポンシブ・ウェブデザインにおける画像(レスポンシブ・イメージ)の問題」があります。

    画像がページサイズの大きな割合を占めることが多い事や、昨今のデバイスの多様化、パフォーマンスの重要性を鑑みると、この問題の解決はウェブ全体にとってとても重要な事柄です。

    しかし、ようやく、最近になって解決への道しるべが作られてきています。picture 要素や srcset 属性などのレスポンシブ・イメージを実現する仕様が含まれるHTML 5.1が草案(Working Draft)となり、多くのブラウザでも対応が進んでいます。

    このセッションでは、RICG Responsive Images プラグインと、このプラグインの 4.4 へのマージについてお話し、srcset 属性と sizes 属性の WordPress へのネイティブ実装をどのように実現するかご紹介します。

    注:時間の都合上、レスポンシブ・イメージの詳細な仕様は紹介しません。srcset 属性と sizes 属性についておさらいしておくことをオススメします。

    Presentation Slides »

  • Jacques Surveyer: Image Grid Plugins

    Jacques Surveyer: Image Grid Plugins

    WordCamp Toronto 2015Speaker: Jacques Surveyer

    January 16, 2016 — The rallying cry for WordPress has become an Apple take-off “there is a free plugin for that”. So the premium plugins have to offer substantial value to win over developers. Here are two image grid plugins, Justified Image Grid and Essential Grid, that offer just such value.

    Responsive image grids that work well on mobile and desktop screens.
    Ability to incorporate portrait, landscape, and varying dimensions images in the same masonry layout image grid.
    Add styled captions, links, and shortcodes to images.
    Use a variety of image sources including WP gallery, NextGen, FaceBook, Flickr, Instagram, etc.
    Provide an image grid of feature Posts based on taxonomy, category, or date.
    Provide a variety of lightboxes for magnification of images with captions.
    Allow for page or load more infinite image scrolling.
    Provide filtering of images displayed in the grid with buttons along the top for All, Tagged, Category, Etc filters.
    Provide a variety of styling options for individual images and the grid as a whole.
    I compare the best of the free image plugins with these features.
    (Disclosure: I am not now nor will be in the future be an affiliate for either of these vendors or their representatives. The motivation: several times for $28 or less these plugins saved my bacon by lowering cost of development by hundreds of dollars while delivering advanced and winning features to clients.)

    Learning Outcomes:

    – Outline the key uses of image grids in WordPress development.
    – Demonstrate the advantage of responsive grids in mobile design.
    – Show how image grids can display mixed size plus portrait and landscape images well in a masonry layout.
    – Create a visual sitemap for a website.
    – Create an instant shopping cart grid for an array of products.
    – Help answer the question when to consider a premium plugin.

    Presentation Slides »

  • Heather Johnson: Using Images To Build Your Audience In 
3 Simple Steps

    Heather Johnson: Using Images To Build Your Audience In 
3 Simple Steps

    WordCamp Seattle 2015: Beginner EditionSpeaker: Heather Johnson

    December 27, 2015 — With around 65% of the population being visual learners, it is no wonder that images can make or break a website. A study has revealed that 60% of consumers are more likely to consider local search results that include an image and another 23% are more likely to actually contact a business that uses images well. It may seem daunting to focus time and energy on your images but with 3 simple steps – creating an image library, optimizing your images and displaying them properly – you can reach a wider audience, increase engagement, lengthen the time your audience spends on your website and bolster your conversion rate. Isn’t that worth it?

  • Felix Ortega: Imágenes responsive en WordPress

    Felix Ortega: Imágenes responsive en WordPress

    WordCamp Cantabria 2015Speaker: Felix Ortega

    December 7, 2015 — Imágenes responsive en WordPress

  • Maria Averion: Photo Prep 101 for WordPress

    Maria Averion: Photo Prep 101 for WordPress

    WordCamp Columbus 2015Speaker: Maria Averion

    August 20, 2015 — How come when you upload your photos, they don’t fit right and it doesn’t look like it’s supposed to look? This session is on basic photo editing for WordPress and what my process is for preparing the images before I upload them and why I do it this way.

    How to prepare your photos for import – Photo editing options if you don’t want to buy PhotoShop – DPI, PX, Pica, PT, what the heck does all that mean? – How to edit or fix your photos once you’ve uploaded them – Plugins that help resize or optimize photos – I briefly touch on copyright and where to get good photos

Follow

Get every new post delivered to your Inbox.

Join 20,156 other followers