forked from craic/CSS3_webkit_demos
-
Notifications
You must be signed in to change notification settings - Fork 0
/
design_ideas.html
77 lines (47 loc) · 2.76 KB
/
design_ideas.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html>
<head>
<title>CSS3 Webkit Demos</title>
<link href="main.css" media="all" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Muli' rel='stylesheet' type='text/css'>
</head>
<body>
<div id='header'>
<a href='index.html' class='banner'>CSS3 Webkit Demos</a>
Design Ideas for the Hackathon
</div>
<div id='main'>
<h2>Here are some design ideas, opinions and goals for the webkit demos... everything is up for discussion</h2>
<p> </p>
<h2>Motivation: There is a gap in the 'market' for a good CSS3 webkit demo site</h2>
<p>The CSS3 webkit extensions offer some great functionality but existing tutorial/documentation sites don't offer
much help to either newbie programmers or designers.</p>
<p>Sites either list out the sytax in detail or show complex 'showcase' examples. We need a series of simple clean
examples that show each extension in isolation and in simple combinations.</p>
<p>In particular, 3D transformations can be confusing if you've not been exposed to them before.</p>
<h2>Simple Examples are a Good Thing</h2>
<p>Basic demo pages should only use HTML and CSS, avoiding JavaScript as far as possible.</p>
<p>There should be no requirement for a server unless really necessary.</p>
<p>Users should be able to download a demo page, see what is going on and modify it without having to read through extraneous cruft.</p>
<h2>Goal for the Hackathon Timeframe</h2>
<p>Focus on visual effects properties/extensions - but go for it if you want to work on other features.</p>
<p>Get a basic site up, running and <i>deployed</i>... if it's in Google's search index by the end of the hackathon, that's a win</p>
<p>Create working demos for as many webkit extensions/properties as possible with all of them linked back to, at least,
a stub of documentation.</p>
<p>Don't worry about browser compatability for now - other sites cover that - and creating demos is more fun given the
time available.</p>
<p>Build out more substantial demos that combine features if time allows.</p>
<p>Discuss whether this should exist as a standlone site, or whether it could be merged into an existing resource</p>
<h2>Mechanics</h2>
<p>Use <a href="http://pages.github.com/">GitHub Pages</a> to deploy the site ? - easy, immediate</p>
<p>Use template pages for each demo if possible - minimal styling, consistent look</p>
<p>Use syntax highlighting Javascript - e.g. <a href="http://alexgorbatchev.com/SyntaxHighlighter/">Alex Gorbatchev's SyntaxHighlighter</a> ?</p>
<h2>Remember to put your name/link on the Contributors Page !</h2>
</div>
<div id='footer'>
Text and Code is released under the terms of the MIT license
<a href="contributors.html">Contributors to this site</a>
</div>
</body>
</html>