Dan Ubilla » Web Development

HTML5 and Media Queries

admin — Sat, 30 Jul 2011 03:50:42 +0000

I finally took it upon myself to tackle HTML5, and you are looking at the results. Of course, implementing any form of HTML5 isn’t necessarily rewriting all of your markup with fancy new

and

tags nor does it have to be adding HTML5 native Javascript. The first step is the simplest, but it’s a first step nonetheless. I started by simply replacing my doctype with . Gorgeous in its simplicity, no? This change alone will give you HTML5 features in all modern browsers¹.

The first step was so easy, I decided to take some more. I ripped out the header and footer of my WordPress template and filled it in with some of Paul Irish‘s HTML5 Boilerplate. After, fighting off the fright and intimidation, I was able to follow along with the comments and decide what was needed from the boilerplate, what I wanted, and what I could toss away. There’s a corresponding CSS file with fantastic default styles and even some placeholders for media queries. Which, in fact, is where I tidied up my work. Check out this site on webkit-enabled mobile device (iPhone, Android, etc), and you should see a nice, readable mobile layout. It’s by no means perfect, but I would consider the site mobile-enhanced.

References

John Resig, HTML5 DOCTYPE, http://ejohn.org/blog/html5-doctype/

Maintenance Month

admin — Sat, 15 May 2010 19:38:59 +0000

Following Chris Coyier’s lead, I decided to go back and clean up some parts of the re-design I had neglected. It took some digging into pages and posts that I barely touched, and that have barely been seen, so I was glad to have the push.

Some fixes you’ll see:

Images from the Archives: After moving my site from /blog to the root of my domain, a few image links became broken. I was fearful that I’d have to dig into the meta data of the wordpress install to designate the new image folder, but I had actually linked the images on the site absolutely, a big no-no regardless. Simple fix, and finally implemented.
Archive, Post, and Page Layout: I wasn’t sure at the time about including the sidebar on all child pages, so I left these layouts in limbo, including the sidebar, but not doing it very well. The CSS was in place, so a bit more html markup completed the changes.
Post Navigation: The post navigation had some float issues. Since every element in the post navigation div was floated, a clearing element needed to be introduced so that the subsequent html didn’t run right up into it. IE7 has a margin-bottom bug with floated elements, so instead of introducing a bottom margin on the post navigation, I merely threw a top margin on the post.

Have you started maintenance on your own site this month? Plan to begin in the coming weeks? Leave a comment.

Preparing DanUbilla.com 2.0

admin — Sat, 02 Jan 2010 22:58:24 +0000

When I threw together the design you see on this very blog, I did it haphazardly and quickly just to get a bit of presentation to frame my entries. It was always meant to be a dynamic frame, one that I could use as a training ground to various tips and tricks I picked up through my work, both professional and personal. Looking at the current layout and site hierarchy in more depth, I’ve decided to scratch most of what little you see here and strip down to the bare essentials. By re-focusing on the content before continuing on with exploring new design techniques, I’ll be able to re-imagine this web space to become not only the design and development playground that I originally intended it to be, but to be a proper gallery of my accomplishments and pursuits. In breaking things down, I plan on following three tenants and lines of thinking that I’ve come across in the past six months since introducing this site:

* Make Your Mockup in Markup – a fantastic argument to ditch Photoshop and design straight in the browser by Meagan Fisher of Simplebits.
* Walls Come Tumbling Down – the original presentation by Andy Clarke of Stuff and Nonsense that inspired the preceeding article.
* This fabulous idea that allows me the exploration of cutting-edge technologies without forgetting the end user.

In addition to these inspirations, the new site will include a focus on typography and minimalism, both of which should provide a new spotlight on content.

What you’ll see as a visitor will be a constantly changing design as I will be working in the browser, and, for the most part, pushing updates to the live site as quickly as possible. While this is not the most professional approach, I will consider this site an academic case study and web development playground for the next few months. For those interested in design and coding, I will be posting periodic updates on the what, why, and how of the developing site. For those interested in areas of the site, I would ask you to not mind the mess, but the idea is that no proverbial under construction sign is needed, that the site will be functional and accessible at every stage.

Thanks for staying tuned and for your general interest.

Enabling cURL in XAMPP

admin — Sat, 12 Dec 2009 21:04:22 +0000

Implementing cURL in an XAMPP environment for the first time can cause a quick, early headache. The most common error seen is a simple curl_init() can not be found. Luckily, the solution is most likely simple. cURL comes included with Apache but not installed, so you have to go in and turn it on yourself.

Open up your php.ini located under the /php directory. The line that needs editing will read: ;extension=php_curl.dll. Simply remove the semi-colon to uncomment the line. Then restart Apache to finish the change!