Web Design Tutorial – Web Design Best Practices for Non-Designers
Web Design Tutorial – Web Design Best Practices for Non-Designers
Web Design Training – Web Design Best Practices
Most tutorials are just drafts. I will take some time before I will be done with these – Daniel K. Schneider october 2009. That holds still true as of Feb 2011. Some technical information has been added. In the next few month I’ll add conceptual stuff related to design and usability.
1 Introduction
This entry indexes various web technology and web design tutorials. Roughly, the learning goals are the following
Web technology level 1 – Learning goals
Use simple Web 2.0 services like Webtops
Configure a web 2.0 application, e.g. a a blog or a social network
Import widgets and understand how content syndication works
Learn how the Internet works and about some major Web protocols
Design a web page with (X)HTML and CSS and upload it to a server
Evaluate and use web page styles
Edit and code simple JavaScript programs
Know how to make use of JavaScript libraries
Create and validate an XML file (learn how to read and use DTDs and XML Schemas)
web technology level 2 – learning goals:
Learn web design and usability principles
Design XML grammars
Write XSLT stylesheets for text or database centered XML applications
Access a web server, code, test and run a very simple server-side program
Design a simple SQL database
Be able to use some PHP/MySQL generators
Install and configure LAMP-based web applications
web design – learning goals:
Implement a user-centered agile design practice
Use prototyping tools like pencil and paper and wireframing tools
Identify major usability issues
Conduct simple usability tests
Understand requirements for accessibility
The Complete Web Design Tutorials for Beginners in 30 Days
https://www.youtube.com/watch?v=PVfJnltHIM4
Wordpress Web Design tutorial: designing your top level web page templates
2 List of (future) tutorials
Note: The list below is really provisional, got some renaming and (of course) work to do. Also, some entries are less than incomplete …
2.1 Getting started
I suggest to start creating web sites with online services. This way you will be aware of what you can do without learning to code or install anything. In addition, you will implicitly become aware some issues and concepts that will be introduced later.
Creating websites with online services
Using web widgets
Browser extension
Search engine (needs some rewriting)
2.2 Internet principles
Internet tutorial (not done yet, see Internet in the meantime)
Hypertext Transfer Protocol (not done yet)
URLs, URNs and URIs (short definition of these standards)
2.3 Managing identities on the Internet and Authentication
single sign-on
OpenID
LDAP
2.4 HTML
Basic tools for web developement (not done, see Web authoring system for a list of tools.
HTML, XHTML and HTML5 for some background information
HTML and XHTML elements and attributes, an introductory (X)HTML elements tutorial. Explains some markup principles and introduces the most important elements.
HTML and XHTML validation and repair
HTML5 (see also SVG)
2.5 HTML forms
HTML forms tutorial
2.6 SVG
Static SVG tutorial
Using SVG with HTML5 tutorial
SVG/SMIL animation tutorial
2.7 CSS
CSS and CSS links (for some background infos)
CSS tutorial
CSS text styling tutorial
CSS color and background tutorial
CSS media and alternative style sheets tutorial
CSS box model tutorial
CSS float tutorial
CSS positioning tutorial
CSS for XML tutorial
Analyzing CSS tutorial
CSS compatibility
2.8 JavaScript
Javascript tutorial – basics
DHTML
HTML forms tutorial (using JS a lot)
ECMAScript data types
AJAX
2.9 XML tutorials
XML
XML principles
Tour de XML
Editing XML tutorial
DTD tutorial
XSLT Tutorial – Basics
XSLT to generate SVG tutorial
XPath tutorial – basics
XSLT for compound documents tutorial
XQuery tutorial – basics
PHP – MySQL – XML tutorial – basics
2.10 PhP tutorials
PHP tutorial – basics
PHP-MySQL tutorial -basics
2.11 Web applications
WAMP
SQL and MySQL tutorial
PHP-MySQL tutorial -basics
BPMN 1.2 tutorial
2.12 Design and usability
Usability, cognitive ergonomics and Human-computer interaction
Web usability
web accessibility
Font readability
User interaction and user interface design
Web prototyping software
web wireframe
3 Other EduTech Wiki entries of interest
Overviews
ECMAScript
HTML
Scripting language
PHP
Links pages
… to help you find good web sites
Character encoding
Clipart
CSS links
HTML links
JavaScript links
PHP links
Portalware
WAMP
Web design links
Other tutorials
Flash tutorials (lots)
Screen capture tutorial