We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
CSS3; What do you guys think of using CSS3 in themes?
Topic Started: Sep 6 2011, 12:29 AM (823 Views)
Sjaeles
Member Avatar
Member
[ *  * ]
So, I use a lot of CSS3 in themes to achieve various effects, such as:
- Bevels
- "Glass" effect
- Shadows
- Inset/Outset elements
- etc

Though, I know some browsers (that would be, IE) don't entirely support CSS3. I personally don't really care, coding things to include IE is lengthy and somewhat pointless IMO.

But what do you guys think?
Offline Profile Quote Post Goto Top
 
Helena-ZNR
Member Avatar
No PMs on this account please
[ *  *  *  *  *  *  * ]
It's tempting to use a lot of CSS3 effects, but I'm pretty conservative about it, and and always check if the result in IE is tolerable without it before deciding to include it. (Unless I'm doing something completely experimental, like the Tidy Blue skin/theme.)

Catering to only those with the latest/greatest browser versions is fine for certain applications, but if you want your theme to be user-friendly, you do have to consider that a large part of the internet population (and your viewing clientele) still runs out-dated machines and browser versions. And there are always those users that cannot update even if they want to. For instance, I use WindowsXP which is fine and stable and works for most anything I need, and I use FireFox for most applications. However, WindowsXP will not support IE9, so the most I can update is to IE8. Therefore much CSS3 magic is lost to me if I am viewing in IE8. Also many institutions (and even US government offices) are still running IE6! If someone has no choice but to access a board from their work computer, can you imagine the mess they see in IE6?-- a browser that doesn't even support PNG transparency?

So I'm not saying not to use CSS3 effects, but that its smart to be circumspect about it taking into account the demographic of those who will be viewing the theme. A theme for an online gaming board can support much more current coding since the type of clientele they attract would tend to have up-to-date equipment. A general chat board with an older demographic might also tend to have more users with older machines and less than the latest/greatest software.
Offline Profile Quote Post Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
You have to be careful with CSS3, you don't want to overdo it and basically make a whole CSS3 theme if you're looking for user friendliness. Some people depend on CSS3 far too much for it not being well-supported or well-standardized yet; for example, a lot of people use CSS3 multiple background images instead of using JavaScript to add DIVs for the use of multiple background images, the JavaScript it takes to accomplish that is very little and essentially won't slow down the board, and statistics usually show that more than 80% of the population has JavaScript enabled, especially considering it's default on most browsers. Of course, it's always recommended CSS be used when it can accomplish something JavaScript can, but you have to take that to an extent. For the reasons I mentioned above, JavaScript is rarely harmful. ZetaBoards uses a mouth load of JavaScript on every board by default, so adding a few lines of JavaScript to accomplish something that will be better supported than CSS3 isn't really more hurtful than helpful to those that don't have the latest version of their browser or possibly even a browser that doesn't support CSS3. Thankfully, vendor-specific properties help CSS3 be better supported, which is why it's good to use them even though a lot of people say they're unnecessary since they're not needed for the latest version browser and only for older versions. Extra CSS isn't really hurtful at all, it's essentially instant. Heavy JavaScript and graphics is what hurts you the most. In my experience, the file size for graphics is often larger than JavaScript, so you have to watch out for that and it's another reason to believe that JavaScript won't majorly slow down your site. You really have to consider people that can't upgrade or don't know how to upgrade. For this reason it's good to use CSS3 sparingly and use JavaScript when it can accomplish the same thing, particularly when very little JavaScript is involved. There is HTC files out there that add CSS3 support for older versions of Internet Explorer, but these don't appear to be supported on ZetaBoards due to some technical aspects. Opera has some issues with specific CSS3 on table cells, like multiple background images and inset box shadows. Internet Explorer still being the most used browser is why you need to re-consider JavaScript instead of CSS3 or at least hacks that are well-supported in all browsers.
Offline Profile Quote Post Goto Top
 
Dakota
Member Avatar
over my dead body
[ *  *  *  *  *  * ]
I use CSS3 with EVERY theme I use and I personally am shocked if I don't use almost every CSS3 element possible by the time I'm done coding a theme. People who are too ~conserved~ about using CSS3 need to get over it because there will come a time when every browser supports CSS3 and they will be like"Omg idk how to code css3"
Offline Profile Quote Post Goto Top
 
Sith
Member
[ *  *  *  *  *  *  * ]
Latest version of IE supports CSS3 doesn't it?
Well, according to an online renderer, anyway.
Offline Profile Quote Post Goto Top
 
Pando
Member Avatar
Member
[ *  *  *  *  *  * ]
Sith
Sep 8 2011, 06:20 AM
Latest version of IE supports CSS3 doesn't it?
Well, according to an online renderer, anyway.
CSS3 isn't once thing, no browser fully supports CSS3. IE9 supports some CSS3 properties/features, but still doesn't support text shadows, gradients, border images, 3D transformations, animations, CSS3 text-decoration, object-fit and position, flexible box layout, and more. IE10 is supporting text shadow, gradients, 3D transformations, and the flexible box layout (not the current draft though), but is still lacking a lot.

As for me, I tend to use CSS3 for things, but I make sure it is usable in IE 7 and 8.
Offline Profile Quote Post Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
Dakota
Sep 6 2011, 04:49 PM
People who are too ~conserved~ about using CSS3 need to get over it because there will come a time when every browser supports CSS3 and they will be like"Omg idk how to code css3"
But the question is, is that time now? ;) Thankfully most CSS3 is used to add nifty effects to a theme, like shadows and rounded corners for instance. These aren't necessarily needed to make the page be rendered correctly. CSS3 that is used to essentially re-render a whole site should probably be avoided due to the lack of support it offers. People are way to scared of JavaScript because they think it will majorly slow down their site, like I said before, it's probably good that CSS be used over JavaScript, but when CSS3 is not very well supported or has lots of issues, you have to take that recommendation as a grain of salt. One of the things JavaScript is meant to accomplish is "enhanced user interfaces", which is what it can help accomplish with lack of browser support. The main thing CSS3 people use that can be better supported with very little JavaScript is multiple background images, for example:
Code:
 
$("td.test").wrapInner("<div class='middle-piece'><div class='left-piece'><div class='right-piece'></div></div></div>");
That's usually all the JavaScript required to make a 3-piece element, which will pretty much load instantly especially when it's before all other scripts, and like I said before, that tiny piece is nothing compared to the 138 KB (about) of JavaScript on ZB by default. The JS above, on the other hand, is 120 bytes.
Offline Profile Quote Post Goto Top
 
Geoffrey
Member Avatar
bury hatchets, keep maps
[ *  *  *  *  * ]
I use CSS3 a lot, so much easier than using divs.
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Creative Discussion · Next Topic »
Add Reply