Ludwig Wendzich

y'know that guy from nz

Who is this guy?

His name is Ludwig Wendzich and he doesn't usually speak in the third person. He lives in Auckland, New Zealand after emigrating from South Africa when he was seven years old.

He has a passion for art and design. He is currently a web designer stroke developer who has a particular interest in designing the user experience; mixing usability and accessibility with aesthetics to maximize efficiency and enjoyment.

Scrapbook

, Inspirational stuff I found online

-->

tagged as HTML5

Using HTML5 Custom Data Attributes To Store Data On HTML Elements

Didn’t know this was new, but apparently it is. I can’t imagine how you did JS work without it.

24ways: Have a Field Day with HTML5 Forms

Know most of the new form elements, the thing that caught my eye was:

Our legends are looking great, but how about adding a clear indication of how many steps our form has? Instead of adding that manually to every legend, we can use automatically generated counters.

To add a counter to an element, we have to use either the :before or :after pseudo-elements to add content via CSS. We will follow these steps:

  • create a counter using the counter-reset property on the form element
  • call the counter with the content property (using the same name we’ve created before)
  • with the counter-increment property, indicate that for each element that matches our selector, that counter will be increased by 1

Other than that, you gotta love placeholder though!

Image management, naming and attribute selectors

I have been thinking about using CSS like this since I started reading more about selectors. I’m not sure if these are specific CSS3 selectors but I am sure that it’s because of CSS3 that I started reading CSS specifications! This is the reason why I love the latest web technologies (HTML5/CSS3.)

Again, maybe it’s not actually HTML5 or CSS3 technology that I am using, but the appearance of HTML5/CSS3 has made me look deeper and learn more about web technologies.

Building a website on Tumblr, HTML5 and CSS3Support

More than a year ago I designed what has become the look and feel of this very website. It didn’t look exactly the same, I was planning to build it on Expression Engine and wanted to highlight portfolio items (and especially artwork for sale) on the right. A few days ago I decided to build the website on Tumblr instead and so I started adding the Tumblr code to the HTML5/CSS3 templates I had created a few months ago from my designs in Illustrator.

HTML5/CSS3

When I say HTML5/CSS3 I am referring less to specific technologies and more to contemporary technologies. Yes, HTML5, yes CSS2.1 and yes some CSS3.

I made the choice to develop this website for my main browser of use first: Safari on Mac — so if you want the best experience then view it from the best browser. It then degrades somewhat gracefully in all modern browsers and thanks to Modernizr also Internet Explorer.

I made use of @font-face which seems to only really work properly in Safari on Mac. Despite following instructions from Mozilla on how to implement it. If you can see what I’m doing wrong, please let me know.

You’ll see some CSS3 transitions sparkled throughout. Not that exciting.

I have to say, overall, HTML5 and CSS3 is just so much nicer to work in, I just wish everyone would catch up!

Tumblr

Coding for Tumblr, hmm. Interesting. I do believe the platform is good which is why I chose to develop for it, and mostly everything is nice and simple but there are some things missing in my opinion.

  • Support for {!block:Title} syntax so that I can display content when there isn’t a title — say, my avatar from Twitter because it would probably be a tweet. However not just on {block:Title} but all “if this exists” type tags.
  • Support for automatic tagging of imported feeds. I’d like to be able to tag my posts from Twitter as “tweets” so that I can filter my content with /tagged/tweet/chrono or /tagged/photo/chrono. This isn’t possible yet.
  • It would be nice to filter by content type: /type/text/ or /type/audio/. This should work with other filtering methods like: /type/text/tagged/holiday. However automatic tagging could make this a moot point. Possibly /tagged/tweet+holiday/
  • Finally, proper support for Twitter, Facebook etc. I’d like to be able to access the Permalink of my tweet! I’d like to be able to have my tags from Twitter (hashtags) and Flickr to transfer over here. I’d like photos from Flickr to automatically form photosets if they’ve been uploaded within a short period of one another. I’d like Tumblr to be smart with these popular services!

That’s about it. Tumblr, please get smarter! Especially with feed importing.

I did manage to get around the lack of {!block:Title} issue using HTML commenting.

Anyway, we’ll see how this goes.

Elsewhere

Where else am I online?

twitter

Who I've met