-
Notifications
You must be signed in to change notification settings - Fork 0
/
web_sites.html
128 lines (108 loc) · 6.9 KB
/
web_sites.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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>MA Digital Art Humanities UCC</title>
<link rel="stylesheet" href="main.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/p5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.23/addons/p5.dom.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div class= "grid-wrapper">
<div id ="logo">
<svg width="121px" height="97px" viewBox="0 0 121 97" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group-2" transform="translate(0.000000, -14.000000)">
<g id="Group">
<rect id="Rectangle" stroke-opacity="0.867300725" stroke="#FF4500" stroke-width="3" x="1.5" y="15.5" width="106.623016" height="49"></rect>
<text id="mar" font-family="AmericanTypewriter-CondensedBold, American Typewriter" font-size="36" font-style="condensed" font-weight="bold" fill="#30749E">
<tspan x="18.7389771" y="58">ma</tspan>
<tspan x="18.7389771" y="101">r</tspan>
</text>
<text id="y" font-family="Impact" font-size="100" font-style="condensed" font-weight="700" fill="#30749E">
<tspan x="76.5" y="101">y</tspan>
</text>
<text id="p" font-family="AmericanTypewriter, American Typewriter" font-size="36" font-weight="normal" fill="#30749E">
<tspan x="55.7222222" y="89">p</tspan>
</text>
</g>
</g>
</g>
</svg>
</div>
<div id = "header">work in progress</div>
<label for="show-menu" class="show-menu">menu</label>
<input type="checkbox" id="show-menu" role="button">
<div id="menu">
<span class = "dropdown">
<a href="index.html">welcome</a></span>
<nav class = "dropdown" id="here">
<span>practice</span>
<ul class="dropdown-content">
<li><a href="web_sites.html">Web design</a></li>
<li><a href="p5_d3.html">P5.js/D3.js</a></li>
<li><a href="python.html">Python</a></li>
</ul>
</nav>
<nav class = "dropdown">
<span>theory</span>
<ul class="dropdown-content">
<li><a href="learn.html">DH6033</a></li>
<li><a href="data_art.html">DH6013/6032</a></li>
<li><a href="rest.html">DH6003</a></li>
</ul>
</nav>
<nav class = "dropdown">
<span><a href="mailto:[email protected]">contact</a></span>
</nav>
</div>
<div id = "main">
<div id = "last_article">
<h3>Web design: way to finish with "drag and drop"</h3>
<h4>
</h4>
<p>
The exact percentage of websites "proudly powered by Wordpress" (and other Wix) isn't known (some evoke 50% of all
sites). But it is obvious, these platforms standardised the interface and tend to reduce our individual user experience
toward unified automatised behaviors: indeed, a large majority of WP sites uses "free" templates without any substantial
change. The low cost web sites destroy the authenticity of information (in the case there is some) and lead to explosion
of the amount of sites which informational and aesthetic value is unclear.
<br><br>Today, the CO2 emissions due to Internet storage and activity are equal to those, from civil aviation
(each one is responsable of 2% of all CO2 emmissions).<br>
The average site powered by Wordpress uses less than 10% of available functionalities (which are largely extended to support any kind of site). To set a simple, 5-10 pages website on WP, is like go to buy your bread on the corner with a 40t lorry. And if it is about personal <em>storytelling</em>, Medium offers much more adequat solution.
<br><br>
We need to apply to the web the same ecology that we promote for our planet: less consumption, more quality, DYI versus
standard, sustainable versus disposable.<br><br>
<a href="bauhaus/index.html" target="_blank" id="link">Bauhaus' page</a>
<br>
<a href="bubbles/index.html" target="_blank" id="link">Bubbles</a>
<br>
<a href="site2/index.html" target="_blank" id="link">Hand Made Web</a>
</p>
</div>
<div><h3>Sample Studios website</h3>
<a href="https://marypy.github.io/sample_studios/" target="_blank" id="link"><img src="images/sample-studios.png"/></a>
<p>I realised this project in the begining of 2018, during my work placement following a training course in Web Design on CETB. I used a Grid CSS (reliesed in 2017)and learnt, on this occasion, to work with Sketch. Once finished, I adapted <a href="https://grabaperch.com/"> Perch</a>, a small CMS co-created by Rachel Andrew (advocate of Grid, author of amizing <a href="https://gridbyexample.com/">documentation</a> about). This PHP CMS fits to the real size of your site and is extremely flexible and robust.<br><br>
My UX goal was to avoid too obvious and repetitive, prefering clarity and conciseness.
From an aesthetic point of view, I choosed the "transparency" effect, simplicity mixed with hand-drawing.
</p>
</div>
<div>
<h3>site for artist</h3>
<a href="https://marypy.github.io/site_agata/" target="_blank" id="link"><img src="images/site_agata.png"/></a>
<p><br>My aim, while learning web design/front-end dev. was to work for artists and art related insitutions. While this nice intention went in front of a reality of state and support of visual arts in Ireland, I continue to pretend that a (co)creative process of designing artists' web presence is one of the most inspiring in the field.<br><br>
This site is my first one, made for a friend, using Grid CSS and Javascript. I tried to leave as more as possible space and breath to the pictures by evacuating all unnecessary element.
</p>
</div>
</div>
<div id="footer"><span>CopyAllYouWant</span>
<span>Proudly free from Wordpress</span>
<span>Generously hosted on GitHub</span>
</div>
</div>
</body>
</html>