Web design links: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
Line 1: Line 1:
{{Stub}}
{{Stub}}
<pageby nominor="false" comments="false"/>


This page is '''horribly''' outdated. - Should be fixed by summer 2011 - [[User:Daniel K. Schneider|Daniel K. Schneider]] 20:07, 1 February 2011 (CET)
This page is '''horribly''' outdated. - Fixing it a bit right now over the next two days - [[User:Daniel K. Schneider|Daniel K. Schneider]] 13:09, 22 October 2011 (CEST).


== Definition ==  
== Definition ==  


This is a quick and dirty (!!) page with pointers about WWW design and style. Entries should have real '''contents''' useful to web designers.  
Right now, this is a quick and dirty (!!) page with pointers about WWW design and style. Entries should have real '''contents''' useful to web designers.  


See also:
See also:
Line 19: Line 20:
See also many entries in the categories [[:category:web technologies|web technologies]], [[:category:web technology tutorials|web technology tutorials]], [[usability]] and [[:category:Ergonomics and human-computer interaction|Ergonomics and human-computer interaction]]
See also many entries in the categories [[:category:web technologies|web technologies]], [[:category:web technology tutorials|web technology tutorials]], [[usability]] and [[:category:Ergonomics and human-computer interaction|Ergonomics and human-computer interaction]]


== Building Web Sites / Web Design ==
== Style recommendations (without visual design) ==


Here is a selection of various sites.
== Visual design recommendations ==
 
== Web design links ==
 
=== The process / design methods ===
 
Here is a selection of various resources


