SI26: Difference between revisions

From XPUB & Lens-Based wiki
No edit summary
No edit summary
 
(41 intermediate revisions by 2 users not shown)
Line 1: Line 1:
testing iframe compatibility with the wiki
{{Iframe|src=https://practices.tools|width=400|height=500|style=float:right}}


<iframe src="https://practices.tools" frameborder="0" width="320" height="320" ></iframe>
==Declarations==


==Presentation==
[[File:Declarations.png | 400px | thumb | right | A representation of the declarative layer of CSS that mediate our daily interaction with technology]]


presentation of the [declarations research project](https://declarations.style/pages/about.html), showing a few example from the [observatory](https://declarations.style/observatory.html)
Declarations is an ongoing trans-disciplinary artistic research project into the poetic materiality of the CSS web-standard and its echoes on design and artistic practices.


(to complete)
A [https://declarations.style/pages/about.html presentation of the declarations research project], with quotes and some illustrations of how the research is looking at declarative web-languages. It is important to read the first and second part (what is CSS, and the research questions).


* intro declarations (from about page)
We will watch the video essay by Miriam Suzanne [https://www.youtube.com/watch?v=aHUtMbJw8iA&abchannel=MozillaDeveloper Why is CSS so weird] as an starting point to untangle some questions of the research together.
* it's a standard: browser war, can i use
 
Prescriptive and descriptive language & haikon lee example
So far what is CSS:
* inline-block fable, instinct
 
* declarativeness linked to intentions, "words have a will of their own"), myriam suzane video
* if HTML is the structure of the house, '''CSS is interior design (paints, textiles, flooring, etc.)''', how we feel in a room? (laurel's pdf)
* how the research have been coordinated so far
* as an interface, CSS is the '''infinitessimely thin shared boundary that mediate our relation with the web''', that is very close to us, individuals, in the vaste ecosystem of the web, also called front-end. (doriane's scheme)
* special issue will focus on: a research on standard; a diagonal approach to language as ethymologist, a new way to look at this language (linguist instead of learning a language?)
* as a declarative language, CSS is giving up control and designing in a device-agnostic manner for unknown canvases, '''similarly to a script for theater piece''', that will always be re-interpeted in its context of execution (miriam video)
 
An [https://declarations.style/observatory.html evolving selection of declarations experiment], Doriane will present some of those progressively through the sessions.


==Reader==
==Reader==


* Nolwenn Maudet, Tactical Design (link to come, the english translation will be published through the research website https://declarations.style)
A selection of references to go further.
* J. R. CARPENTER, A Handmade Web http://luckysoap.com/statements/handmadeweb.html
 
* Zach Mandeville, Basic HTML Competency ... https://coolguy.website/basic-html-competency-is-the-new-punk-folk-explosion/
{| class="wikitable"
* Laurel Schwultz, My website ... https://thecreativeindependent.com/essays/laurel-schwulst-my-website-is-a-shifting-house-next-to-a-river-of-knowledge-what-could-yours-be/
|-
* Femke Snelting, Dividing & Sharing https://constantvzw.org/verlag/spip.php?page=article&id_article=101&mot_filtre=5&id_lang=0#
! Author !! Title !! Year
* Frank CHimero, The web's grain https://frankchimero.com/blog/2015/the-webs-grain/
|-
* Olia Lialina, A Vernacular Web 1,2,3 http://art.teleportacia.org/observation/vernacular/
| Nolwenn Maudet || Tactical Design || 2023
* John Allsopp, A Dao of Web Design https://alistapart.com/article/dao/
|-
| J. R. CARPENTER || [http://luckysoap.com/statements/handmadeweb.html A Handmade Web] || 2015
|-
| Zach Mandeville || [https://coolguy.website/basic-html-competency-is-the-new-punk-folk-explosion/ Basic HTML Competency Is the New Punk Folk Explosion!] || 2016
|-
| Laurel Schwulst || [https://thecreativeindependent.com/essays/laurel-schwulst-my-website-is-a-shifting-house-next-to-a-river-of-knowledge-what-could-yours-be/ My website is a shifting house next to a river of knowledge. What could yours be?] || 2018
|-
| Femke Snelting || [https://constantvzw.org/verlag/spip.php?page=article&id_article=101&mot_filtre=5&id_lang=0# Dividing & Sharing] || 2008
|-
| Frank Chimero || [https://frankchimero.com/blog/2015/the-webs-grain/ The web's grain] || 2015
|-
| Olia Lialina || [http://art.teleportacia.org/observation/vernacular/ A Vernacular Web 1,2,3] || 2005, 207, 2010
|-
| John Allsopp || [https://alistapart.com/article/dao/ A Dao of Web Design] || 2000
|}
 
==Special issue: <code>display</code> and <code>position</code>==
 
In the context this XPUB special issue, Declarations will focus on something quite specific.
The idea is to take a weird angle on the learning of CSS: to be linguists at the same time than learning the language.
 
The special issue is structured in 3 chapters:
 
# exploring the linguistic aspect of web-languages
# investigating & documenting cultural uses of specific CSS properties
# speculation as a tool to think about it differently
 
Two CSS property have been choosing in that regard: <code>display</code> and <code>position</code>.
They are interesting because they show how CSS is a language, notably by the use of non-numeric value and keyword with meaning. They also both have been subject to many change in the standard: unfolding a whole cultural history of the web that lies in the words it uses.
 
By reading the standard it appears that this is a rather complex properties. For example for display we can ask ourselves:
 
* What does it mean for certain things to be block and other the be inline? what does it mean to be inline-block?
* How and why where table, flex and grid invented? Do we need more? What are the motivations and by who was it done?
* How are they implemented, what complexities or differences are often unseen in those processes?
* What does the words "block" and "line" means outside of CSS but through design history?
 
The subject of [[SI26: CSS linguistics | becoming CSS linguists]] will be introduced and expended in its dedicated page .


==Chapt.1 Words are events, they do things, change things (Entering CSS linguistics)==
==Chapt.1 Words are events, they do things, change things (Entering CSS linguistics)==
[[File:Words.png | 400px | thumb | right | Words are events, they do things, change things. They transform both speaker and hearer; they feed energy back and forth and amplify it. They feed understanding or emotion back and forth and amplify it. — Ursula K. Le Guin, The Wave in the Mind: Talks and Essays on the Writer, the Reader and the Imagination ]]


===Monday 6 January===
===Monday 6 January===


todo:
morning:


* rework declarations about page (with some cards & drawing)
* A [https://declarations.style/pages/about.html presentation of the declarations research project], with quotes and some illustrations of how the research is looking at declarative web-languages. It is important to read the first and second part (what is CSS, and the research questions).
* pick 3 texts to share already w/ lydia
* We will watch the video essay by Miriam Suzanne [https://www.youtube.com/watch?v=aHUtMbJw8iA&abchannel=MozillaDeveloper Why is CSS so weird] as an starting point to untangle some questions of the research together.
* iframe in wiki
* finish writing special issue introduction here


presentation of declarations and of the special issue
afternoon:


a first exerice [Declarative companion](https://declarations.style/declarative-companion-le75-graphic-design.html) but in group to share knwoledge, on a pad, using octomode
a first declarative warmup exercise [[SI26 Declarative companions | Declarative companion]].


===Monday 13 January===
===Monday 13 January===


todo:
morning:


* small page that present display, and position, i will need iframes to start them!
* sharing moment about the Declarative companions made last time.
* space to drop lot of images?
* presentation of the special issue.
* meeting: `display` and `position`, the two properties we are going to look at


morning
afternoon:


* sharing moment about the **Declarative companions** made last time.
* starting a media collection, to drop images of thing that echoes with the words: display, block, inline, flow, root, outer-inner, position, static, sticky, fixed, absolute, relative, inherit, initial.
* css story of the day (Doriane pick one thing from the observatory and tell a story about it)
* meeting: `display` and `position`, the two properties we are going to look at.
    * outside of CSS what does those words means to you in graphic design?
    * outside of graphic design what does those words means to you?
* starting a media collection (nextcloud or wiki ?), to drop images of thing that echoes with the words: display, block, inline, flow, root, outer-inner, position, static, sticky, fixed, absolute, relative, inherit, initial.
* browsing exercice: go through website we know and try to pick up interesting example of all those uses, through the inspector and screenshoting
* browsing exercice: go through website we know and try to pick up interesting example of all those uses, through the inspector and screenshoting
* starting reading the standard page
looking at the practice of arpentage (land surveying in EN)
Put forward from lower class worker desiring knowledge, but without academic background, splitting complex text between participants to only read 1 para then explain in simplest possible language to others. Creating diagonal reading / sensible (collective) understanding. Use for reading!


===Monday 20 January===
===Monday 20 January===


todo:
todo:
* to read for that day: Nolwenn maudet - tactical design translation
* to read for that day: Nolwenn maudet - tactical design translation


* css story of the day (Doriane pick one thing from the observatory and tell a story about it)
morning:
 
* introduction to browser extension, the tactical interest of browser extension, how do they work concretly
* introduction to browser extension, the tactical interest of browser extension, how do they work concretly
* **using CSS to reveal CSS, by styling element differently according to which property they are using**. making of the "lens" extension: when extension is activated it reveal in a graphical way the `display` and `position` properties on every website (ex: all element using `display: flex;` have a cyan outline, and we get information when hovering them)
    * group 1 decide of how to display `display`, using CSS
    * group 2 decide of how to display `position`, using CSS
    * group 3 write the js that add classes to elements


==Chapt.1 Parallel sessions==
afternoon:


===Tuesday 7 January, with Joseph===
* **using CSS to reveal CSS, by styling element differently according to which property they are using**. making of the "lens" extension: when extension is activated it reveal in a graphical way the `display` and `position` properties on every website (ex: all element using `display: flex;` have a cyan outline, and we get information when hovering them)
 
===Tuesday 14 January, with Manetta===
 
===Wednesday 15 January, Methods with Lídia===
 
===Tuesday 21 January, with Joseph===
 
===Wednesday 22 January, Methods with Lídia===


==Chapt.2 Every language has a grain (CSS Deep dive in ethymology & cultural usages)==
==Chapt.2 Every language has a grain (CSS Deep dive in ethymology & cultural usages)==
Line 101: Line 121:


===Monday 3 February===
===Monday 3 February===
morning
* css story of the day (Doriane pick one thing from the observatory and tell a story about it)
* starting the arpentage (collective reading) of the W3C standard draft for `display` and `position`
afternoon
* using the [Scratch extension](https://declarations.style/scratch.html), to restyle collectively the standard pages
* slowly going forward a web2print zine of restyled standard pages


===Monday 10 February===
===Monday 10 February===
morning
* css story of the day (Doriane pick one thing from the observatory and tell a story about it)
* continuing the arpentage (collective reading) of the W3C standard draft for `display` and `position`
afternoon
* using the [Scratch extension](https://declarations.style/scratch.html), to restyle collectively the standard pages
* do we have a zine?


===Monday 17 February===
===Monday 17 February===
* what is a block in language/graphic design? what is a line in language/graphic design?
* can we trace the history of certain of those words? how does `sticky` came to be? how does `flex` or `grid` came to be? (there are interesting stories there)
==Chapt.2 Parallel sessions==
===Tuesday 28 January, with Manetta===
===Tuesday 4 February, with Joseph ===
===Wednesday 5 February, Methods with Lídia===
===Tuesday 11 February, with Manetta ===
nb: ''ONLINE OPEN DAY 10-11 (Joseph?), 17-18 (Manetta?)''
===Tuesday 18 February, with Joseph===
===Wednesday 19 February, Methods with Lídia===


==Chapt.3 I live in a different home everyday (Fabulating CSS standard evolution) ==
==Chapt.3 I live in a different home everyday (Fabulating CSS standard evolution) ==
Line 155: Line 135:


===Monday 24 March===
===Monday 24 March===
==Chapt.3 Parallel session ==
===Tuesday 4 March, with Joseph===
===Wednesday 5 March, Methods with Lídia===
===Tuesday 11 March, with Joseph===
===Tuesday 18 March, with Joseph===
===Wednesday 19 March, Methods with Lídia===
===Tuesday 25 March, with Manetta ===

Latest revision as of 20:44, 7 January 2025



Declarations

A representation of the declarative layer of CSS that mediate our daily interaction with technology

Declarations is an ongoing trans-disciplinary artistic research project into the poetic materiality of the CSS web-standard and its echoes on design and artistic practices.

A presentation of the declarations research project, with quotes and some illustrations of how the research is looking at declarative web-languages. It is important to read the first and second part (what is CSS, and the research questions).

We will watch the video essay by Miriam Suzanne Why is CSS so weird as an starting point to untangle some questions of the research together.

So far what is CSS:

  • if HTML is the structure of the house, CSS is interior design (paints, textiles, flooring, etc.), how we feel in a room? (laurel's pdf)
  • as an interface, CSS is the infinitessimely thin shared boundary that mediate our relation with the web, that is very close to us, individuals, in the vaste ecosystem of the web, also called front-end. (doriane's scheme)
  • as a declarative language, CSS is giving up control and designing in a device-agnostic manner for unknown canvases, similarly to a script for theater piece, that will always be re-interpeted in its context of execution (miriam video)

An evolving selection of declarations experiment, Doriane will present some of those progressively through the sessions.

Reader

A selection of references to go further.

Author Title Year
Nolwenn Maudet Tactical Design 2023
J. R. CARPENTER A Handmade Web 2015
Zach Mandeville Basic HTML Competency Is the New Punk Folk Explosion! 2016
Laurel Schwulst My website is a shifting house next to a river of knowledge. What could yours be? 2018
Femke Snelting Dividing & Sharing 2008
Frank Chimero The web's grain 2015
Olia Lialina A Vernacular Web 1,2,3 2005, 207, 2010
John Allsopp A Dao of Web Design 2000

Special issue: display and position

In the context this XPUB special issue, Declarations will focus on something quite specific. The idea is to take a weird angle on the learning of CSS: to be linguists at the same time than learning the language.

The special issue is structured in 3 chapters:

  1. exploring the linguistic aspect of web-languages
  2. investigating & documenting cultural uses of specific CSS properties
  3. speculation as a tool to think about it differently

Two CSS property have been choosing in that regard: display and position. They are interesting because they show how CSS is a language, notably by the use of non-numeric value and keyword with meaning. They also both have been subject to many change in the standard: unfolding a whole cultural history of the web that lies in the words it uses.

By reading the standard it appears that this is a rather complex properties. For example for display we can ask ourselves:

  • What does it mean for certain things to be block and other the be inline? what does it mean to be inline-block?
  • How and why where table, flex and grid invented? Do we need more? What are the motivations and by who was it done?
  • How are they implemented, what complexities or differences are often unseen in those processes?
  • What does the words "block" and "line" means outside of CSS but through design history?

The subject of becoming CSS linguists will be introduced and expended in its dedicated page .

Chapt.1 Words are events, they do things, change things (Entering CSS linguistics)

Words are events, they do things, change things. They transform both speaker and hearer; they feed energy back and forth and amplify it. They feed understanding or emotion back and forth and amplify it. — Ursula K. Le Guin, The Wave in the Mind: Talks and Essays on the Writer, the Reader and the Imagination

Monday 6 January

morning:

  • A presentation of the declarations research project, with quotes and some illustrations of how the research is looking at declarative web-languages. It is important to read the first and second part (what is CSS, and the research questions).
  • We will watch the video essay by Miriam Suzanne Why is CSS so weird as an starting point to untangle some questions of the research together.

afternoon:

a first declarative warmup exercise Declarative companion.

Monday 13 January

morning:

  • sharing moment about the Declarative companions made last time.
  • presentation of the special issue.
  • meeting: `display` and `position`, the two properties we are going to look at

afternoon:

  • starting a media collection, to drop images of thing that echoes with the words: display, block, inline, flow, root, outer-inner, position, static, sticky, fixed, absolute, relative, inherit, initial.
  • browsing exercice: go through website we know and try to pick up interesting example of all those uses, through the inspector and screenshoting

Monday 20 January

todo:

  • to read for that day: Nolwenn maudet - tactical design translation

morning:

  • introduction to browser extension, the tactical interest of browser extension, how do they work concretly

afternoon:

  • **using CSS to reveal CSS, by styling element differently according to which property they are using**. making of the "lens" extension: when extension is activated it reveal in a graphical way the `display` and `position` properties on every website (ex: all element using `display: flex;` have a cyan outline, and we get information when hovering them)

Chapt.2 Every language has a grain (CSS Deep dive in ethymology & cultural usages)

from now on, we'll be dividing in two groups: one group focusing on `display` and `position`. groups will have moment to share back to the rest of the students their research progress.

Monday 27 January

No Class Meeting

Doriane in Berlin for a Declarations workshop

Monday 3 February

Monday 10 February

Monday 17 February

Chapt.3 I live in a different home everyday (Fabulating CSS standard evolution)

Monday 3 March

Monday 10 March

Monday 17 March

Monday 24 March