Alt Text Workshop - Revision history

Kim: /* exploitation of alt-text */

2025-10-12T17:52:55Z

exploitation of alt-text

← Older revision		Revision as of 19:52, 12 October 2025
Line 40:		Line 40:
	;misuse for search engine optimization:		;misuse for search engine optimization:
	*since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.		*since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.
	[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]		[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image, the source code reveals ai generated alt-text stating "Photo by Martina Farrugia on October 08, 2025. May be an image of chipmunk and".]]
	;extracted / written by ai:		;extracted / written by ai:
	*all web-based text content is nowadays extracted to train large language models		*all web-based text content is nowadays extracted to train large language models

Kim: /* Why alt-text? */

2025-10-12T17:51:03Z

Why alt-text?

← Older revision		Revision as of 19:51, 12 October 2025
Line 22:		Line 22:

	== Why alt-text?==		== Why alt-text?==
	most items in the following list come from [https://wetdry.world/@ipg/113449765700357189 this] Mastodon post. Lets open the link and try to read the alt text with a screen reader (on MAC: cmd + f5, Windows: Settings -> Accessibility -> Narrator, Linux: Orca<ref>Orca is a free and open source screen reader application for Linux. it might be pre-installed. https://orca.gnome.org/</ref>)		most items in the following list come from [https://wetdry.world/@ipg/113449765700357189 this] Mastodon post. Lets open the link and try to read the alt text with a screen reader (on MAC: cmd + f5, Windows: Settings -> Accessibility -> Narrator, Linux: Orca <ref>Orca is a free and open source screen reader application for Linux. it might be pre-installed. https://orca.gnome.org/</ref>)
	===common arguments pro alt text===		===common arguments pro alt text===
	;screen readers		;screen readers

Kim: /* what other forms can this writing have? */

2025-10-12T16:25:08Z

what other forms can this writing have?

← Older revision		Revision as of 18:25, 12 October 2025
Line 78:		Line 78:
	*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>		*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>
	*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)		*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)
	*could we write alt text that is human but not machine decipherable (in the means ~~sense~~ of algorithmic sabotage)		*could we write alt text that is human but not machine decipherable? (in the means of algorithmic sabotage)

	===fanfiction===		===fanfiction===

Kim: /* what other forms can this writing have? */

2025-10-12T16:24:41Z

what other forms can this writing have?

← Older revision		Revision as of 18:24, 12 October 2025
Line 78:		Line 78:
	*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>		*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>
	*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)		*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)
			*could we write alt text that is human but not machine decipherable (in the means sense of algorithmic sabotage)

	===fanfiction===		===fanfiction===

Kim: /* What is alt-text? */

2025-10-12T16:20:29Z

What is alt-text?

