[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[EP-tech] UX/UI Refresh - good practice advice sought
I hope this helps,
On July 14, 2017 11:33:02 AM GMT+02:00, Christopher Gutteridge <cjg at ecs.soton.ac.uk> wrote:
>The public facing stuff can be made responsive. I've done a fair bit of
>work to apply our corporate style to eprints.soton.ac.uk
>However, where it's tricky is that the deposit workflow has HTML
>generated by code, not templates, and lots of it uses tables. It is
>possible to have an alternate template applied for logged in users,
>which goes some way to address this, but isn't a full solution.
>Where EPrints got it right was all the CSS classes are prefixed with
>which means it's possible to merge in a corporate stylesheet and they
>won't clash in names of classes. However, our university style sheet
>adds unexpected style to a few basic HTML elements, such as tables, and
>I had to make some additional css to override this inside EPrints pages
>as it made a mess.
>The place I've put in most of my effort was the item record pages, such
>as https://eprints.soton.ac.uk/267112/ , which are now properly
>Where I had the biggest challenge is that the XML nature of EPrints
>templates mean that the whole main page content needs to be wrapped in
>single element, and some pages are automatically generated HTML, others
>are quite flexible. This means you can't have several full width
>"content" sections on one page, and wrapper the whole page in a single
>content section for automatic pages. (sorry, hard to explain). Pages
>likes the search results are quite constrained, so I'd start there,
>learn the constraints, and then work within those constraints for more
>general pages like the homepage and item-summary pages. I wouldn't try
>to make it fully responsive for the "user area" (logged in) parts of
>site, as that's a much bigger and harder job.
>We've also put a lot of thought into the sections and ordering of the
>metadata on the summary pages, trying to put the most specialised
>information lower down.
>As part of this set of improvements, we also stopped using full
>citations for search results, and have gone for a cleaner display for
>people to skim read.
>but we still put the full citation on the summary page.
>At Southampton we've got one of the most established EPrints
>repositories (as you'd expect) and we've invested hugely in back-end
>features, but at the expense of the public user interface which was
>always "important, but not as important as X".
>One other interesting decision we've made is to flatten out the
>structure of the organisation. We have faculties which are
>administrative groupings, but not relevant to an external reader, so in
>our revised approach, "Chemistry" is now part of an alphabetically
>ordered list of departments, rather than you having to find it under
>whatever faculty grouping it's in. This is a work in progress, but I
>think we're heading in the right direction.
>https://eprints.soton.ac.uk/view/divisions/ (nb. very few records as we
>have to run a full update to repopulate our new 'divisions' field and
>we're waiting for a time when we can cause that load on the system
>without causing a bother).
>There's some things in EPrints that could do with a "responsive" tweak,
>such as the 2 column list of options in forms, and the 4 column list of
>options some /views/ have. This is quite hard to do in the code without
>risking messing up existing repositories when they upgrade. One
>page has loaded to be a more responsive "shape".
>"prototype.js" rather than jQuery, but for bootstrap you almost
>certainly want to use jQuery too, so you'll need to ensure you have:
>Because both libraries like to take over the "$" variable. The
>noConflict mode for jquery means it lets prototype.js have the $ and it
>just uses "jQuery" for everything so where you'd normally do
>$("p.special") you'd do jQuery("p.special") instead. No all jQuery
>extensions and libraries that use it respect that however, so watch
>Worst case, you can just search and replace over them.
>Sorry, that turned into more of a blogpost!
>On 14/07/2017 08:28, Vials Moore, Adam wrote:
>> Hey all!
>> As a summer project we?re updating the CSS/HTML front end on our
>> eprints front end (I know, I love pain).
>> Last time round (2+ years ago) I just hacked the relevant CSS into
>> template/default.xml and static/index.html ? but now we have 2
>> repositories (both 3.3.15) on different servers and I?d really like
>> Update to at least bootstrap ? so that it looks OK on mobile devoices
>> / not horrible at different resolutions etc &c
>> Make everything a little more clean and modular
>> Not have to do it lots of times (preferably!)
>> I do have some corporate CSS to include so can?t completely freeform
>> . . .
>> All advice appreciated
>> *** Options:
>> *** Archive: http://www.eprints.org/tech.php/
>> *** EPrints community wiki: http://wiki.eprints.org/
>> *** EPrints developers Forum: http://forum.eprints.org/
>Christopher Gutteridge -- http://users.ecs.soton.ac.uk/cjg
>University of Southampton Open Data Service:
>You should read our Web & Data Innovation blog:
Sent from my Android device with K-9 Mail. Please excuse my brevity.
-------------- next part --------------
An HTML attachment was scrubbed...