VOORBEELDEN in HTML - XHTML - XML - AMP
HTML Voorbeelden |
'Hypertext Markup Language'
- HTML 2.0
- HTML 3.2
HTML & CSS Tweets |
'Hypertext Markup Language and Cascading Stylesheets'
@jvmeeteren: #HTML5 | AutomaticNumbering HTML5Tags using CSS3
@jvmeeteren: #HTML5 #CSS3 | Figcaption with AutomaticNumbering
@jvmeeteren: #HTML5 #CSS3 | ResponsiveDesign versus NonResponsiveDesign with FontSizes
@jvmeeteren: #HTML5 #CSS3 | HTMLMarkup versus CSSStyling
@jvmeeteren: #HTML5 #CSS3 | Is CSS a pure styling language? NO
@jvmeeteren: #HTML5 #CSS3 | Is HTML a pure markup language? NO
XHTML Voorbeelden |
'Extensible Hypertext Markup Language'
XML Voorbeelden |
'Extensible Markup Language'
- XML 1.0 | Markup Languages database | with CSS stylesheet | client side
- XML 1.0 | Markup Languages database | with XSL and internal CSS stylesheet | client side
- XML 1.0 | Markup Languages database | with XSL and external CSS stylesheet | client side
- XML 1.0 in PHP | Markup Languages database | with CSS stylesheet | client side
- XML 1.0 in PHP | Markup Languages database | with CSS stylesheet and MySQL feed | server side
- XML 1.0 in PHP | Markup Languages database | with XSL and external CSS stylesheet | client side
TOEPASSINGEN: XML - HTML - AMP - PWA
Toepassing XML |
'RSS feeds'
HTML5 Content |
'Lazy Loading'
- Google Chrome past lazy loading toe
- Lazy Loading Images – The Complete Guide
HTML5 Voorbeelden |
'Lazy Loading'
- Afbeeldingen met 'Lazy Loading'
- Afbeeldingen met 'Lazy Loading' in PWA
HTML5 AMP Tweets |
'Afbeeldingen in AMP HTML'
- Responsive Image in AMP | @jvmeeteren: 'Tweet' (December 7, 2016)
- Responsive Instagram Image in AMP | @jvmeeteren: 'Tweet' (December 10, 2016)
- Responsive Tweets in AMP | @jvmeeteren: 'Tweet' (December 13, 2016)
- Responsive Images in AMP-Carousel | @jvmeeteren: 'Tweet' (December 16, 2016)
- Responsive Images in AMP-Carousel Autoplay | @jvmeeteren: 'Tweet' (December 19, 2016)
- Media Query Selection in AMP | @jvmeeteren: 'Tweet' (December 22, 2016)
- Responsive iFrame with Google Maps in AMP | @jvmeeteren: 'Tweet' (December 25, 2016)
- Responsive Video in AMP | @jvmeeteren: 'Tweet' (December 28, 2016)
- Responsive Youtube Videos in AMP | @jvmeeteren: 'Tweet' (December 31, 2016)
- Responsive Animated Images in AMP | @jvmeeteren: 'Tweet' (January 9, 2017)
- Responsive Images with Lightbox in AMP | @jvmeeteren: 'Tweet' (January 12, 2017)
- Responsive JPEG Images used in element 'amp-accordian' | @jvmeeteren: 'Tweet' (January 15, 2017)
- Responsive JPEG Images used in element 'amp-sidebar' | @jvmeeteren: 'Tweet' (January 18, 2017)
- AMP Stories: Responsive Images (Mushrooms) used in element 'amp-story' | @jvmeeteren: 'Tweet' (February 15, 2018)
- AMP Email: Responsive Images (Mushrooms) used with element 'html amp4email' | @jvmeeteren: 'Tweet' (February 21, 2018)
- AMP Lite: Responsive Images used in Element 'amp-img' and with Attribute 'srcset' | @jvmeeteren: 'Tweet' (February 27, 2018)
HTML5 Valid AMP |
'Gevalideerde pagina's in AMP HTML'
- Responsive Image in AMP | ... in Valid AMP HTML
- Responsive Instagram Image in AMP | ... in Valid AMP HTML
- Responsive Tweets in AMP | ... in Valid AMP HTML
- Responsive Images in AMP-Carousel | ... in Valid AMP HTML
- Responsive Images in AMP-Carousel Autoplay | ... in Valid AMP HTML
- Media Query Selection in AMP | ... in Valid AMP HTML
- Responsive iFrame with Google Maps in AMP | ... in Valid AMP HTML
- Responsive Video in AMP | ... in Valid AMP HTML
- Responsive Youtube Videos in AMP | ... in Valid AMP HTML
- Responsive Animated Images in AMP | ... in Valid AMP HTML
- Responsive Images with Lightbox in AMP | ... in Valid AMP HTML
- Responsive JPEG Images used in element 'amp-accordian' | ... in Valid AMP HTML
- Responsive JPEG Images used in element 'amp-sidebar' | ... in Valid AMP HTML
» Instagram Photos | ... in Valid AMP HTML ||
- CCW 'Je foto van de maand' Photos | ... in Valid AMP HTML
- CCW 'Fotoaustellung Wasser Fotoclub Mörfelden-Walldorf' Photo | ... in Valid AMP HTML
- AMP Tweets | ... in Valid AMP HTML
- Base64 Tweets | ... in Valid AMP HTML
- BPG Tweets | ... in Valid AMP HTML
- FLIF Tweets | ... in Valid AMP HTML
- JPEG 2000 Tweets | ... in Valid AMP HTML
- WebP Tweets | ... in Valid AMP HTML
- Canvas Tweets | ... in Valid AMP HTML
- Cropping Methods Tweets | ... in Valid AMP HTML
- CSS3 clip-path property Tweets | ... in Valid AMP HTML
- CSS3 filter Property Tweets | ... in Valid AMP HTML
- CSS3 transform Property Tweets | ... in Valid AMP HTML
- Tweets on Progressive Web Apps | ... in Valid AMP HTML
- SVG Tweets | ... in Valid AMP HTML
- World Photography Day Tweets | ... in Valid AMP HTML
» Photo Tweets | ... in Valid AMP HTML ||
Progressive Web App |
'Info over PWA'
- Progressive Web Apps A new way to deliver amazing user experiences ...
- Progressive Web Apps: de toekomst van mobiele apps?
- Getting started with Progressive Web Apps
- Browser Edge draait binnenkort Progressive Web Apps
- Introduction to Progressive Web Apps: Service Worker and Web App Manifest
- Combine AMP with Progressive Web Apps
Progressive Web App |
'Afbeeldingen in Gevalideerde PWA'
- Responsive Images in PWA and HTML5
- Responsive Images in PWA and XHTML5
- Responsive Images in PWA and AMP HTML
Boilerplate |
'Boilerplates in HTML5 / XHTML5'
Boilerplate Tweets |
'Responsive Afbeeldingen in HTML5 Boilerplate'
- Responsive Image in Boilerplate | (to be published on Twitter)
- Responsive Image in Boilerplate and Bootstrap | (to be published on Twitter)
- Responsive Image in Boilerplate and Canvas | (to be published on Twitter)
- Responsive Image in Boilerplate, Bootstrap and Canvas | (to be published on Twitter)
GRAFISCHE TOEPASSINGEN in HTML met Base64 en Canvas - SVG
HTML5 BPG |
'BPG Afbeeldingen in HTML5'
- BPG
HTML5 BPG Tweets |
'BPG Afbeeldingen in HTML5'
- Responsive Better Portable Graphics (BPG) in Canvas | @jvmeeteren: 'Tweet' (January 27, 2017)
- Responsive Better Portable Graphics (BPG) in Canvas | @jvmeeteren: 'Tweet' (August 13, 2017)
HTML5 FLIF |
'FLIF Afbeeldingen in HTML5'
- FLIF ||
HTML5 FLIF Tweets |
'FLIF Afbeeldingen in HTML5'
- Responsive Free Lossless Image Format (FLIF) in Canvas | @jvmeeteren: 'Tweet' (August 13, 2017)
HTML5 JPEG 2000 |
'JPEG 2000 Afbeeldingen in HTML5'
HTML5 JPEG 2000 Tweets |
'JPEG 2000 Afbeeldingen in HTML5'
- Responsive JPEG 2000 Image | @jvmeeteren: 'Tweet' (August 13, 2017)
HTML5 WebP |
'WebP Afbeeldingen in HTML5'
- WebP ||
HTML5 WebP Tweets |
'WebP Afbeeldingen in HTML5'
- Responsive WebP Image | @jvmeeteren: 'Tweet' (January 30, 2017)
- Responsive WebP Image in Base64 | @jvmeeteren: 'Tweet' (February 6, 2017) (only works in Chrome so far)
- Responsive WebP Image in AMP | @jvmeeteren: 'Tweet' (February 8, 2017) (only works in Chrome so far)
- Responsive WebP Image | @jvmeeteren: 'Tweet' (August 13, 2017)
HTML5 Base64 |
HTML5 Base64 Tweets |
'Base64 Afbeeldingen in HTML5'
- Compressed Responsive Image in Base64 | @jvmeeteren: 'Tweet' (January 24, 2017)
HTML5 Canvas |
'Afbeeldingen in HTML5 Canvas'
- Canvas: Black & White Images
- Canvas: Horizontally Mirrored Images
HTML5 Canvas Tweets |
'Afbeeldingen in HTML5 Canvas'
- Canvas: Image and Text | Tweet: @jvmeeteren: 'Image and Text in #HTML5 #Canvas' (November 10, 2016)
- Canvas: Cropped Image | Tweet: @jvmeeteren: '#CroppedImage and Text in #HTML5 #Canvas' (November 13, 2016)
- Canvas: Focussing | Tweet: @jvmeeteren: 'Focussing on Parts of Image and Text in #HTML5 #Canvas' (November 16, 2016)
- Canvas: Black and White | Tweet: @jvmeeteren: 'Black and White Filtered Image in #HTML5 #Canvas' (November 19, 2016)
- Canvas: Green Filtered | Tweet: @jvmeeteren: 'Green Filtered Image in #HTML5 #Canvas' (November 22, 2016)
- Canvas: Mirrored | Tweet: @jvmeeteren: '#MirroredImage in #HTML5 #Canvas' (November 25, 2016)
- Canvas: Rotated | Tweet: @jvmeeteren: 'Rotated Image in #HTML5 #Canvas' (November 28, 2016)
- Canvas: Sepia Filtered | Tweet: @jvmeeteren: 'Sepia Filtered Image in #HTML5 #Canvas' (December 1, 2016)
- Canvas: Horizontally Mirrored | (to be published on Twitter) (under construction)
- Canvas: Inverted Colors | (to be published on Twitter)
- Canvas: Red Filtered | (to be published on Twitter)
- Canvas: Blue Filtered | (to be published on Twitter)
- Canvas: Brightness | (to be published on Twitter)
SVG |
'SVG Afbeeldingen in HTML5'
SVG Tweets |
'SVG Afbeeldingen in HTML5'
- Responsive SVG Image obtained from JPEG by using Online Converter | @jvmeeteren: 'Tweet' (February 17, 2017)
- Responsive SVG Image obtained from JPEG by using Inkscape | @jvmeeteren: 'Tweet' (February 20, 2017)
- Responsive SVG Image with Inline Styling | @jvmeeteren: 'Tweet' (February 23, 2017)
- Responsive SVG Image with Blur Effect Styled Inline | @jvmeeteren: 'Tweet' (February 26, 2017)
Google Foto's |
'Afbeeldingen verkregen uit Google Foto's in HTML5'
- PHOTOS - Retrieved from ... in Bootstrap
- PHOTOS - Retrieved from ... in Canvas and Bootstrap
JSON |
'Foto's geïmplementeerd door JSON'
- JSON BPG images (under construction)
JSON Tweets |
'Foto's geïmplementeerd door JSON'
- Responsive JPEG Image Implemented by JSON | (to be published on Twitter)
- Responsive Base64 JPEG Image Implemented by JSON | (to be published on Twitter)
- Responsive PNG Image Implemented by JSON | (to be published on Twitter)
- Responsive Base64 PNG Image Implemented by JSON | (to be published on Twitter)
- SVG Responsive Image Implemented by JSON | (to be published on Twitter)
- Base64 SVG Responsive Image Implemented by JSON | (to be published on Twitter)
- Responsive JPEG Image Implemented by MySQL and JSON | (to be published on Twitter)
- Responsive Base64 JPEG Image Implemented by MySQL and JSON | (to be published on Twitter)
- Responsive BPG Image Implemented by JSON and Canvas | (to be published on Twitter)
- Responsive WebP Image Implemented by JSON | (to be published on Twitter)
GRAFISCHE TOEPASSINGEN met CSS
CSS3 filter Property Tweets |
'Afbeeldingen met CSS3 Filters in HTML5'
- Responsive CSS3 Filter Property Images ('blur') | @jvmeeteren: 'Tweet' (March 1, 2017)
- Responsive CSS3 Filter Property Images ('brightness') | @jvmeeteren: 'Tweet' (March 4, 2017)
- Responsive CSS3 Filter Property Images ('contrast') | @jvmeeteren: 'Tweet' (March 7, 2017)
- Responsive CSS3 Filter Property Images ('drop-shadow') | @jvmeeteren: 'Tweet' (March 13, 2017)
- Responsive CSS3 Filter Property Images ('grayscale') | @jvmeeteren: 'Tweet' (March 19, 2017)
- Responsive CSS3 Filter Property Images ('hue-rotate') | @jvmeeteren: 'Tweet' (March 28, 2017)
- Responsive CSS3 Filter Property Images ('invert') | @jvmeeteren: 'Tweet' (March 31, 2017)
- Responsive CSS3 Filter Property Images ('opacity') | @jvmeeteren: 'Tweet' (April 9, 2017)
- Responsive CSS3 Filter Property Images ('saturate') | @jvmeeteren: 'Tweet' (April 18, 2017)
- Responsive CSS3 Filter Property Images ('sepia') | @jvmeeteren: 'Tweet' (April 27, 2017)
CSS3 transform Property Tweets |
'Afbeeldingen met CSS3 Transform in HTML5'
- Responsive CSS3 Transform Property Image ('scaleX') | @jvmeeteren: 'Tweet' (May 6, 2017)
- Responsive CSS3 Transform Property Image ('scaleY') | @jvmeeteren: 'Tweet' (May 15, 2017)
- Responsive CSS3 Transform Property Image ('rotate') | @jvmeeteren: 'Tweet' (May 24, 2017)
- Responsive CSS3 Transform Property Image ('skewX') | @jvmeeteren: 'Tweet' (June 2, 2017)
- Responsive CSS3 Transform Property Image ('skewY') | @jvmeeteren: 'Tweet' (June 11, 2017)
- Responsive CSS3 3D Transform Property Image ('rotateX') | @jvmeeteren: 'Tweet' (June 20, 2017)
- Responsive CSS3 3D Transform Property Image ('rotateY') | @jvmeeteren: 'Tweet' (June 29, 2017)
- Responsive CSS3 3D Transform Property Image ('rotateZ') | @jvmeeteren: 'Tweet' (July 8, 2017)
Cropping Methods Tweets |
'Uitgesneden Afbeeldingen'
- Responsive Cropped JPEG Image by using CSS3 Margin | @jvmeeteren: 'Tweet' (July 17, 2017)
- Responsive Cropped JPEG Image by using HTML5 Canvas | @jvmeeteren: 'Tweet' (July 26, 2017)
- Responsive Cropped JPEG Image by using CSS3 Transform Translate | @jvmeeteren: 'Tweet' (August 4, 2017)
CSS3 clip-path Tweets |
'Uitgesneden Afbeeldingen'
- Responsive Cropped JPEG Image by using CSS3 Clip-path: circle | @jvmeeteren: 'Tweet' (December 17, 2017)
- Responsive Cropped JPEG Image by using CSS3 Clip-path: polygon (triangle) | @jvmeeteren: 'Tweet' (December 20, 2017)
- Responsive Cropped JPEG Image by using CSS3 Clip-path: polygon (rhombus) | @jvmeeteren: 'Tweet' (December 23, 2017)
- Responsive Cropped JPEG Image by using CSS3 Clip-path: polygon (heptagon) | @jvmeeteren: 'Tweet' (January 4, 2018)
- Responsive Cropped JPEG Image by using CSS3 Clip-path: polygon (hexagon) | @jvmeeteren: 'Tweet' (January 10, 2018)
- Responsive Cropped JPEG Image by using CSS3 Clip-path: polygon (octagon) | @jvmeeteren: 'Tweet' (January 19, 2018)
TOEPASSINGEN en SPECULATIES in en rond HTML en HTML6
AppML |
'Data geïmplementeerd door AppML'
- Markup Languages shown with AppML | ... JSON client-side file
- Markup Languages shown with AppML | ... PHP server-side file
Validering |
'(X)HTML, ...'
HTML5 |
'HyperText Markup Language 5'
- HTML5 vergeleken met Natuurlijke Talen ||
- Weglatings- en Fout-tolerantie in HTML5
XHTML5 |
'HTML5 + XML = XHTML5'
- XHTML5 = HTML5 in XML Serialisatie-Modus
HTML6 |
'Opvolger HTML5 ?'
- HTML6 ||
- Opmerkingen: Voorbeelden met voorgestelde vormen van HTML6-broncode
HTML Content |
'Versleuteld / Beveiligd'
Snellere Toegang |
'tot Informatie'
- SEO
Deze website past cookies toe voor optimaal gebruik van dit platform |