# markup

Markup is a family of languages or notation for annotating and structuring text so that its meaning, presentation, or processing can be interpreted by programs.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## My Advice to a Developer New to Accessibility

DevFeed: [My Advice to a Developer New to Accessibility](<https://devfeed.tech/articles/my-advice-to-a-developer-new-to-accessibility-38446.md>)

Original publisher: [Read original article](<https://eevis.codes/blog/2022-07-22/my-advice-to-a-developer-new-to-accessibility/>)

Author: Eevis Panula

Published: 2023-01-03T08:57:33.125000Z

Content type: tutorial

Language: en

Sources: [Eevis Blog](<https://devfeed.tech/sources/eevis-blog.md>)

Topics: [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>), [HTML](<https://devfeed.tech/topics/html.md>), [keyboard](<https://devfeed.tech/topics/keyboard.md>), [markup](<https://devfeed.tech/topics/markup.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [accessible](<https://devfeed.tech/tags/accessible.md>), [advice](<https://devfeed.tech/tags/advice.md>), [developer](<https://devfeed.tech/tags/developer.md>), [development](<https://devfeed.tech/tags/development.md>), [element](<https://devfeed.tech/tags/element.md>), [elements](<https://devfeed.tech/tags/elements.md>), [focus](<https://devfeed.tech/tags/focus.md>), [html](<https://devfeed.tech/tags/html.md>), [html-elements](<https://devfeed.tech/tags/html-elements.md>), [input](<https://devfeed.tech/tags/input.md>), [interaction](<https://devfeed.tech/tags/interaction.md>), [interactive](<https://devfeed.tech/tags/interactive.md>), [keyboard](<https://devfeed.tech/tags/keyboard.md>), [learning](<https://devfeed.tech/tags/learning.md>), [markup](<https://devfeed.tech/tags/markup.md>)

### AI overview

This beginner-oriented accessibility article recommends focusing on progress rather than perfection and introduces semantic HTML, keyboard navigation, and listening to people with disabilities. It explains that semantic elements communicate meaning to browsers and developers and support appropriate interaction, while a div styled as a button may work only for mouse users and may not be focusable or keyboard-accessible.

### Source excerpt

Learning about accessibility for the first time can feel overwhelming. You start reading, and at some point, it hits you: There is so much to learn! And if you're like me and feel that it's your responsibility to make the things you create accessible, that might even make you feel anxious. And yes, there is a lot to learn regarding accessibility. But you don't need to know everything at once. As Meryl Evans reminds us in her tweet (and a blog post the tweet links to), it's about progress over perfection: https://twitter.com/merylkevans/status/1547635550466674692 So, here are some things I wish I had known when I first started learning accessibility. Heck, I wish I had known these things when I started learning web development! I'll share semantic HTML, keyboard navigation, and listening to people with disabilities. Learn Semantic HTML and Use It So, first thing: Learn semantic HTML. But what does it mean? Semantic HTML, or semantic markup, describes its meaning to the browser and developer in a human- and machine-readable way. So, with semantic elements, a human will know what the HTML element is about, and the browser knows what it should render and how it should behave when a user interacts with it. Here's an example: <button onClick={...}>I'm an honest button</button> That button uses a semantic button-element. When it does so, the browser knows what it should do when the user either clicks or activates it with a keyboard or other input device. Here's an example of a non-semantic "button": <div className="button" onClick={...}> I look like a button </div> So, this "button" made out of div looks like a button and even has the onClick-handler. So, wouldn't a human recognize it as a button? Well, yes and no. It depends on the human. You see, this "button" works only for mouse users. As div is not an interactive element by nature, it doesn't handle interaction the same way as, for example, a button-element. When using a semantic button-element, that onClick-event pro

## Building Animated Tiles with Rx

DevFeed: [Building Animated Tiles with Rx](<https://devfeed.tech/articles/building-cool-animated-tiles-with-rx-38408.md>)

Original publisher: [Read original article](<https://khmylov.com/2011/11/building-cool-animated-tiles-with-rx/>)

Author: Andrew Khmylov

Published: 2011-11-15T00:00:00Z

Content type: tutorial

Language: en

Sources: [Despite the odds](<https://devfeed.tech/sources/despite-the-odds.md>)

Topics: [Code](<https://devfeed.tech/topics/code.md>), [markup](<https://devfeed.tech/topics/markup.md>), [ui](<https://devfeed.tech/topics/ui.md>), [App](<https://devfeed.tech/topics/app.md>), [procedural flowers](<https://devfeed.tech/topics/procedural-flowers.md>)

Tags: [animation](<https://devfeed.tech/tags/animation.md>), [app](<https://devfeed.tech/tags/app.md>), [code](<https://devfeed.tech/tags/code.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [math](<https://devfeed.tech/tags/math.md>), [xaml](<https://devfeed.tech/tags/xaml.md>)

### AI overview

This tutorial explains how to build animated tiles for a Windows Phone 7 project using XAML, a TileControl, and a storyboard. It also shows how an observable sequence creates tiles at intervals and how DispatcherObservable.ObserveOnDispatcher schedules collection updates on the runtime dispatcher.

### Source excerpt

I have a small WP7 project called Summarize. It is a fun math-based game (check it out for free). It has a nice effect of loading tiles. Several people has asked me how I have done it, so in this post I will cover how to build something similar on your own. Let's start with building the UI. We have the toolkit's WrapPanel inside the ItemsControl and a simple TileControl with TextBlock displaying the tile number. TileControl.xaml markup: <UserControl x:Name="UserControl" x:Class="AnimatedTilesSample.TileControl" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" Loaded="OnLoaded" Width="76" Height="76"> <UserControl.Projection> <PlaneProjection RotationY="-180" /> </UserControl.Projection> <UserControl.Resources> <Storyboard x:Key="LoadedStoryboard"> <DoubleAnimation Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="UserControl" To="0" Duration="0:0:0.2" /> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="UIElement.Visibility" Storyboard.TargetName="Text"> <DiscreteObjectKeyFrame KeyTime="0:0:0.1"> <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </UserControl.Resources> <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneChromeBrush}"> <TextBlock x:Name="Text" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Collapsed" Style="{StaticResource PhoneTextTitle2Style}" Text="{Binding ., Mode=OneTime}" /> </Grid> </UserControl> In the code-behind we start the animation when the tile is loaded: private void OnLoaded(object sender, RoutedEventArgs e) { var sb = Resources["LoadedStoryboard"] as Storyboard; if (sb != null) { sb.Begin(); } } MainPage.xaml m