Forum Moderators: not2easy

Message Too Old, No Replies

Should I use Blueprint for CSS for cross platform Wordpress template?

         

thewpfan

5:03 am on Aug 19, 2010 (gmt 0)

10+ Year Member



I am new at this and I need advice from you professionals with a lot of experience. Unfortunately, we do not have a budget for this so we cannot outsource it. However, I am interested in learning new technology, but I want to make sure I am following proper standards and making good code.

The project I was given is to design and implement a Wordpress theme that would look as it was designed on a Mac on several platforms/browsers (Windows/IE, iPhone/Safari, etc).

After designing the theme on Gimp, I am ready to start transitioning it to HTML and CSS. I started reading some blogs/forums that mentioned that using frameworks like Blueprint would make it easy to create CSS files for several platforms/browsers. Can you please recommend if I should use Blueprint? If not, can you please recommend a good CSS tutorial? Lastly, how do I check if my CSS is good?

Super_B

8:11 pm on Aug 19, 2010 (gmt 0)

10+ Year Member



If you want to just get something done quickly, you might start with a free, GNU-licensed WP theme and just change a line here or there to get the look you want. Building a WP theme from the ground up can be difficult for a new developer, so don't be afraid to under-do it at first. What you create doesn't have to b built perfectly, as long as it pays the bills.

Having said that and properly placed profit above perfection, there are others who may disagree strongly with me, but when it comes to learning something new, I say it's best to learn it from the ground up.


Learning:
[html5doctor.com...]
[google.com...] (not trying to be a jerk. There's a lot of good stuff out there.)


Libraries (like Blueprint):
Skip Blueprint, jQuery, etc., and just try hand-coding it by copy-pasting rules from reference sites like w3schools.com; otherwise, it will take forever to know what you're doing.

Once you learn the fundamentals, you'll be free to use whatever library you like (I never use CSS frameworks, but I almost always end up using jQuery) and you'll have an ability to adapt to changes in the technology, like all the cool new stuff in HTML5, h.264, etc.


Validation:
Install these naaoww

[getfirebug.com...]
[users.skynet.be...]


Lastly:
Since you're going for that OSX look on multiple platforms, I'm guessing that you're using a Mac. It's worth your while to install VMWare Fusion or Parallels and a Windows virtual machine for testing because every stinking version of Internet Explorer will render your design differently. It really is like developing twice for each browser. I'm not trying to scare you, just equip. Good luck.

thewpfan

12:40 am on Aug 20, 2010 (gmt 0)

10+ Year Member



@Super_B

Thank you for your recommendations. Coincidentally my best friend calls me "Super B". I have a bad habit with trying to create the perfect product with extensive research, but am working on taking more of an efficient/profit based approach.

Would you really recommend getting into html5 when browsers like IE do not support them yet?

Super_B

3:54 am on Aug 20, 2010 (gmt 0)

10+ Year Member



Ha, small world. Nice to meet another Super B ;) My name is Brian, so that's where it comes from, here.

I think the design-conscientious tend to be perfectionists, too. I know I am, and my desire to make perfect by convention (instead of just make profitable) often overcomes me.

Good question about browser support. There's a whole can of worms, there, but the short answer is yes, I'd recommend learning HTML5 because 1) it will render the same as using 4.01 strict, and 2) you'll know what features will be supported in the next year or two.

You can always make your own informed decisions about what features to try to use. The important thing is to test, test, test in all the web browsers >90% of your audience uses. It doesn't have to do black-flips and drop-shadows in every browser out there (IE6 users probably won't notice the lack drop-shadows, anyway), but it should at least work so no one is turned away.

Also, you should know about Google's HTML5 Shiv for IE. It gives IE the ability to treat tags it doesn't recognize as DOM elements, like HTML5's <article>, <section>, <nav>, etc. The JS is hosted by Google's servers, so there isn't anything you need to download. Simply copy and paste three lines:

[code.google.com...]


BTW, these IE conditional comments won't pass validation, but they sure do get the job done:

[ejeliot.com...]

thewpfan

7:03 am on Aug 20, 2010 (gmt 0)

10+ Year Member



@Super_B

My nickname came from a LONG story that I may share some day, but can`t right now. I gotta get this project done so I`m going start with your recommendations.

Thank you again!