Choose Your Theme
Warren Shea

Archive for the ‘Blogger’ Category

(Major) Site Updates

Sunday, April 24th, 2011 at 2:32 pm

About a week ago, I started some heavy dev on warrenshea.com.

Here are my fixes:

  • The ul/li spacing on bullets (for all 4 themes)
  • Added FourSquare and Flickr (signed up today!) to my Social Media Icons
  • Twitter feed is now taken via PHP as opposed to JavaScript
  • All JavaScripts have been combined into 2 JavaScripts: JavaScript libraries (which contains JQuery, jQueryUI, SWFObject, Konami Code, and JQuery prettyPhoto libraries) and the regular javascript file (containing various inline JavaScript, etc). Originally I wanted a single JavaScript file but I figure that the JavaScript Library file doesn’t change but gets loaded every time. This way, the 143kb file, which is of considerable size, can be loaded via cache while the 22kb file that changes dynamically with each theme and page will be loaded each and every time. Better to do it this way than to load a 165kb (143 +22) file every time.
  • All CSS has been combined into one as well, including media print and media screen
  • Megaman theme has combined 18 images into one sprite.
  • Blogger theme has combined 4 images into one sprite.
  • Naruto theme has been tweaked slightly, the kunai is now gone and it’s now a functional, usable site. I’d been meaning to do this for ages…but I was lazy
  • Gmail (and Megaman) themes used to use JavaScript to determine the width of the main content. It no longer uses JavaScript and the width is determined via CSS. This means that the page loads faster on both these themes (this is due to the width not longer loading during page load, as it was before via JavaScript). Now it loads “instantly”.
  • Due to the revision, all pages should be 1/5-1/3 smaller in file size, as well as have significantly fewer server calls. It’s quite a considerable improvement!
  • On a backend side, made it so that only 1 “sidebar.php” (the right navigation) file exists, all in one spot as opposed to the old way, in which every directory had it’s own sidebar.php…just another way of centralizing things

To Do:

  • Any (unseen) fixes due to the code changes
  • I’ve done .GIF sprite conversion but I still need to do .PNG sprites…and, not sure if it’s possible to do repeating background images with sprites but I found it not possible…so all my repeating images are still single, standalone images. Will need to research that more.
  • Professional Theme, Simple Theme (already sorta done…), and Mobile Theme
  • Fix Mega Man item preload image

While the changes are mostly unseen, it’s not to say they aren’t felt through the hopefully faster load times and less server processing…or is it more? Less client-side stuff at least, which is a good thing…it also makes it easier (for me) to create more themes. Anyways, glad it’s done. I worked pretty crazily on this the last 6 days….it honestly felt a lot like when I played Zelda. I’m a creature of….obsession. Once I start something that’s within my grasp and motivation to complete, I just spend all my time on it. The real question is…what’s next?

Radical Web Ideas

Tuesday, April 19th, 2011 at 9:03 pm

I have begun a revamp of my entire site (warrenshea.com). I started yesterday but I was finding warrenshea.com/megaman too hard to fix while maintaining the other themes.

I can change the stylesheet but I can’t change the name of divs in the HTML without changing global code, which means I would have to change the other styles. Anyways, big pain.

What I decided to do, temporarily, is make worldofwarren.com my warrenshea.com dev site, at least while I do these major updates. You could check it out but it might be down…I figure this will take some time to do. I’m excited though.

So anyways: Radical Web Ideas

  1. Combining Stylesheets
    Turning
    -reset.css
    -stylesheet.css
    -stylesheet_blog.css (the wordpress css)
    -print.css
    -prettyPhoto.css (the image viewer)
    into one css.

    But the thing is, there are actually 4 stylesheet.css and 4 stylesheet_blog.css files, one for each theme. So instead of combining 5 stylesheets together, it’s actually combining 11 stylesheets together. That’s actually quite difficult.

    So what I’m doing go to is load a .PHP with a CSS header (instead of a .CSS). I’ll put all my stylesheets for every theme in there, but only output the necessary CSS needed, keeping to stylesheet small, all in one place, and have it only do one call to the server.

  2. Combining Javascripts
    Same deal as above. Rather than call Google and the jsapi (making numerous calls – jquery, jquery-ui, swfobject), I will house all the scripts locally, in one file as well. Also, I call a bunch of scripts too…custom one. I’ll centralize that as well
  3. Get Twitter feed via PHP and Twitter API and output via PHP, w/o JavaScript
    Rather than need Twitter’s JavaScript to load to make the rest of my site load, it will all be PHP, reducing a JavaScript call.
  4. Re-write HTML for many of the pages. A year ago, when I built the site in Apr, I thought my skills were great. Now, I feel my skills are just as good but I can see how bad I used to be. “You don’t know what you don’t know”.. Anyways, I plan to fix some terribly badly named divs, switch some ids to classes, etc.
  5. Re-evaluate my wordpress changes and code/css for those items
  6. Re-do the RSS feeds…currently they’re outputted with wordpress widgets…I want to change it to standalone code written by myself.

Overall, the point is optimization. Yes, my site loads slow (especially lately… :S) and it’s probably me.

Right now:
1 – HTML Request
5 – CSS Request
9 – JS Request

Ideally I want to make it
1 – HTML Request
1 – CSS Request
3 – JS Request (maybe less if I can…)

Anyways…yeah, working on worldofwarren.com as my dev site.