← Older revision		Revision as of 18:20, 12 October 2025
Line 2:		Line 2:

	== What is alt-text? ==		== What is alt-text? ==
	<blockquote~~><ref>Wikipedia:Manual of Style/Accessibility/Alternative text for images https://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style/Accessibility/Alternative_text_for_images#Importance_of_context</ref~~>alternative (alt) text is a textual substitute for non-text content in web pages <ref>https://webaim.org/techniques/alttext/</ref>.</blockquote>		<blockquote>alternative (alt) text is a textual substitute for non-text content in web pages <ref>https://webaim.org/techniques/alttext/</ref>.</blockquote>
	alternative text is the first ''sucess criteria'' of the standard called the Web Content Accessibility Guidelines (WCAG), stated by the World Wide Web Consortium: (WCAG 2.0 - WCAG 3.0 published a [https://www.w3.org/TR/wcag-3.0/ draft] 09/2025)		alternative text is the first ''sucess criteria'' of the standard called the Web Content Accessibility Guidelines (WCAG), stated by the World Wide Web Consortium: (WCAG 2.0 - WCAG 3.0 published a [https://www.w3.org/TR/wcag-3.0/ draft] 09/2025)
	<blockquote>'''1.1.1 Non-text Content:''' All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below <ref>W3C "Non-text Content: Understanding <abbr>SC</abbr> 1.1.1" https://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html</ref>.</blockquote>		<blockquote>'''1.1.1 Non-text Content:''' All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below <ref>W3C "Non-text Content: Understanding <abbr>SC</abbr> 1.1.1" https://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html</ref>.</blockquote>
Line 15:		Line 15:

	;How to write alt-text?		;How to write alt-text?
	:Wikipedia’s style guide offers these questions to ask yourself when you are writing alt-text:		:Wikipedia’s style guide <ref>Wikipedia:Manual of Style/Accessibility/Alternative text for images https://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style/Accessibility/Alternative_text_for_images#Importance_of_context</ref> offers these questions to ask yourself when you are writing alt-text:
	:#Why is this image here?		:#Why is this image here?
	:# What information is it presenting?		:# What information is it presenting?

Kim: /* What is alt-text? */

2025-10-12T16:19:22Z

What is alt-text?

← Older revision		Revision as of 18:19, 12 October 2025
Line 15:		Line 15:

	;How to write alt-text?		;How to write alt-text?
	:Wikipedia’s style guide offers these questions to ask yourself		:Wikipedia’s style guide offers these questions to ask yourself when you are writing alt-text:
	when you are writing alt-text:
	:#Why is this image here?		:#Why is this image here?
	:# What information is it presenting?		:# What information is it presenting?
	:#What purpose does it fulfill?		:#What purpose does it fulfill?
	~~;context~~		: the role of context is vital for writing alt text (consider, where is the image embedded?) mediawiki is a good example: alt-text is not saved on file upload but when you embed it in a page.<br>
	: the role of context for writing alt text (where is the image embedded) ~~wiki~~ is a good example: alt is not saved on file upload but when you embed it ~~somewhere</mark>~~<br>


	== Why alt-text?==		== Why alt-text?==

Kim: /* What is alt-text? */

2025-10-12T16:17:50Z

What is alt-text?

← Older revision		Revision as of 18:17, 12 October 2025
Line 2:		Line 2:

	== What is alt-text? ==		== What is alt-text? ==
	<blockquote>alternative (alt) text is a textual substitute for non-text content in web pages <ref>https://webaim.org/techniques/alttext/</ref>.</blockquote>		<blockquote><ref>Wikipedia:Manual of Style/Accessibility/Alternative text for images https://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style/Accessibility/Alternative_text_for_images#Importance_of_context</ref>alternative (alt) text is a textual substitute for non-text content in web pages <ref>https://webaim.org/techniques/alttext/</ref>.</blockquote>
	alternative text is the first ''sucess criteria'' of the standard called the Web Content Accessibility Guidelines (WCAG), stated by the World Wide Web Consortium: (WCAG 2.0 - WCAG 3.0 published a [https://www.w3.org/TR/wcag-3.0/ draft] 09/2025)		alternative text is the first ''sucess criteria'' of the standard called the Web Content Accessibility Guidelines (WCAG), stated by the World Wide Web Consortium: (WCAG 2.0 - WCAG 3.0 published a [https://www.w3.org/TR/wcag-3.0/ draft] 09/2025)
	<blockquote>'''1.1.1 Non-text Content:''' All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below <ref>W3C "Non-text Content: Understanding <abbr>SC</abbr> 1.1.1" https://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html</ref>.</blockquote>		<blockquote>'''1.1.1 Non-text Content:''' All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below <ref>W3C "Non-text Content: Understanding <abbr>SC</abbr> 1.1.1" https://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html</ref>.</blockquote>
Line 15:		Line 15:

	;How to write alt-text?		;How to write alt-text?
	:		:Wikipedia’s style guide offers these questions to ask yourself
			when you are writing alt-text:
			:#Why is this image here?
			:# What information is it presenting?
			:#What purpose does it fulfill?
	;context		;context
	:the role of context for writing alt text (where is the image embedded) wiki is a good example: alt is not saved on file upload but when you embed it somewhere</mark><br>		: the role of context for writing alt text (where is the image embedded) wiki is a good example: alt is not saved on file upload but when you embed it somewhere</mark><br>

	==Why alt-text?==
			== Why alt-text?==
	most items in the following list come from [https://wetdry.world/@ipg/113449765700357189 this] Mastodon post. Lets open the link and try to read the alt text with a screen reader (on MAC: cmd + f5, Windows: Settings -> Accessibility -> Narrator, Linux: Orca<ref>Orca is a free and open source screen reader application for Linux. it might be pre-installed. https://orca.gnome.org/</ref>)		most items in the following list come from [https://wetdry.world/@ipg/113449765700357189 this] Mastodon post. Lets open the link and try to read the alt text with a screen reader (on MAC: cmd + f5, Windows: Settings -> Accessibility -> Narrator, Linux: Orca<ref>Orca is a free and open source screen reader application for Linux. it might be pre-installed. https://orca.gnome.org/</ref>)
	===common arguments pro alt text===		===common arguments pro alt text===
	;screen readers		;screen readers
	: alt is read out loud to people using tech to speech software		:alt is read out loud to people using tech to speech software
	;slow internet		;slow internet
	:alt text will be shown instead of unloaded images		: alt text will be shown instead of unloaded images
	;findability		; findability
	: alt text helps to search contents (e.g. in a website)		: alt text helps to search contents (e.g. in a website)
	;translation		;translation
Line 35:		Line 40:
	important: '''alt-text ≠ digital accessibility''' but can be a step towards it. (other steps towards accessibility can be: color contrasts, text sizes, clarity of a page navigation, using semantic html...)		important: '''alt-text ≠ digital accessibility''' but can be a step towards it. (other steps towards accessibility can be: color contrasts, text sizes, clarity of a page navigation, using semantic html...)

	=== exploitation of alt-text===		===exploitation of alt-text===
	;misuse for search engine optimization:		;misuse for search engine optimization:
	* since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.		*since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.
	[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]		[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]
	; extracted / written by ai:		;extracted / written by ai:
	* all web-based text content is nowadays extracted to train large language models		*all web-based text content is nowadays extracted to train large language models
	* platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.		*platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.

	==alt-text on platforms==		==alt-text on platforms==
Line 47:		Line 52:
	Different platforms have different approaches to whether and/or how they implement ALT Text to the images. Two examples that highlight this wide range of are Instagram and Tumblr.		Different platforms have different approaches to whether and/or how they implement ALT Text to the images. Two examples that highlight this wide range of are Instagram and Tumblr.

	===Instagram===		=== Instagram===
	Instagram gives users the option to provide Alt Text for their posts, hidden under more options. If there is no user-provided Alt Text, the platform automatically generates one with an at-best mediocre outcome.		Instagram gives users the option to provide Alt Text for their posts, hidden under more options. If there is no user-provided Alt Text, the platform automatically generates one with an at-best mediocre outcome.

Line 63:		Line 68:
	#[https://alttextselfies.net/welcome/ Alt Text Selfies]		#[https://alttextselfies.net/welcome/ Alt Text Selfies]
	#alt text for ascii art		#alt text for ascii art
	# alt text for a piece of sound or music		#alt text for a piece of sound or music
	#what could alt-text for a websites be like?		#what could alt-text for a websites be like?
	##Websites that write about their own process of making and accessibility [https://alt-text-as-poetry.net/#about-this-site alt-text as poetry] has a section about itself, written by the ones who developed the site, [https://web.archive.org/web/20221215152016/https://togethernet.org/accessibility-statement.html together.net] is a consent driven community software that has a whole page dedicated to its own accessibility		##Websites that write about their own process of making and accessibility [https://alt-text-as-poetry.net/#about-this-site alt-text as poetry] has a section about itself, written by the ones who developed the site, [https://web.archive.org/web/20221215152016/https://togethernet.org/accessibility-statement.html together.net] is a consent driven community software that has a whole page dedicated to its own accessibility
	## [https://wwwwords.de/ wwwwords] is a local html publication that experiments with alt text for the 6 most visited websites. The style of writing is more fabulative and visual than purely technical.		##[https://wwwwords.de/ wwwwords] is a local html publication that experiments with alt text for the 6 most visited websites. The style of writing is more fabulative and visual than purely technical.
	## ''I'll meet you on a site: protocolling intersections'' is the written record of a series of meetings. It was published in [https://robidacollective.com/projects/robida-magazine/robida-10-correspondences Robida 10]. part of the writing are alt descriptions of the websites we used as meeting environments. Here is an excerpt, written for [https://afterneworder.com/altmuseum/ Alt Museum]		##''I'll meet you on a site: protocolling intersections'' is the written record of a series of meetings. It was published in [https://robidacollective.com/projects/robida-magazine/robida-10-correspondences Robida 10]. part of the writing are alt descriptions of the websites we used as meeting environments. Here is an excerpt, written for [https://afterneworder.com/altmuseum/ Alt Museum]
	<blockquote>		<blockquote>
	When arriving at 'alt museum' you first see the facade of a building. With its six columns, triangular roof and sand-stone-coloured background it mimics antique temples, a reference drawn across several museum premises until today.		When arriving at 'alt museum' you first see the facade of a building. With its six columns, triangular roof and sand-stone-coloured background it mimics antique temples, a reference drawn across several museum premises until today.
Line 73:		Line 78:
	</blockquote>		</blockquote>

	===what other forms can this writing have?===		=== what other forms can this writing have?===
	*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>		*[https://alt-text-as-poetry.net/ Alt Text as Poetry]<br>
	*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)		*alt text as a form of preservation or archiving (since image content is more vulnerable to decay: harder to store due to large size and difficult to view with software from different decades)

Line 82:		Line 87:
	Is the created text some kind of elaborate, fictional Alt Text for the artwork?		Is the created text some kind of elaborate, fictional Alt Text for the artwork?

	== Exercise==		==Exercise==
	#choose a piece static visual media (painting, website, poster, typeface, image (dont be boring), diagram ...)		#choose a piece static visual media (painting, website, poster, typeface, image (dont be boring), diagram ...)
	#important: dont show what you selected to others yet		# important: dont show what you selected to others yet
	#write alt text for it. while writing, consider what we discussed before:		# write alt text for it. while writing, consider what we discussed before:
	##the role of context		##the role of context
	##form of writing		##form of writing
	#put your alt text (not the image!) in the collective pool		#put your alt text (not the image!) in the collective pool
	#everyone draws an alt text from the collective pool and recreate / interpret the visual media described on it. Here the alt text can work as specific instruction or a more loose prompt to start from. you can use pen and paper or drawing software or code - whatever comes to your mind and feels fitting.		# everyone draws an alt text from the collective pool and recreate / interpret the visual media described on it. Here the alt text can work as specific instruction or a more loose prompt to start from. you can use pen and paper or drawing software or code - whatever comes to your mind and feels fitting.
	#In the last step we try to find back which 'original' piece of media and interpretation belong together.		#In the last step we try to find back which 'original' piece of media and interpretation belong together.

	==Resources==		==Resources==
	*alt-text viewer Browser Extensions [https://addons.mozilla.org/en-US/firefox/addon/popup-alt-attribute/ Firefox] / [https://chromewebstore.google.com/detail/image-alt-text-viewer/nhmihbneenlkbjjpbimhegikadfleccd Chrome]		*alt-text viewer Browser Extensions [https://addons.mozilla.org/en-US/firefox/addon/popup-alt-attribute/ Firefox] / [https://chromewebstore.google.com/detail/image-alt-text-viewer/nhmihbneenlkbjjpbimhegikadfleccd Chrome]
	; Web accessibility guides:		;Web accessibility guides:
	*from the W3C [https://www.w3.org/WAI/ WAI]		*from the W3C [https://www.w3.org/WAI/ WAI]
	*[https://www.accessibility-developer-guide.com/ accessibility developer guide]		*[https://www.accessibility-developer-guide.com/ accessibility developer guide]
	*[https://wave.webaim.org/ wave] is a browser based tool to check your websites accessibility		*[https://wave.webaim.org/ wave] is a browser based tool to check your websites accessibility
	;artistic approaches		;artistic approaches
	*[https://afterneworder.com/altmuseum/ Alt Museum]		*[https://afterneworder.com/altmuseum/ Alt Museum]
	*[https://alt-text-as-poetry.net/ Alt Text as Poetry] Website		*[https://alt-text-as-poetry.net/ Alt Text as Poetry] Website
	*[https://alt-text-as-poetry.net/assets/Alt-Text-as-Poetry-Workbook-PDF-2020-12-01.pdf Alt Text as Poetry] Workbook (pdf)		*[https://alt-text-as-poetry.net/assets/Alt-Text-as-Poetry-Workbook-PDF-2020-12-01.pdf Alt Text as Poetry] Workbook (pdf)

Kim: /* What is alt-text? */

2025-10-12T16:13:14Z

What is alt-text?

← Older revision		Revision as of 18:13, 12 October 2025
Line 10:		Line 10:

	<br>		<br>
	~~<mark>the role of context for writing alt text (where is the image embedded) wiki is a good example: alt is not saved on file upload but when you embed it somewhere</mark><br>~~

	disambiguation: '''alt text''' & '''image description''' are often used interchangeably but have slight destictions:		disambiguation: '''alt text''' & '''image description''' are often used interchangeably but have slight destictions:
	Alt-text is a type of image description, but not all image descriptions are alt-text <ref>Alt-text as poetry Workbook, p. 21, A Note About Alt-Text vs. Image Description https://attachments.are.na/14402778/cfbd7646f733f300c9d3e5313e5d75eb.pdf?1639858710</ref>.		Alt-text is a type of image description, but not all image descriptions are alt-text <ref>Alt-text as poetry Workbook, p. 21, A Note About Alt-Text vs. Image Description https://attachments.are.na/14402778/cfbd7646f733f300c9d3e5313e5d75eb.pdf?1639858710</ref>.

			;How to write alt-text?
			:
			;context
			:the role of context for writing alt text (where is the image embedded) wiki is a good example: alt is not saved on file upload but when you embed it somewhere</mark><br>

	==Why alt-text?==		==Why alt-text?==

Kim: /* exploitation of alt-text */

2025-10-12T16:07:33Z

exploitation of alt-text

← Older revision		Revision as of 18:07, 12 October 2025
Line 35:		Line 35:
	;misuse for search engine optimization:		;misuse for search engine optimization:
	* since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.		* since alt-text provides text content for images, websites who use alt-text can be better crawled and indexed by search engines - so far so good. This becomes really problematic when the alt attribute of an image is not used to provide a relevant description but only search engine index information such as key words.
			[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]
	; extracted / written by ai:		; extracted / written by ai:
	* all web-based text content is nowadays extracted to train large language models		* all web-based text content is nowadays extracted to train large language models
	* platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.		* platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.
	~~[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]~~

	==alt-text on platforms==		==alt-text on platforms==

Kim: /* exploitation of alt-text */

2025-10-12T16:07:05Z

exploitation of alt-text

← Older revision		Revision as of 18:07, 12 October 2025
Line 38:		Line 38:
	* all web-based text content is nowadays extracted to train large language models		* all web-based text content is nowadays extracted to train large language models
	* platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.		* platforms like Instagram provide alt-text written by ai which usually gets the images very wrong.
			[[File:IG-generated-alt-text.png\|thumb\|alt=screenshot of an instagram post showing a sand colored rock in warm sunlight. On the right side of the image the source code reveals ai generated alt-text.]]

	==alt-text on platforms==		==alt-text on platforms==