Skip to:
Content
Pages
Categories
Search
Top
Bottom

Replacing images with CSS3 gradients, WordPress backgrounds and sprites

  • Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I’ve been thinking about a few enhancements theme wise wanted to float out there as ideas before put forward into trac.

    What are opinions on:

    1. Background support using built in WordPress one – would I think get a bit more ‘mileage’ out of the default theme for many
    2. CSS3 gradients not images for gradients
    3. Where we do have images going with sprites and having rollover effects perhaps or at least making that a possible

    These are all fairly simple tasks I’d be more than happy to provide patches / code to go with the enhancement requests. Just wanted to know what was the thoughts on whether a good idea or not.

Viewing 19 replies - 1 through 19 (of 19 total)
  • Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    yeah first topic! :)

    I think we need an IE specific CSS file for things that can now be done with CSS. Gradients and alpha for the main CSS file and then fall back to images for browsers that do not support it. Also, fixes for older IE bugs could be put in that file.

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    Oh and I think logo upload should be added to the admin and the site name replaced with this image.

    Something to keep in mind is that any change to bp-default will require a lot of child themes to be updated by a lot of designers. I imagine we’ll do a new default theme around the BP 1.4-1.5 timeframe.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    Edit// wow lots of comments in the time it took me to write that :)
    Images have always been and remain the safe approach, although CSS3 has been around for better part of a decade *sigh* it’s only recently that sufficient vendors have got behind some of the more interesting properties and in some respects support may be said to be still a bit at odds from one to another, plus the IE family does not yet support a significant proportion of CSS3 properties we have to wait till IE9 emerges so some form of fallback will need to be provided.

    Have for a long time advocated the bells and whistles approach for browsers that handle them though and simply letting IE look plain and tawdry – it should have been the de-facto approach taken many years ago by frontend developers but the opportunity was missed as a means of educating clients.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    @modemlooper yep Conditional Comments are the preferred method now and for some time in providing IE filters and corrections. Primary stylesheets should never contain hacks or filters – should never contain hacks period really!

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    @djpaul I had to update all my child themes with the 1.2.6 release so I’m not seeing why worrying about designers or child themes is the issue. Trust me, they want more enhanced features, so do end users. The issue is not adding things and having to update it’s giving designers a heads up and that’s part of what this group is about.

    I think 1.4 is a great timeline for adding theme enhancements / updates. That way BP can say hey you theme designers we are creating a new default you have been warned and then they can merge their themes.

    Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I am actually going to say conditional comments suck. I don’t agree they are ever the best method in my experience. If we are going for lowest denominator why can’t we just have fall backs. Simple if gradients show if not just colour? I see this possibly as a point for debate as everyone has their thoughts and I come from a 100% designer / front end point of view – refuse to attach word developer to my theme work.

    I am a total believer personally against the develop for lowest browser. That way you never need extra stylesheets – personally the idea of an ie 6 style sheet sorry makes me shudder as feels wrong. What is the exact argument for that or reason as I want to catch up on it as seen it mentioned a few times now and don’t want to argue against something I may not have the full picture over as egg never suits a face? Best we don’t get me started on using filters and hacks because it’s a grumpy place :) totally agree against that one.

    Can I take from this though the background is about the only non debate point so will put that one forward – it’s a simple thing but that one I reckon could add something to the theme? I’ll take my dive into trac with that one then maybe there should be some warning ‘awoga designer using trac’ :P

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    @karmatosed No CC’s don’t suck :) they are the MS recommended method of dealing with what they finally acknowledged as a pretty broken family of browsers – at least until IE8 came along – also nearly every major developer in the frontend world acknowledges there use as fitting and proper approach.

    The overwhelming benefit of them is that they allow you to remove all offensive css filters out of the core main stylesheets and present them for IE users alone right minded people using ‘Modern’ browsers are not forced to waste their bandwidth downloading pointless files or bloated and possibly problematic stylesheets full of hacks that may fail or cause issues down the road – only IE browsers read and parse these files all other browsers ignore them.

    Rule of thumb has never been develop for the lowest browser the guidance always given to aspiring frontend developers was that they must develop for ‘Modern’ browsers then work back correcting for any broken browsers or older generation ones. To work the other way around is a recipe for disaster.

    Thus the CC is in fact a very good thing allowing us to safely provide rules for IE6/7 also you can use CC’s in a rather smart manner if you are inclined by working a negative CC where IE is told to ignore the CC Modern browsers naturally ignore the ignore and will parse the file. We can also provide scripts such as the hover.ht files and other JS scripts designed to provide missing functionality for IE in CC’s so that they also are not forced on browsers that do not need them.

    As for the fallbacks you mention in opening yes you can have them but not in the main files, all modern browsers have handled such things as alpha channels correctly for the last 8 years :) the fallback if required to a nasty gif or just plain graphic is provided for within the CC hidden stylesheet .

    Developer / Designer; to be honest if one deals with code you are a developer Designers only deal with creating graphics and graphical layout realisations, never worked with a graphic designer yet who could code a layout correctly.

    Background? sounds good, not 100% sure I got what you were referring to but if it’s stuck into trac we can download patch and run as a test.

    Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I don’t agree with your view of designer /dev but that’s such a debatable point it could have countless blog posts and books so lets leave that one. We all attach labels to each other and ourselves – let me attach my own label and definition of the word designer ok :) I think we come from very different angles as you will note I have not used the term graphic designer that isn’t a web designer :) That said everyone can learn from someone and I’m a great believer all opinions are valid on some level. If we stop listening we stop learning end of story.

    Personally I don’t agree and not convinced at all for this need, we are all entitled to our opinions and coding methods but this probably isn’t the place for that discussion or at least not the topic thread. I am not alone in believing CC’s are not the way forward perhaps ‘suck’ was a flippant term not at place in a discussion but I was trying to avoid a hefty discussion as felt not the place for it. Maybe we can debate this another day and in that comment I do not state it’s not worth a strong debate as it is on both sides of the argument – it always be until we have browser utopia and unicorns rule the world……

    That said not entering into debate I just want one point of clarity on using JS to add missing functionality. Are you saying this is a good idea as that’s impression I get from what you say, if so this seems in contrary to your ease of use and simple approach:

    “Rule of thumb has never been develop for the lowest browser the guidance always given to aspiring front end developers was that they must develop for ‘Modern’ browsers then work back correcting for any broken browsers or older generation ones. To work the other way around is a recipe for disaster.”

    What cases would you feel justify a JS use rather than just being graceful and offering no ‘bells and whistles’ which is the method I’d suggest we should adopt?

    I am all for the simple approach not over complication to get to work for a browser that is on the lower end of the scale. Yes I am aware this is also a point of debate that we could be here until cows home again.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    At risk of dragging the thread off tangent and having to moderate myself -oops can’t in this group :)

    No wasn’t saying it was a good idea just that it was an approach that often had to followed if having to provide functionality for broken browsers – that was due in part to the, imo, to the fact that developers backed themselves into corner trying to get IE to perform to the level that the then modern browsers did – leading to a false sense for many years that there was nothing wrong with IE.

    JS has no real overriding necessity ever! at best it provides a – possibly? – smoother more fun! UI, it has always been an exploit waiting to happen due to it’s inherent weaknesses. The use of JS is in adding those bells and whistles and that’s fine I love em as much as the next person, but smart developing does follow the maxim of build first then add ‘behaviours’ behaviour layers much as presentation layers are a secondary consideration thus we have that term ‘Graceful degradation’ if JS is used it must degrade in browsers that do not support it leaving a usable site; this seems to be increasingly overlooked though in recent years and too much JS is flung at sites without real testing.

    Personally I was an extremely early adopter of jQuery while others were dancing around with the likes of scrictaculuouse[sic] throwing weighty effects at pages i liked it’s lightweight approach to simply providing a clean and easy syntax to write with and I love to use it whenever I can to enhance a page and have no qualms about doing that but I do always build a working site first then add that layer.

    As you say these sorts of matters can be discussed til the cows come home, and once I’m on my soapbox :)

    Oh and Ajax don’t get me started on Ajax – it’s fun though but oh so wrong :)

    Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I dunno the thought of someone moderating themselves would be funny and I’d maybe suggest you wear hats to denote the roles :)

    I think the mere fact we’re having this discussion is a positive step for BuddyPress hopefully at least it shows that themes and the CSS stuff is having a healthy debate around it along with ‘what does it do’ – that is not me claiming it hasn’t been central in the past Perhaps even dare I suggest BuddyPress could be an example of graceful degradation done well CSS wise.

    Bottom line I think we’re at different angles same concept type of thing. Personally I’m still hmmm and ‘CSS doing that is a good thing how?’ over a lot of animation stuff whilst on one hand going oo that’s a great animated tardis… I’m no server log junkie but something just doesn’t sit well on a lot of those levels with me and that. I think a lot of it gets put in just ‘because’ and it should be more considered than that. I think one aspect of design needs to go into CSS currently and that is filtering – add something in and analyze is it really needed and why. We do it with design so why when we come to CSS do we think it’s ok to go nuts?

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    Well BP does not really support IE6 now so that argument is null. Though, as somebody said before wants to help inlcude a conditional style sheet then go for it. Luckily Microshaft has come to their senses and is playing nicely with the rest of the internet and IE9 seems like a move in the right direction.

    My big issue with IE6 support is the only reason people are dealing with it is because businesses wont upgrade do to internal software only working on that browser. So why are we catering to businesses? It’s their choice to stay far behind the rest of the web.

    I wonder what the percentage of IE6 visitors are on this site?

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    Well discussion is always good and I’ve tried to push that as much as possible on the site. a focus on themeing is what I’d like to see under way but overall not necessarily with a specific focus on the bp-default, cleaning up core files, removing extraneous markup,moving as much markup out of core files as possible, leaving the job of themeing or of laying out pages where it belongs in the presentational layer in MVC terms.

    I think overall we are probably similar in outlook more so than this thread may have suggested, I position myself as a die hard Standards focused coder supporting the initiatives of the W3C and of valid well formed semantic markup above all else, first and foremost etc, in terms of bells and whistles I view a lot of it with a guarded sense of caution there is a worry recently that we have moved back to the dark days of DHTML and the mess that used to produce many sites and applications are becoming bogged down by slow loading pages calling too many conflicting scripts which become impossible to debug when things misbehave.

    This isn’t necessarily about CSS although these types of applications do tend to start to produce CSS that doesn’t flow well with too many snippets here there and everywhere and a symbiotic relationship between the presentational layer and the DOM that starts to become a little unstable.

    Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I totally agree there are many sides being said here but all of the same conversation. I also actually although you may not be getting the impression come from a standards background but one persons standard background is never another’s exact point that’s why w3c spec takes so long :) I am though a minimalist at heart and look at the simplest and smallest mark up. IE6 I totally agree if not supported by BP shouldn’t even be on radar that’s a no brainer.

    Even aside from this I guess 1.4 /1.5 for the next theme brings up the html5 anyone question….

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    @modemlooper Well BP does not really support IE6 now so that argument is null. No it’s not Null, it’s not for BP to say this really a user uses whatever browser they choose many still have no choice but to use older IE versions do we deny them a basic and usable experience?

    Though, as somebody said before wants to help inlcude a conditional style sheet
    It was me that mentioned that I was going to work up a CC stylesheet for IE but If that’s the reaction that amount of work gets I shan’t bother ;) creating that set of styles is not throwaway work and I have a living to earn :)

    So why are we catering to businesses? it’s not for us to say who we cater to! and anyway you DO want large organisations taking up BP and indeed there are and more are sniffing around deciding if BP is mature enough to invest their time and efforts in.

    For BP to survive and flourish it needs to take care that it isn’t simply an application that is the provence of the hobby coder or hobby site owner not that there is anything wrong with that whatsoever but you need a wider base.

    Site browser stats are misleading as a particular site has a particular audience I would guess very few IE visits on this site?

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    Sooo, we are all in agreement then. IE6 blows and nobody wants to do BP fixes. :D

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    Well I don’t now; you’ve put me right off, thought it be noble of me to :(

    I’ll concentrate my efforts where they’re appreciated :p

    Avatar of Tammie
    Tammie
    Moderator

    @karmatosed

    I don’t think anyone was aiming to put you off anything it was more a point of opinion on my sole behalf and I’m just one voice. Perhaps float it and gain opinion and see if taken up then do. May find more feel way you do, may find more feel way I do.. who can say until you float it. I thought we were actually having at one point a positive conversation so can we focus on that because I think progress can be made to work towards what seems to be a goal we all want – better standard code. Was IE6 even the focus of your conditional sheets? If it was fair enough but I thought you mentioned all IE browsers. Surely that’s worth if you feel passionately about it being added as an idea see who likes it, and you certainly came across as passionate about it which rocks in my opinion.

    Maybe that is if nothing else a good point for this group? A place to float out there ideas and get conversations like this going on?

    Avatar of @modemlooper
    @modemlooper
    Moderator

    @modemlooper

    FYI: http://wordpress.org/extend/plugins/ie6-support-for-2010-theme/

    Maybe it can be a plugin.

    Also a quote fromt the creator of 2010 when asked about IE6 support.

    “Unless there’s someone interested in submitting patches, I don’t plan to include any hacks for IE6 bugs. I understand the need for backwards compatibility, but it’s been almost four years since Microsoft replaced Internet Explorer 6 with version 7. Twenty Ten should work fine in IE7 or higher.”

Viewing 19 replies - 1 through 19 (of 19 total)

The forum ‘BP-Default’ is closed to new topics and replies.