* [http://www.alistapart.com/stories/method/index.html A Design Method] List Apart article by Ross Olson, July 2000.
* [http://www.alistapart.com/stories/method/index.html A Design Method] List Apart article by Ross Olson, July 2000.


* [http://www.foruse.com/ forUse] (Constantine &amp; Lockwook). " .... about software and Web usability, user interface design, user role models, use cases and task modeling, content and navigation models, user interface architecture, and usability inspections."
* [http://www.foruse.com/articles/beyond.htm Beyond User-Centered Design and User Experience: Designing for User Performance] by Larry Constantine, 2005. Argues that {{quotation|model-driven approaches based on fine-grained task models have a proven record of leading to dramatic improvements in user performance through innovative designs.}}
* John December's [http://www.december.com/web/develop.html Web Development] (John has built the first widely used Web Portal in 1992)
 
* [http://www.tlc-systems.com/webtips.shtml Art and the Zen of web sites] Tony Karp / TLC
* [http://www.foruse.com/articles/activitymodeling.htm Activity Modeling: Toward a Pragmatic Integration of Activity Theory with Usage-Centered Design] by Larry Constantine, 2006. [[Activity theory]] and usage-centered design are outlined and the connections between the two are highlighted. Simple extensions to the models of usage-centered design are introduced.
 
* John December's [http://www.december.com/web/develop.html Web Development] (John Decembmer has built the first widely used Web Portal about Web Design in 1992).
 
 
* [http://glassdog.com/design-o-rama/index.html Glassdog's Intro to Webdesign] (Lance Arthur)
* [http://glassdog.com/design-o-rama/index.html Glassdog's Intro to Webdesign] (Lance Arthur)
* [http://www.w3.org/Provider/Style/URI Cool URIs don't change] by TBL
* [http://www.w3.org/Provider/Style/URI Cool URIs don't change] by TBL
Line 36: Line 47:
* [http://en.wikipedia.org/wiki/Web_design Web design], Wikipedia
* [http://en.wikipedia.org/wiki/Web_design Web design], Wikipedia


== HTML Pages Design (mostly) ==
=== Style in the light of usability ===
 
As we pointed out in the introduction, you also may have a look at our resources on [[Category:Interaction_design,_user_experience_and_usability| Interaction design, user experience and usability]]. Pointers below rather point to simple technical recipees of what to do and not to do in a web design.


* [http://info.med.yale.edu/caim/manual/ Yale Style Manual]
* [http://info.med.yale.edu/caim/manual/ Yale Style Manual]
* [http://www.sun.com/styleguide/ SUN's Style Guide]
 
* [http://www.w3.org/Provider/Style/Overview.html TBLs Style Guide for online hypertext]
* [http://www.w3.org/Provider/Style/Overview.html Style Guide for online hypertext]. This document was written by Tim Berners-Lee in the early days (1992). Still an interesting read. In particular, it includes a few basic "''do''s" and "don'ts".
* [http://www.htmlhelp.com/design/ WDG's Design Elements]
 
* [http://www.tuxedo.org/~esr/ Eric Raymond's] nice [http://www.tuxedo.org/~esr/html-hell.html HTML Hell Page]
* [http://www.htmlhelp.com/design/ WDG's Design Elements]. The Web Design Group is organization that fights for stable standards. (last update: 2007, as of oct 2011). Its [http://www.htmlhelp.com/design/style/ Style guide for online hypertext] is based on the W3C (Berners-Lee guide) above.
 
* [http://www.tlc-systems.com/webtips.shtml Art and the Zen of web sites] Tony Karp / TLC (last modified december 2002). Quite similar to the W3C and recommendations.
 
* [http://catb.org/~esr/html-hell.html HTML Hell Page] (probably written in the late nineties). Written by Eric Raymond, a well-known open source advocate and contributor.
 
* [http://www.dsiegel.com/tips/ WebWonk] Siegel's 1997 tips (still ok)
* [http://www.dsiegel.com/tips/ WebWonk] Siegel's 1997 tips (still ok)
* [http://www.rnib.org.uk/digital/hints.htm Acessible Web Design]
* [http://www.rnib.org.uk/digital/hints.htm Acessible Web Design]

Revision as of 13:09, 22 October 2011

Draft

<pageby nominor="false" comments="false"/>

This page is horribly outdated. - Fixing it a bit right now over the next two days - Daniel K. Schneider 13:09, 22 October 2011 (CEST).

Definition

Right now, this is a quick and dirty (!!) page with pointers about WWW design and style. Entries should have real contents useful to web designers.

See also:

Things to do - Daniel K. Schneider 17:27, 1 September 2008 (UTC)

  • Move the french pointers to the french wiki
  • Check links and kill a few useless ones
  • Comment the better links
  • Reorganize (!)
  • Add a few definitions

See also many entries in the categories web technologies, web technology tutorials, usability and Ergonomics and human-computer interaction

Style recommendations (without visual design)

Visual design recommendations

Web design links

The process / design methods

Here is a selection of various resources

  • John December's Web Development (John Decembmer has built the first widely used Web Portal about Web Design in 1992).


Style in the light of usability

As we pointed out in the introduction, you also may have a look at our resources on. Pointers below rather point to simple technical recipees of what to do and not to do in a web design.

  • Style Guide for online hypertext. This document was written by Tim Berners-Lee in the early days (1992). Still an interesting read. In particular, it includes a few basic "dos" and "don'ts".
  • HTML Hell Page (probably written in the late nineties). Written by Eric Raymond, a well-known open source advocate and contributor.

Making icons

Graphics oriented design

Various

Fun

Journals

  • DesignIssues The MIT Press Journal's site (a few on-line articles)

Printed Books

Legibility of text

Serif fonts, all things being equal, are easier to read (except on a computer screen)

Web Design Links, Portals & Zines

Also, dig in above's links, most major WebDesign resources have a link page !!

General Design

See also: usability, web usability, human-computer interaction, etc.

Programming

Design of documentation

Examples

Evaluation

Bibliography

  • Michael Bauerly and Yili Liu (2011). Effects of Symmetry and Number of Compositional Elements on Interface and Design Aesthetics, International Journal of Human-Computer Interaction, DOI: 10.1080/10447310801920508
  • Bi, L., Fan, X., Zhang, G., Liu, Y., and Chen, Z. 2009. Effects of symmetry and number of compositional elements on Chinese users' aesthetic ratings of interfaces. International Journal of Human-Computer Interaction, accepted for publication. PDF
  • Wolf, T.V., Rode, J.A., Sussman, J., and Kellogg, W.A. 2006. "Dispelling design as the "Black Art" of CHI," Proceedings of CH, 2006 Conference (Montreal, Quebec, Canada, 22-27 April). PDF
Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=Web_design_links&oldid=35656"