SharePoint Success!

15 Oct
2012

This is meant to be a little encouragement in the midst of your day of end users telling you SharePoint is “hard to use,” “counter-intuitive,” or any other expletive adjective of their choice. With a little stylistic care and a little luck, you can have successes that take you a long way down the road of End User adoption!

A couple of weeks ago I wrote an article briefly describing a scheduling system built in SharePoint using nothing but 3 lists, a standard publishing page, and some jQuery.

The goal: to direct parents of 700 students to the online scheduling system for Parent-Teacher Conferences. All bookings had to be performed in the 10 days leading up to the 2-day conferences. A parent could book one slot with each of their child’s teachers, and each slot was 20 minutes long from 12 noon until 6pm. Keep in mind, no signup of this kind has ever been done electronically at this school. Previously everything was on slips of paper delivered in backpacks…followed up by half a day of phone calls to the secretaries.

The potential concerns:

  • no ability to “train” parents how to use the system, it must be intuitive
  • a good portion of the parent population speak English as a second language, with mostly Chinese or Korean as a first/only language, and about 2 dozen other languages next to those.
  • all bookings must be made ENTIRELY online (no call-ins, paper signups or emails…for consistency)
  • everyone must book their “own” slots (teachers nor secretaries can book time slots for parents)
  • parents must be able to change their time slots at will
  • priority must be given in the following order:
    • Teachers (to block certain slots for coffee breaks, etc)
    • Teachers who have children at the school (to book slots for their children)
    • Parents with more than one child in the school
    • Parents with only one child in the school (everyone else)

So, on to the success!

As of this writing we’ve just finished Day 8 of the rollout, and we have 612 students who have been booked using the system! By my count that’s just under 88% of children in the school. Now you’re probably about to ask “so how many phone calls and emails did you get?” I don’t have an exact number, but I’d say we’ve received about 20-25 calls/emails from people with “issues.” So with a 96% success rate (4% margin of error) on this first-time rollout, I’m happy!

A breakdown of the issues we did encounter:

  • a glitch where about 4 double-bookings occurred
  • a bug that wasn’t allowing users on IE7 to proceed with bookings (a simple browser switch did the trick until the fix was applied)
  • a glitch where about 5 or 6 parents were able to book slots that the teachers had blocked out
  • several login issues (separate from the actual scheduling system)
  • 2 cases of “my children” not appearing because of data integrity issues (extra spaces in names being pulled from the SQL server)

All that to say, don’t give up on your SharePoint end users! If a system is necessary enough and simple enough, you can bring them on board faster than you may initially have thought.

2 Comments

HTML5 video tag formats

14 Feb
2012

If you’ve played with the new video element in HTML5, you’re probably noticing the power it has to release you of the flash-based bonds you’ve been held captive by. But if you’re running an older browser (anything prior to IE 9 according to this site), you’ll see a supreme lack of video playing in your browser. You’ll need to provide a flash fallback using something like MediaElement.js or Video for Everybody.

Assuming you have fixed your video tag for older browsers, here’s a breakdown of the 3 different video formats you can use with the HTML5 video element.

WebM/VP8

Quoting the WebM Project site, “The WebM project is dedicated to developing a high-quality, open video format for the web that is freely available to everyone.” Nothing more really needs to be said about which direction we should heading for video on the web. And again from their site, “WebM is supported by Mozilla, Opera, Adobe, Google and more than seventy other publishers and software and hardware vendors.” I wonder which video format will rise to the top?!

Ogg/Theora

This format is also an open source codec designed to compete with MPEG-4 and other proprietary codecs (Windows Media, Realmedia, etc.). I don’t have tons of experience with it, but it only seems to have a couple of percentage points up on the WebM format in terms of current usage support. Right now it supports all the same browsers. So I put it in just for the heck of it, but you might be able to get by without it.

MPEG-4/H.264

The licensing on MPEG-4 is not royalty-free, so many browsers won’t support this format. Keep in mind that if you’re using all 3 formats (suggested), you need to list this one first because of a bug with the iPad. Also, Firefox and Opera have both stated they won’t support this format. Chrome currently does, but it seems it won’t in upcoming versions. This format is a ticking clock because of its closed door policy. Yes, it’s nice. But its days are numbered.

If you need software to be able to convert quickly and easily to all of these formats, check out Miro Video Converter. It’s an awesome (lightweight) tool.

