Warren Shea - World of Warren

Archive for the ‘GMail’ Category

worldofwarren – CSS & PNGs optimized…sorta

Wednesday, February 27th, 2013 at 11:38 am

So when I built worldofwarren.com, I thought it’d be a great idea to use 1 CSS file (in PHP), and pass the theme as a parameter into the “css” file via querystring and have the php figure out what to output. I guess the + side is that the php would do server-side compilation of the code. So I thought maybe it was faster. Also, I’d only have to maintain 1 css file and I wouldn’t have that much css duplication in the php file because styles that could apply to 2 themes could go under the same if statement.

But…I realized…that was probably incorrect, in terms of optimization. Because each time a user requested the “css” file, the server would have to serve up different php compiled code, based on the querystring. I don’t think such a file can be cached as well (can php be cached? it likely changes all the time…)…and cache without the need for server-side code is probably the fastest method to achieve quick load times.

So I’ve created separate CSS files, 1 for each theme, to improve load.

I’ve also re-optimized my PNGs. Someone told me about a site, http://tinypng.org/ that greatly reduces PNG size, while keeping the quality relatively similar. I’ve cut down the images on warrenshea.com from 6MB to 2MB. It was like shopping at a closing Zellers: HUGE SAVINGS!

I guess I’m learning more and more about the web and thought it’d be good to apply these optimization methods to my sites. One of my interview questions is “How would you optimize page load of a site” so if anyone ever asks me that, I not only want to be prepared, I want practical experience!

I’ve also been doing quite a bit of photography lately. I’m at 13/43 statues. From 1/8 to 1/3 done :) I’m getting there…

Posted in All Posts, GMail, Google+, Megaman, Naruto, Web Development, worldofwarren.com | No Comments »

Google+…wuhhh?

Thursday, April 12th, 2012 at 12:53 am

Google+ has changed its layout.

Check it out here.
…also, I get a nice Google+ hit cuz if you’re on this page, maybe you’ll wanna hit my Google+ profile ;)

Anyways, back to the layout changing. You’d think that doesn’t matter to me too much…except my main worldofwarren.com theme right now is (old) Google+. And let’s face it, as much as the GMAIL theme was interesting/practical, it’s simply just uglier than the Google+ version. Fluid layout is tricky.

Things I like about this Google+ redesign:

Scrollbar (require Google Chrome to see it…boourns)
Left Icon images/Navigation that is position:fixed (so it’s always there). Pretty and I like it. Which means if I revamp MY Google+ layout, I might copy that. But I doubt I’ll revamp my layout cuz…

Things I dislike about this Google+ redesign:

Cover Photo. Um, a little TOO similar to Facebook now duntcha think? Innovative? No.
While I like the Google Chat appearing if you have “extra” room…W.T.F. is with that awkward moment between when the window is perfect size without chat and then you horizontally increase the window…and then the chat pops up. For a moment in between those 2 states, it looks hideous!
Hmmm…

Interesting, it looks good on 1024 width (no chat) AND 1280 width (chat). The only default resolution width between those numbers is 1152×864 which deals with 1.5% of people. Effectively, they’ve found that perfect number/size for that chat column. And I can see that Google+ is MEANT to be seen on an exactly 1280xwhatever resolution. Everything fits PERFECTLY at that width. Interesting. HOWEVER.
For larger resolutions, like a widescreen monitor for example, what is with ALL THAT EXTRA WHITE SPACE. Could that look more hideous? I mean…it’s funny, it’s like how GMAIL is. The reason I liked the old Google+ theme was that it was like Facebook/Twitter. Fixed width. Centered Content. WINNING SOLUTION. But no, this is Fluid width…regarding white space. Fixed width, Left Aligned regarding content. EW. REGRESSIVE UPDATE?!

So there are PROS and CONS to the redesign but I’m fairly disappointed. I don’t quite get what was wrong with the old design.

With both my GMAIL and Google+ themes being replaced by newer Google themes, I’m starting to think maybe I shouldn’t copy themes anymore >_< ….but i’m not a designer and IT’S JUST SO MUCH EASIER than making a theme by myself. I’m a developer, I just want to develop the theme….not design it. What do I do about my themes? Suggestions…?

Posted in All Posts, GMail, Google+, worldofwarren.com | No Comments »

Google’s new top black bar

Sunday, July 3rd, 2011 at 7:18 pm

As Google+ has been released, at least in closed beta, I notice they’re generally doing design upgrades to Google products. Good for them…sorta. See, as much as I think Google might be TOO simple…I really hate the new top black bar they have. They have a clean, white, simplistic design…it goes well with theme-less browser colors. But this black bar, it appears between the browser and the page…and it’s just…argh, I hate it.

I’m hoping the backlash causes them to revert back….but if they don’t, I should update my GMAIL theme(s) to follow suit. It’s an easy change, and I want to/could implement it now…..but I’m hoping Google gets smart and changes it back.

Anyways…I was supposed to spend all day working on warrenshea.com…but I haven’t done anything :/ I spent almost an entire hour re-doing my Gmail labels. What can I say, I like to be organized.
Hopefully, I’ll be productive tonight. African Lion Safari tomorrow!

Posted in Daily Randomness, Design & Art, GMail, Web Design | 1 Comment »

Site Updates – Secondary content boxes + WP 3.1.2 + GMAIL Theme

Saturday, May 21st, 2011 at 1:41 am

Apologies for repeated content…it’s better centralized in this post than the last

Secondary content boxes
Created a PHP Proxy to retrieve Cross-Domain XMLs (RSS Feeds).
Modified the AJAX Request to correctly retrieve various feeds.
With the help of my co-worker, implemented concurrent the AJAX Blog requests.
Boxes only show (with a jQuery fadein) when all the contents of that box have loaded.

Result: Rather than have WordPress load the RSS and have the site load and compile via PHP and render the HTML all at once, now the site will load first, and retrieve the RSS after/during load.

Upgraded to WP3.1.2
Haven’t updated my WordPress in a while…because when I do, I have to make code changes to the files WP changes.
With my recent blog changes, it actually eliminates much of the changes I have to do…updating WP is twice as easy.

GMAIL Theme
Google has changed the top of their page, as well as GMAIL’s top. I modified my site to mimic it. Nothing too fancy. Hover over the top links to see…

Timeout
I think I solved the timeout issue. Also, I know why I never got it…the issue was related. Anyways…let’s see how it goes but hopefully, it’s gone!
(this is like, my 5th time saying that…but maybe it’ll be true this time!)

Posts
I’ve been removing some of my…questionable posts. Well, just “Drafting” them. You will see why in a few weeks or months…

Posted in All Posts, GMail, Site Updates, worldofwarren.com | No Comments »

(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?

Posted in All Posts, Blogger, GMail, Megaman, Naruto, Site Updates, Web Development, worldofwarren.com | No Comments »