basic informatie over de weekly nerd presentatie:

kies de minst krachtige taal, dus begin met html!

hierin vertelde hij allemaal handige tips om te gebruiken, zoals:

• custom switches
• inputs - met styling de appearance none
• :checked gebruiken
• input{ accent-color:;}
• scroll-margin-top met bijvoorbeeld 100px. -werkt als je scrollt en blijft het een margin aanhouden bij het volgnde gedeelte.
• #my-target:target{outline:.1em solid #;, transition;} om border aan te geven van het volgende kopje 'highlight waar je naar toe scrollt/klikt.
• @starting-style{ opacity:0; transform:scale(.8)} het start punt van de dialog
• :has het is een if statement eigenlijk 'als de section een h2 heeft dan doe dit' bijv form:has(input:checked) input{color:red;}
• select voor dropdown. ::picker(select){ appearance:base-select; - dit wekt alleen in chrome, maar je zegt hiermee ik stijl het zelf, zoasl niet onder elkaar dropdown maar naast elkaar.}

Mening:

Dit was de eerste weekly nerd die we hadden, en ik vond het in het begin saai omdat we de code die we kregen allemaal al wisten eigenlijk. maar ook fijn dat we het weer ff te horen krijgen, want ik heb een half jaar niet gecodeerd dus was een goede opfrisser.

Uiteindelijk vond ik het ook echt handig, omdat er ook nieuwe dingen tussen zaten, oals de scroll-margin-top en :has en eigenlijk bijna alles wat hier boven in de list staat!. dit is super handig voor mijn vakken die ik deze mijn heb.

basic informatie over de weekly nerd presentatie:

1. Defining Contestable AI

"the use of feedback-adjusted data analysis and processing to argument, support or automate policy execution in the public sector."
"public AI systems impact peoples autonomy" - benodigde conditions:

1. accurated beliefs
2. act on your plans

Op dit moment is contested AI een groot ding en cat contested AI inhoudt is:

verwijst naar systemen of toepassingen van AI die onderwerp zijn van maatschappelijke, ethische of juridische discussies. maar dit word negatief bekritiseerd, omdat er gevolgen zijn zoals bias, gebrek aan transparantie of inbreuk op privacy. Er worden beslissingen genoemen zonder duidelijke uitleg.

basic informatie over de weekly nerd presentatie:

Gsap is een API waarmee je dus alles kan animeren wat je maar wil. Tijdens de presentaitie heeft ze vooral code stukjes laten zien dus ik zet ze wel even hier onder:

• Gsap.to(".box",{duration:1, x:918})
• Let tl = gsap.timeline(); tl.to(".box"{duration:1, x:918});
• Gsap.utiles.random(-100,100);
• Gsap.utils.random(["red","blue","green"])
• Function name(){ mapWidth = gsap.utils.mapRange(0, innerWidth,-50,50); mapHeight = gsap.utils.mapRange(0, innerHeight, -50,50);}
• Gsap.utils.wrap([red,green,blue])
• Gsap.utils.wrapYoyo();
• Gsap.utils.pipe()
• Gsap.utils.snap()
• matchMedia();
• control methods:
  • play()
  • pause()
  • resume()
  • reverse()
  • restart()

Mening:

Deze weekly nerd vond ik de leukste weekly nerd tot nu toe! Er kwamen toffe dingen voorbij en het was duidelijk uitgelegd. Alleen ben ik inmiddels wel weer bijna alles vergeten , dus ik zal zelf nog even op de website moeten duiken om te checken wat er allemaal kan.

basic informatie over de weekly nerd presentatie:

imperative programming

1. Create an array of items
2. Loop through each item

How to behave like a button - with javascript - imparative

• Imperative > javascript > div acts like a button
• Declarative > html > button element

jeremy Keith said "javascript should only do what javascript can do"

if you invent from scratch you have total control.

met padding-inline-start is het padding-left, maar als je computer is ingesteld in als je vanaf rechts naar links leest word het omgedraaid! - inclusief.

voor makkelijk responsive font size: font-size:calc(0.5rem + .666vw); of Font-size:clamp(1rem,0.5rem +.666vw, 1.5rem);

Utopia.Fyi is een gemakkelijke website waar je goed responsive design tips krijgt met @min en @max scaling het groeit nu heel soepel in elkaar van mobiel naar groter scherm!!

Functies in css die handig kunnen zijn:

• Calc()
• clamp()
• min and max()
• fit-content()
• Min- max-content()
• repeat()
• minmax()

basic informatie over de weekly nerd presentatie:

ze liet tijdens haar presentatie vooral voorbeelden zien van haar werk en heeft ze haar code van die animatie laten zien.

Ik kan je wel vertellen dat ik haar super gaaf vind, met wat ze allemaal kan met css. Ik heb haar website bekeken Julia Miocene's Website! en er zitten echt super handige tips in!

basic informatie over de weekly nerd presentatie:

A hacker is a person skilled in information technology.

• KISS Keep It Simple Stupid
• Learn By Trying
• Bash kan een uitdaging zijn
• YAGNI You Arent Gonna Need It
• DRY Don't Repeat Yourself

Mening:

Ik heb niks mee gekregen van deze weekly nerd, omdat ze eerst begon over allerlei vage voorbeelden waardoor ik het niet meer begreep.

Toen wilde ze een demonstratie doen met een apparaat, waar een heel vervelend geluid uit kwam en ik vond dat echt geen prettig geluid. Hierdoor ben ik mijn concentratie kwijt geraakt en was ik vooral geirriteerd. Ik heb hiervan niks opgestoken.

basic informatie over de weekly nerd presentatie:

Project Fugu is gemaakt van verschillende API, omdat het nog niet op de markt is.

normaal gesproken moet je bij de bon een USB gebruiken, maar je kan het ook met Web APIs doen. Dan moet je wel de taal kennen.

Mening:

basic informatie over de weekly nerd presentatie:

Keyboard is better for everyone! test it on your own computer with tab and shift tab.

meest algemene problemen voor screenreaders:

• geen skip link (bijvoorbeeld de navigatie)
• Uncontrolled focus state
• de div die gebruikt word als button ipv de button element.

Contrast is heel belangrijk! -wat als het zonnig is?

hoe test je de contrast?

contrast ratio van TEN MINSTE 3:1 voor grote teksten en kleine teksten 4.5:1 - en dat is het minimum.

meest voorkomende problemen:

• placeholder - zet het boven het input veld
• branding colors
• states

hoe test je voor alternatives?

• captions onder videos
• transcript voor podcasts
• alt text voor img - met echte waardevolle tekst over de img zelf als het inhoud bevat

meest voorkomende problemen:

• img in buttons
• video content zonder closed captions