ps. Have you tried the YouTube HTML5 version? They’ll let you sign up for a trial to see how it’s working for you.

4 Comments

Browser Bias

3 Sep
2011

I’m happy to say that Internet Explorer is only #3 on the list of browsers that are accessing my site. Firefox and Chrome top the list and push IE down to only about 20% of my visits! Thankfully safari is only at 6%!

 

Web Designer’s Toolbox

11 May
2011

There are a few things that should be in every web designer’s toolbox. Here’s what is in mine:

Firefox
Invaluable as a testing browser. I was in a conference in Las Vegas with Heather Solomon of Sharepoint Bootcamp, and she confirmed everything I knew when she said, “design for firefox, fix for IE.”

Firebug
A plugin for firefox, it’s brilliant. From viewing and editing your CSS to finding errors in the page. It’s awesome.

Web Developer’s Toolbar
This thing is one of my most used tools (next to firebug). Just download and install it for firefox, you’ll see what I mean.

Textwrangler, Notepad++ (for pc)
I’m a Sharepoint designer currently, so I work on a PC. However, I’m a mac on all my personal projects, so at home I need both. These two text editors are brilliant. Each have their own benefits. Notepad++ is great because you can tell it what language your text file is, and it will try to color code tags appropriately.

Photoshop
Don’t even think of anything else. Although, for a quick screenshot, crop, save, you can’t beat Preview on a mac.

MAMP
MySQL PHP, Apache, for mac. All in one server installation tool. Incredibly easy to use, turn on and off, and is so much faster testing sites locally than on your website, especially since I’m in China and half the internet is blocked over half the time.

Cyberduck and Filezilla
Cyberduck works for editing CSS files live on a server, because the open > edit > save > re-upload feature is seamless. But for large file uploads, Filezilla is much more stable, throws errors into a pile for dealing with later. All around great. But sucks at file editing transfer.

timeEdition
The single best time-tracking application I’ve ever used. Super lightweight, uploads to Google Calendars, exports to iCal, manages clients, projects, and tasks. Brilliant.

What do you use? Leave a comment!

1 Comment

Search and Login above the Ribbon

10 May
2011

I struggled for days with this. Compatibility issues, positioning, ugh. Anyway, here is the solution to putting your search bar and your login menu up above the ribbon in sharepoint 2010.

Step 1: Master Page
The setup of your master page should be something like this:

Right after the opening

tag insert a div. I have given mine a class of “return” because it also holds the return link to my main site from the blog offshoots. Also, insert a line break that has a style of clear:both. This is important later. Will save you a lot of time :).

Step 2: Move Login Controls
Find the login control. It should have the class s4-trc-container-menu. Move into the new div you just created. [cid:image002.jpg@01CC0F2E.E6BCB1E0]

Step 3: Move Search Controls
Find the search control. It should have the id of PlaceHolderSearchArea. Move it beneath the login control.


Step 4: CSS Time
Here’s my CSS for the “return” div:
.return {
width: 100%;
display: block;
font-weight: bold;
border-bottom: 1px solid black;
background:#fff;
float:left;
clear:both;
}

Here’s the CSS for the search control (make sure you add a div around it called “searchbox”:
.s4-search input.ms-sbplain,
.s4-search .srch-gosearchimg,
.s4-search select.ms-sbscopes {
border: 1px solid #333 !important;
}
.s4-search select.ms-sbscopes {
padding:0px;
}
.s4-search input.ms-sbplain,
.s4-search select {
width:140px !important;
}
.searchbox,
.searchbox table {
width:auto;
float:right;
padding:3px;
}
Here’s the CSS for the login control:
.loginbox {
width:auto;
float:right;

}
.s4-trc-container-menu {
margin:0px;
float:right;
padding:10px;
}
.ms-welcomeMenu {
background: none;
padding:0px;
border:none;
font-size:inherit;
margin:0px;
}
.ms-welcomeMenu a:link,
.ms-welcomeMenu.ms-SpLinkButtonActive a:link {
text-decoration:underline;
color:#005baa;
}
.ms-welcomeMenu.ms-SpLinkButtonActive {
background:none;
}
.s4-trc-container .ms-SPLink {
vertical-align:inherit;
}

Try it out. I can send you source files if you need.

Removing the UL indent in Internet Explorer

10 May
2011

Make sure your margin is set to 0px in your css:

ul {
margin:0px;
padding:0px;
}