Skip navigation
BlancTeamWebMaster
BlancTeamWebMaster
Currently Being Moderated

HTML5 and BC

Jun 5, 2012 8:01 AM

Tags: #html5 #business_catalyst

Hello,

I was wondering if there are any limitations with using HTML5 on BC sites? I've been keeping an eye on the progression, and I'm exited for the possibilities. I use BC for about 90% of our clients and would like to better understand how incorporating some HTML5 into future BC sites would work.

 

Has anyone be using any HTML5 on BC sites? If yes, any examples you are willing to share?

 

Thanks!

1468 Views   11 Replies   Latest reply: thetrickster888, Jul 13, 2012 9:47 AM
 
Replies
  • thetrickster888
    Currently Being Moderated
    1. thetrickster888,
    Jun 5, 2012 11:42 AM   in reply to BlancTeamWebMaster
    Report

    I currently have issues implementing the HTML5 Boilerplate setup on BC sites.  A big part of the boilerplate hinges on IE conditional css being applied to the HTML tag if their browser is IE so that you can setup stylesheets to target IE. For instance: ".ie6 .myfeature { zoom: 1; }".  BC currently strips out those conditional comments and places them in the HEAD of the document once it's rendered to the user, making targeting IE harder. I've had to reposition those IE conditional tags around the BODY tag instead which still works but requires editing.

     

    Also, there's some pretty neat stuff they do with the .htaccess file in H5BP like compressing assets, setting expiry and caching, etc. which cannot be done on BC since it's a proprietary server architecture that isn't based on Apache.

     

    I assumed all the latest content types are supported by BC so if you upload an .ogg file to the server, you should get the correct MIME type even though I haven't tested it myself.

     
    |
    Mark as:
  • BlancTeamWebMaster
    Currently Being Moderated
    2. BlancTeamWebMaster,
    Jun 6, 2012 11:20 AM   in reply to thetrickster888
    Report

    Hey Trickster,

    Thanks for the feedback. I've already had to deal a bit with BC stripping conditional comments, annoying to have to work around the body tag, but as you said, it works. Have you (or anyone) used bootstrap at all? I'm trying to weigh my options and find which resources I can utilize with BC to save some production time.

     
    |
    Mark as:
  • thetrickster888
    Currently Being Moderated
    3. thetrickster888,
    Jun 6, 2012 12:48 PM   in reply to BlancTeamWebMaster
    Report

    Bootstrap for the most part works great. If you use the customize option at http://twitter.github.com/bootstrap/download.html you don't need to compile the LESS to CSS locally on your computer.  Personally, I prefer SASS to LESS so I use the SASS version of the CSS code at https://github.com/jlong/sass-twitter-bootstrap#readme

     

    All the javascript will work great and I'm currently using the latest Bootstrap build with responsive functionality to build a simple site for a local deli that is optimized for mobile/tablets and he can edit himself using BC's InContext Editing.  All is working fine for me with Bootstrap.

     
    |
    Mark as:
  • BlancTeamWebMaster
    Currently Being Moderated
    4. BlancTeamWebMaster,
    Jun 12, 2012 12:37 PM   in reply to thetrickster888
    Report

    Hey trickster,

    Thanks again for the info. I'll definitely be experimenting with bootstrap and BC in the near future. It's encouraging to hear that your also using responsive design with BC! That was something I was also wondering about.

     
    |
    Mark as:
  • Chad - BCGurus.com
    Currently Being Moderated
    5. Chad - BCGurus.com,
    Jun 15, 2012 2:35 PM   in reply to BlancTeamWebMaster
    Report

    Hey thetrickster888,

    Just wondering how you're working with your templates? I've used HTML5 Boilerplate and if you FTP the templates (I'm using dreamweaver) with the IE conditionals they are kept intact. But if you use the BC editor at all they are removed.

     

    Another one I like is Skeleton, http://getskeleton.com/ 

     

    Chad Smith | http://bcgurus.com/Business-Catalyst-Templates for only $7

     
    |
    Mark as:
  • thetrickster888
    Currently Being Moderated
    6. thetrickster888,
    Jun 16, 2012 8:37 AM   in reply to Chad - BCGurus.com
    Report

    The primary reason right now for using BC is for it's site editing features

    like inContext Editing so I can't use conditionals around the HTML tag

    since it might get removed when the client is saving the file so as I

    mentioned above, I just adapted the conditional to use the BODY tag instead

    of the HTML tag and it's worked fine thus far.

     
    |
    Mark as:
  • graugans Design
    Currently Being Moderated
    7. graugans Design,
    Jul 12, 2012 1:30 AM   in reply to thetrickster888
    Report

    Hi trickster888,

     

    I found that editing Templates from DW keeps those CC around the <html>-tag and BC seems to implement in every site without problems. BUT touching and changing the template file in the admin area immediately overrides the CC and changes all sites to XHTML. Is this correct? Can I use CC without hassel when not touching the template-files in the admin-area? I havent tried out too many files, it might give problems somewhere deep in the system...

     
    |
    Mark as:
  • thetrickster888
    Currently Being Moderated
    8. thetrickster888,
    Jul 12, 2012 5:33 PM   in reply to graugans Design
    Report

    As I mentioned above, the core reason I usually use BC over Wordpress for a client is because of the online editor that my clients can use to update the site.  Since it strips out the Conditional CSS on the HTML element, I just wrap it around the body element instead which doesn't cause any issues and you can still style for ie like: .ie6 #mydiv { zoom: 1; }

     
    |
    Mark as:
  • Liam Dilley
    4,237 posts
    Feb 28, 2012
    Currently Being Moderated
    9. Liam Dilley,
    Jul 12, 2012 6:37 PM   in reply to thetrickster888
    Report

    There is no reason you shoukd expose elements to clients that will effect core HTML in that way. With content holders, web apps and good templates BC users 99% of the time shoukd edit and add content.

    I see people with these issues all the time which surprises me because I know I am not the only be that's not having them.

     
    |
    Mark as:
  • graugans Design
    Currently Being Moderated
    10. graugans Design,
    Jul 13, 2012 1:45 AM   in reply to Liam Dilley
    Report

    I dont understand what you mean, what have Content holders and Web Apps to do with the ability handle ie- issues? And as I could experience so far changing Templates in the Admin area lets BC change a HTML5 doctype to XHTML. Does that also happen when client edit in Jncontext editing?

     
    |
    Mark as:
  • thetrickster888
    Currently Being Moderated
    11. thetrickster888,
    Jul 13, 2012 9:47 AM   in reply to graugans Design
    Report

    BC works like this: If you have a webpage that uses a Site Wide Template and the template has HTML5 doctype BUT your page that uses the template has XHTML doctype, that doctype will override the template's doctype.  Your best bet is to avoid using a doctype at all on page content since your template already establishes it. You can just use <head></head> and <body></body> in your page content and not use any doctype. Don't worry if it's not valid HTML since when the Site Wide Template gets rendered around your page content, that doctype will be present. Make sure your clients aren't somehow importing new pages into the site via Dreamweaver which will usually use the XHTML doctype by default when creating an HTML page.  If they want to create a new page, create it in the BC admin and it doesn't add any code.. it's just a blank canvas when you create a page in BC. If you don't use a template, however, and there's no doctype in your html page, BC will use XHTML doctype by default.

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (1)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points