Anonymous1 (talk | contribs) (Great Post) |
Sophivorus (talk | contribs) m (Replace (PST) for (UTC) so that Extension:DiscussionTools works) |
||
(12 intermediate revisions by 4 users not shown) | |||
Line 1: | Line 1: | ||
== Clean boxes == | |||
I took this code from [[wikieducator:User:KTucker]] (and added different links) - I like the clean, compact look, and I can imagine using this style for boxes on the main page, maybe with a different font size. | |||
{| align="center" width="25%" style="border-radius: 1em; -moz-border-radius: 1em; -webkit-border-radius: 1em; box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.75); -moz-box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.75); -webkit-box-shadow: 0.1em 0.1em 0.5em rgba(0,0,0,0.75);; color:midnightblue; background-color:#F0E68C" | |||
! Example links | |||
|- style = "color: navy; background-color:lightyellow;" | |||
| | |||
<small> | |||
* [[Appropedia:Service learning|Service learning]] | |||
* [[Appropedia:Portals/Intros|Portals overview]] | |||
* [[Water]] | |||
* [[Solar]]: | |||
** [[Passive solar]] | |||
** [[Solar hot water]] | |||
** [[Photovoltaics]] | |||
** [[Solar thermal]] | |||
** [[Solar thermal enhancements to conventional power plants]] | |||
</small> | |||
|} | |||
If we use such a style extensively, we can make a new template to add to those at [[Help:Notices]]. Wikieducator has a template just for the style parameters, called <nowiki>{{</nowiki>[[Template:Round_corners|round corners]]<nowiki>}}</nowiki> - that's another useful approach.) --[[User:Chriswaterguy|Chriswaterguy]] 18:09, 7 December 2011 (UTC) | |||
:As I understand it, {{tl|Box-header-watch}} already can do what you describe, except for rounded corners, which don't render for all browsers. At the Kivapedia Main Page, I made the "edit" link color the same as the header background, so readers wouldn't notice, but admins had quick edit access. A parameter like that could be added here. --[[User:RichardF|RichardF]] 07:43, 8 December 2011 (UTC) | |||
::Do you know if the round corner rendering is failsafe? I.e. if it doesn't render, does it still come out looking decent in that browser? | |||
::The 3D effects seem to be important too, as with the shadows around the edges of the box above. I was talking with an old friend who does web development, and he mentioned using 3D effects on the edges of a page. And of course we evolved to look at 3D objects :-). --[[User:Chriswaterguy|Chriswaterguy]] 23:17, 18 December 2011 (UTC) | |||
== Expandable sections == | |||
The expandable sections are also nicely done on [[wikieducator:User:KTucker]] - might be great for the main page. See my proof of concept at [[Appropedia:User experience/Dropdowns]]. (Needs to be on a page with <nowiki>__NOEDITSECTION__ & __NOTOC__</nowiki> magic words, so I gave it its own page.) --[[User:Chriswaterguy|Chriswaterguy]] 18:09, 7 December 2011 (UTC) | |||
:The {{tl|Navboxes}} and {{tl|Navbox}} templates also allow for very complex collapsible combinations. | |||
{{Navboxes | |||
|title = A handy navbox for collecting handy navboxes | |||
|list= {{Solar footer}} {{Water footer}} | |||
}} | |||
The {{tl|Box-header-watch}} template is set to <nowiki>__NOEDITSECTION__ & __NOTOC__</nowiki> by default, but the "TOC" & "EDIT" parameters can be set to allow them on a regular page as a level 2 header, e.g., | |||
<pre> | |||
{{Portal:Projects/box-header|<big>[[Portal:Projects|The Projects Portal]]</big>|Portal:Projects/Intro||TOC=yes|EDIT=yes}} | |||
{{Portal:Projects/Intro}} | |||
{{Portal:Projects/box-footer}} | |||
</pre> | |||
--[[User:RichardF|RichardF]] 07:58, 8 December 2011 (UTC) | |||
:Looking at {{tl|pv project}}, I was thinking it would help to move the "v • d • e" links into the hidden part of the template. I find my eye is drawn to them, and my brain has to process them before I realize that they're not relevant to what I want right now. If they're placed at the bottom of the template, there's even an argument for expanding the links to say "view template • discuss • edit". Thoughts? --[[User:Chriswaterguy|Chriswaterguy]] 23:21, 18 December 2011 (UTC) | |||
== Navigation and readability ideas == | |||
A friend of Appropedia, Peter Campbell of Greenlivingpedia, has made a Google Site - "Kitesurfing Handbook" It has some simple but interesting usability features, as seen at the [http://kitesurfing-handbook.peterskiteboarding.com/progression/the-basics Basics] page: | |||
* "Page at a glance" box. I really like this - I think it really helps the viewer to see what's going on. | |||
* "Previous-Home-Next" buttons at bottom. Relevant to some sets of pages. | |||
--[[User:Chriswaterguy|Chriswaterguy]] 23:29, 18 December 2011 (UTC) |
Latest revision as of 15:04, 29 August 2024
Clean boxes[edit source]
I took this code from wikieducator:User:KTucker (and added different links) - I like the clean, compact look, and I can imagine using this style for boxes on the main page, maybe with a different font size.
Example links |
---|
|
If we use such a style extensively, we can make a new template to add to those at Help:Notices. Wikieducator has a template just for the style parameters, called {{round corners}} - that's another useful approach.) --Chriswaterguy 18:09, 7 December 2011 (UTC)
- As I understand it, {{Box-header-watch}} already can do what you describe, except for rounded corners, which don't render for all browsers. At the Kivapedia Main Page, I made the "edit" link color the same as the header background, so readers wouldn't notice, but admins had quick edit access. A parameter like that could be added here. --RichardF 07:43, 8 December 2011 (UTC)
- Do you know if the round corner rendering is failsafe? I.e. if it doesn't render, does it still come out looking decent in that browser?
- The 3D effects seem to be important too, as with the shadows around the edges of the box above. I was talking with an old friend who does web development, and he mentioned using 3D effects on the edges of a page. And of course we evolved to look at 3D objects :-). --Chriswaterguy 23:17, 18 December 2011 (UTC)
Expandable sections[edit source]
The expandable sections are also nicely done on wikieducator:User:KTucker - might be great for the main page. See my proof of concept at Appropedia:User experience/Dropdowns. (Needs to be on a page with __NOEDITSECTION__ & __NOTOC__ magic words, so I gave it its own page.) --Chriswaterguy 18:09, 7 December 2011 (UTC)
The {{Box-header-watch}} template is set to __NOEDITSECTION__ & __NOTOC__ by default, but the "TOC" & "EDIT" parameters can be set to allow them on a regular page as a level 2 header, e.g.,
{{Portal:Projects/box-header|<big>[[Portal:Projects|The Projects Portal]]</big>|Portal:Projects/Intro||TOC=yes|EDIT=yes}} {{Portal:Projects/Intro}} {{Portal:Projects/box-footer}}
--RichardF 07:58, 8 December 2011 (UTC)
- Looking at {{pv project}}, I was thinking it would help to move the "v • d • e" links into the hidden part of the template. I find my eye is drawn to them, and my brain has to process them before I realize that they're not relevant to what I want right now. If they're placed at the bottom of the template, there's even an argument for expanding the links to say "view template • discuss • edit". Thoughts? --Chriswaterguy 23:21, 18 December 2011 (UTC)
[edit source]
A friend of Appropedia, Peter Campbell of Greenlivingpedia, has made a Google Site - "Kitesurfing Handbook" It has some simple but interesting usability features, as seen at the Basics page:
- "Page at a glance" box. I really like this - I think it really helps the viewer to see what's going on.
- "Previous-Home-Next" buttons at bottom. Relevant to some sets of pages.
--Chriswaterguy 23:29, 18 December 2011 (UTC)