Allow wrap-around text for content items in a module

  This idea has been developed and deployed to Canvas

 

  Idea will be open for vote Wed. July 1, 2015 - Wed. October 7, 2015  Learn more about voting...

 

Dear Canvas

 

Recently you updated the number of characters visible in the module main page.  Now all of my assignments are truncated and end with ....

 

Why would you do this?

 

Does this look informative to students?  Why is there so much white open and available space between my assignment name and the number of points it's worth?

 

http://puu.sh/ipNcq.png

 

Now, I heard it was to make things easier to read on phones and tablets.  Except it's not. Here's my tablet.  This is awesome.  Totally - I like being able to see 10 letters of an assignment.  And since you can't hover on a tablet, why have you done this?

 

I would like to know who, in their right mind, looked at this and said, yeah.... that looks great!

 

http://puu.sh/ipNmy.png

 

I would like to vote on increasing the display size of assignment names in the modules.  Whatever it was before was even too small.  So I don't know if this is a vote on increasing the allowable text letters, or if it increases the width of the pixels used in that category.  No, I don't use the app for Canvas because I don't like how it's set up or organized.  It looks entirely different than the web based version, nothing is indented and so on, so that's not a reasonable alternative request Canvas.

 

Thanks

 

April

 

  Comments from Instructure

 

For more information, please read through the Canvas Production Release Notes (2016-08-27)

89 Comments
jmccarth
Community Member

image.jpg

This is not a screen resolution issue.  This is an issue of whether or not Instructure cares about teachers' ability to deliver  content  in a meaningful way. My guess is that they care more about presentation on the Canvas app than they do about our ability to present meaningful labels on module content to our students. We shall see what they do with this thread.   One can only hope they have a conscience and fix this problem.

I don't appreciate being infantilized  and having to beg:

" Oh please, may I see more characters – please, pretty please"

image.jpg

ProfessorBeyrer
Community Coach
Community Coach

I am a new Canvas user and so do not feel the grief that comes from change though I do agree that truncating module titles and text headers is a loss. Perhaps another option is to include a subtitle field, which would allow the instructor to add additional information that students could see by clicking or tapping a More info... link. The description could then be hidden by tapping or clicking it. That way the mobile friendliness of short titles would not be lost but neither would the valuable information. The folder in Blackboard and the module in D2L both have an optional description field, which admirably helps students learn whether it's worth it to click on the link.

Bb:
Blackboard folder with description

D2L:
D2L module eutg description

I would imagine a Canvas subtitle link to look like this:

Canvas module with link to description

nphillips
Community Novice

CSS controls the width of the module line items text. Currently, it's set to 34%, meaning it puts the ellipses in at 34% of the width of the item (which I believe is from the icon on the left to whatever is on the right, usually the green/grey cloud icon).

It should be possible to modify/override your CSS and "fix" this issue. Though we don't know how this may mess up the mobile experience---though, I believe it's possible to create contextual CSS, so that when on mobile one CSS woudl be used, but when on a desktop another.

The CSS code in question is something like:

.ig-title {

     flex: 0 0 34%;

}

changing 34% to 80% and you see a big difference.  (BTW, the new UI, available next week, changes from 34% to 40%, somewhat of an improvement, but not really enough.

   [UPDATE: this may not be correct, what an excellent programmer tells me is that the percentage may be adjusting depending on the screen size.]

Also, I discovered that if you make it too large, then, if there are date or point values set for that item, they get squished, so then you've got to adjust for that...add on that since the design is responsive, you may have to be making a lot of adjustments so that every size works--and this is why, probably, Canvas designers set the cutoff of the text so low).

I'm not suggesting this as a solution, because you don't how this may effect other items. But it does seem to point toward a solution.

nphillips
Community Novice

BTW, it's worth noting that simply "wrapping around" will not solve this issue, what will happen is you'll just get very narrow paragraphs, like this:

this is an example
of a wrapparround
if the CSS code wid-

th is not also up-

dated.

But I would expect the Canvas designers to realize that!

jenniferpassman
Community Novice

I was wondering why the text would not extend to even the middle of a page.  It would be great to have wrap text and have it extend fully depending upon the width of the browser window.  I miss the Label that Moodle had which allowed for a better explanation of what's contained herein....instead of the student being required to click a link to find out.

BKINNEY
Community Contributor

I believe the problem is that Instructure is at least dabbling with the

'mobile first' approach responsive web design. According to 'mobile first

<https://codemyviews.com/blog/mobilefirst>' the proper way to design a web

page that works for everyone is to design for the small screen FIRST,

delivering only what those devices can display properly. Then you add in

more that only appears for folks with more screen real-estate, rollover

events (like, when you hover your mouse over something), plugins, etc. I

can easily imagine that on mobile devices, most of that wasted space simply

doesn't exist. Those of us dinosaurs who still sit in front of nice big

monitors are an afterthought. It's the way of the future, I'm afraid, but

we don't have to take it lying down, at least, not where a pricey product

like Canvas is concerned. It's perfectly possible for them to provide more

characters as space permits. They just haven't bothered.

Becky Kinney

Academic Technology Services

Project Blog <http://sites.udel.edu/bkinney/>

On Mon, Aug 31, 2015 at 12:31 PM, jenniferpassman <instructure@jiveon.com>

judyk
Community Contributor

I'm not so sure that this even needs to be a feature request but rather a bug fix. The display is wrong and messed up when I look at my courses in Canvas and in Firefox.

charms
Community Novice

Agreed. This issue is not a feature request. This bug prevents students from being able to properly identify items on Canvas pages because the full names are not shown. It is not a resolution issue. It happens on both desktop and mobile devices.

DrNufer
Community Coach
Community Coach

I'm just chiming in to reiterate that this is a frustrating issue.  For purposes of streamlined UI, Canvas should really optimize the real estate on the screen.  This is in no way acceptable: http://imgur.com/Nbl6AyC

DrNufer
Community Coach
Community Coach

Nbl6AyC.png