Forum Replies Created
-
AuthorPosts
-
alozzyMember
For now, I've switched from using "Open Sans" to Roboto as the latter looks much better in IE 8. There were only three places in the style.css file to change the font-family declaration and only one place in the function.php where the GWF is referenced.
alozzyMemberThis article is interesting:
http://www.kristengrote.com/blog/articles/google-web-fonts-playing-nicely-in-every-browser
Perhaps the real problem is that the Executive child theme uses multiple font weights of the Open Sans typeface, which IE 8 doesn't understand. So, IE8 renders all Open Sans styled elements with the "standard" font weight and it's that weight that looks bad??? Confused...
According to that article, I could use the conditional classes technique to create a separate class for IE 8 or older and then, in the child theme's style.css file, create "oldie" versions of the fonts/weights declarations where needed.
I think a separate style sheet might be less messy though...
I wish I understood exactly why the Open Sans GWF looks so bad in IE 8 and older. I'm really not sure if it has anything to do with the font weights per se. IE 8 does appear to be using the "standard" Open Sans font weight, based on what IE's developer tools shows me.
alozzyMemberI think you are suggesting something like this:
<!--[if lte IE 8]> <link rel="stylesheet" href="ie.css" /> <![endif]-->
Which I would place in the header by using the Genesis "Header and Footer Scripts" setting section. Next, I would need to create a separate style sheet (named ie.css) for IE 8 and below.
Is there any automated way of examining an existing style sheet to figure out what CSS hacks are needed for a given browser (for example, IE 8)? The Executive child theme has a large style sheet and it would be a pretty daunting task to manually figure out what hacks are needed for IE 8 and below...
In my case, the real problem seems to be that Open Sans GWF just looks like crap on IE 8 and older, but I'm not sure why...
Perhaps I should try using a different GWF, that might be the simplest fix. The Open Sans looks great on other browsers though.
alozzyMemberI tried inserting the following code:
<!--[if IE]> <link href="http://fonts.googleapis.com/css?family=Droid+Serif" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css?family=Droid+Serif:400italic" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css?family=Droid+Serif:700" rel="stylesheet" type="text/css"> <link href="http://fonts.googleapis.com/css?family=Droid+Serif:700italic" rel="stylesheet" type="text/css"> <![endif]-->
By adding it to the Genesis theme settings "Header and Footer Scripts" section under the heading "Enter scripts or code you would like output to wp_head()". After doing so, I found these code lines in the source page but there was no improvement in the look of the font in IE8.
Running out of ideas...
alozzyMemberWhat if I edit the child theme's function.php to omit the individual styles declaration (i.e. 400italic,700italic,400,700) as follows:
//* Enqueue Google fonts add_action( 'wp_enqueue_scripts', 'executive_google_fonts' ); function executive_google_fonts() { wp_enqueue_style( 'google-font', '//fonts.googleapis.com/css?family=Open+Sans', array(), CHILD_THEME_VERSION ); }
Will that result in all styles of the Open Sans font being enqueued, or only the "Normal 400" stlye?
I'm looking for the most effective yet simple method of using Google Web Fonts (as intended by Studiopress) while ensuring that IE 8 will render the font OK.
-
AuthorPosts