Portfolio webdesign

2015-2016 restyled HTML5 | 'FRANS.BEURSKENS.WORKS' Projects

HTML5 & CSS3

01: Heemkunde Renkum Mensen

02: Heemkunde Renkum Straten

03: Wijkboekhouding Portfolio Masonry 4 with header photo

04: Portfolio Wijkboekhouding Grid312

05: Portfolio Wijkboekhouding Masonry 4 + Grid312

06: Adapted Modal Popups Full Screen

07: Modal Popup PORTFOLIO

---

2015-2016 designed HTML5

HTML5 & CSS3 with(out) Canvas

01: HTML5 CSS3 - Artriskel (2015)

02: HTML5 CSS3 - Artriskel (2016) | See also Bootstrap

03: HTML5 CSS3 - HTML5 / HTML IN A CIRCLE

04: HTML5 CSS3 - Composed with css @media type

05: HTML5 CSS3 - Invisearch Bedrijfsrecherche

06: HTML5 CSS3 - parallelogram design in css3 format

07: HTML5 CSS3 - Square rotated in red

08: HTML5 CSS3 - TRIANGLE IN A CIRCLE

---

HTML

HTML5 & CSS3

01: Images rendered in Base64 ||

02: WebM Video and (animated) Images

03: WebP Images

---

HTML

HTML5 Canvas in Bootstrap 3

01: Black and White Images rendered in Canvas

02: Cropped Images rendered in Canvas

03: Rotated Images rendered in Canvas

04: Mirrored Images rendered in Canvas

05: Horizontally Mirrored Images rendered in Canvas

06: Filtered Images rendered in Canvas

07: Focussing Images rendered in Canvas

08: Text on Images rendered in Canvas

---

XHTML

XHTML 1.0 / XHTML 1.1 & CSS2.1 / CSS3

01: XHTML1.0 Transitional - Studiebegeleiding Ede (2006)

02: XHTML1.0 Transitional - Tempeladvies (2007)

03: XHTML 1.0 Strict & CSS3

04: XHTML 1.1 & CSS3

---

XHTML

XHTML5 & CSS3

01: XHTML5 - Lazy Loading Images ||

02: XHTML5 - 1. Focus stacking using CSS3 'opacity'

03: XHTML5 - 2. Focus stacking using CSS3 'opacity'

04: XHTML5 - 1. Focus stacking with darktable

05: XHTML5 - 2. Focus stacking with darktable

06: XHTML5 - CSS3 Image Overlay - 'Multiple Exposure Effects'

---

SVG

Designed in HTML5 / CSS3 and SVG

01: HTML5 CSS3 - HTML5 Scalable Vector Graphics WebPage / Use of SVG elements in HTML

02: XML CSS3 - XML Scalable Vector Graphics WebPage / Use of SVG 1.1 elements in XML

03: SVG XML CSS3 - Webdevelopment and Webdesign / PHOTOS made by ...

---

XML

Recently designed - in XML version 1.0 & CSS3

01: XML version 1.0 || CSS3 - Basic Design ||

02: XML version 1.0 with(out) XLink ... CSS3 - Basic Design

---

Portable

Portable sites in HTML5 & CSS3 (and @media)

01: HTML5 / CSS3 - can only be used on smartphones

02: HTML5 / CSS3 - suitable for use in all screen formats

03: HTML5 / CSS3 - suitable for use in all screen formats

04: HTML5 / CSS3 - suitable for use in all screen formats

05: HTML5 / CSS3 - suitable for use in all screen formats

06: HTML5 / CSS3 - suitable for use in all screen formats

07: HTML5 / CSS3 - suitable for use in all screen formats

---

Bootstrap

Responsive Web Design based on Bootstrap

01: Bootstrap - Artriskel (2015)

02: Bootstrap - Artriskèl (2016)

03: Bootstrap - Studiebegeleiding Ede (2018)

04: Bootstrap - Tempeladvies (2017)

05: Bootstrap & Responsive CSS Circles | A round button with a link in a circle

06: Bootstrap & Responsive CSS Circles | Rounded & linked image in a circle

07: Bootstrap & Responsive CSS Circles | A PNG background-image circle

08: Bootstrap & Responsive CSS Circles | A SVG background-image circle

09: Bootstrap | Full Responsive Bootstrap Webdesign with SVG CIRCLE in the background

10: Bootstrap | Responsive Web Design with three columns & SVG background

11: Bootstrap | a Portfolio linked to 4 Modal examples

---

Bootstrap

Responsive Web Design based on Bootstrap with photos

01: PORTFOLIO: Collection of Mushrooms | photos in bootstrap ||

02: PORTFOLIO: Collection of Glass Art | photos in bootstrap

03: PORTFOLIO: Collection of Glass Art | photos in bootstrap

04: PORTFOLIO: Collection of Wood | photos in bootstrap

05: PORTFOLIO: Collection of Wood | photos in bootstrap

---

AMP

Accelerated Mobile Pages

01: AMP WebPage with PWA Configuration ||

---

Joomla

Responsive Web Design based on Joomla

01: XHTML 1.0 Transitional (Joomla) - Tempeladvies (2011)

---

WordPress

Responsive Web Design based on WordPress

01: WordPress - Begraafplaats Fangmanweg (2017)

02: WordPress - Tempeladvies (2017)

---

PWA / Progressive Web App

Responsive Web Design based on PWA

01: Portfolio Fotografie in HTML5 ||

02: Portfolio Fotografie in JSON en HTML5

03: Portfolio Fotografie in JSON en XHTML5

04: 'Dromen in een Mindmap'

05: Lazy Loading Images

06: Digitale kerstkaart