# markup Published articles for markup. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Why WCAG Conformance Doesn't Mean "Perfectly Accessible" DevFeed: [Why WCAG Conformance Doesn't Mean "Perfectly Accessible"]() Original publisher: [Read original article]() Author: Jordan Published: 2025-07-23T12:45:00Z Content type: article Language: en Sources: [Blog-Main]() Topics: [Web Content Accessibility Guidelines](), [Accessibility](), [Web Accessibility (a11y)](), [Web](), [alt text](), [Users]() Tags: [accessibility](), [accessibility-guidelines](), [accessibility-ux](), [accessible](), [alt-text](), [cause](), [content](), [lawsuit](), [markup](), [speech](), [tables](), [wcag](), [web-accessibility](), [web-content-accessibility-guidelines]() ### AI overview The article explains that WCAG conformance, including Level AA, is a valuable goal but does not guarantee a perfectly accessible experience. Pass-or-fail criteria can be met while websites still create barriers through poor alt text, difficult captions, incomprehensible table presentation, or layout shifts caused by slow page speeds. ### Source excerpt The Web Content Accessibility Guidelines (WCAG) are an excellent set of standards, and WCAG conformance is achievable -- regardless of the size of your website, the complexity of its features, or any other factors. ## AI-буткемп от red\_mad\_robot: прокачиваем скиллы в NLP и MarkUp DevFeed: [AI-буткемп от red\_mad\_robot: прокачиваем скиллы в NLP и MarkUp]() Original publisher: [Read original article]() Author: redmadrobot (red\_mad\_robot) Published: 2025-02-21T12:37:26Z Content type: release Language: ru Sources: [Redmadrobot EN](), [Redmadrobot RU]() Topics: [Artificial Intelligence](), [Natural language processing](), [Large Language Model](), [genai](), [Retrieval Augmented Generation (RAG)](), [ChatGPT](), [Claude](), [llama]() Tags: [ai](), [chatgpt](), [claude](), [genai](), [llama](), [llm](), [markup](), [nlp](), [rag](), [tag-77ff283d3734](), [tag-86b843454893](), [tag-a6eb30d5e1b3](), [tag-e076f05a03bb]() ### AI overview red_mad_robot announces a free four-week AI bootcamp for junior developers, with tracks for NLP engineers and MarkUp engineers. The program includes practical work, senior mentorship, collaborative AI development, and a portfolio case. Applications are accepted until March 10, and the bootcamp starts March 17. ### Source excerpt Хотите ворваться в разработку AI-решений? red_mad_robot запускает интенсивный буткемп для джунов, где за 4 недели вы освоите востребованные навыки и получите практический опыт в разработке AI-продуктов под руководством ведущих экспертов индустрии Читать далее ## What MarkUp Engineers Do and How QA Engineers Are Trained for AI Data Labeling DevFeed: [What MarkUp Engineers Do and How QA Engineers Are Trained for AI Data Labeling]() Original publisher: [Read original article]() Author: redmadrobot (red\_mad\_robot) Published: 2024-11-20T14:45:37Z Content type: tutorial Language: ru Sources: [Redmadrobot EN](), [Redmadrobot RU]() Topics: [Artificial Intelligence](), [Large Language Model]() Tags: [ai](), [llm](), [markup](), [prompt-engineering](), [qa](), [tag-265903b3a1bd](), [tag-86b843454893](), [tag-9bf5e01ce62e](), [tag-9d8cf70dc46c](), [tag-c24f64f30028](), [tag-f432a38ebe75]() ### AI overview The article explains the role of MarkUp engineers in AI projects and describes an internal training approach that helps QA engineers develop data-labeling skills. It also introduces terminology related to LLM data preparation, including chunks, prompts, parsers, temperature, and datasets. ### Source excerpt В работе над смарт-системой на базе AI нам понадобились специалисты по разметке данных -- MarkUp-инженеры. Рынок труда быстро трансформируется, и новые позиции не всегда можно закрыть готовыми специалистами, поэтому мы сосредоточились на формировании навыков внутри команды. Мы поняли, что навыки QA-инженеров пересекаются с компетенциями, необходимыми для работы с данными в AI-системах, и решили организовать производственное обучение внутри команды. Рассказываем о том, кто такие разметчики, как тестировщики осваивали MarkUp, и что из этого вышло. Читать далее ## My Advice to a Developer New to Accessibility DevFeed: [My Advice to a Developer New to Accessibility]() Original publisher: [Read original article]() Author: Eevis Panula Published: 2023-01-03T08:57:33.125000Z Content type: tutorial Language: en Sources: [Eevis Blog]() Topics: [Accessibility](), [Web Development](), [HTML](), [keyboard](), [markup]() Tags: [accessibility](), [accessible](), [advice](), [developer](), [development](), [element](), [elements](), [focus](), [html](), [html-elements](), [input](), [interaction](), [interactive](), [keyboard](), [learning](), [markup]() ### 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: 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":
I look like a button
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 ## 2nd Edition: Please Mind The Gap DevFeed: [2nd Edition: Please Mind The Gap]() Original publisher: [Read original article]() Author: Heydon Pickering Published: 2021-06-29T00:00:00Z Content type: release Language: en Sources: [The Every Layout Blog]() Topics: [Web Development](), [modern web development]() Tags: [components](), [flexbox](), [margin](), [markup](), [properties](), [release]() ### AI overview Every Layout announces its second edition, which focuses on the CSS gap property and its Flexbox support in modern browsers. The article explains how gap can simplify responsive layout components compared with margin-based techniques, reducing intermediary markup and problems with custom properties and nesting. ### Source excerpt We at Every Layout (try to imagine we have some sort of corporate identity rather than being two blokes with a neat website and a script that generates epubs) are proud to announce the release of our second edition! And we are slashing the already low price of $69 down to just $40 to mark the occasion. Just make sure you use 2ND_COMING at checkout ASAP; we can't keep it at that price forever. What's new, then? This edition is all about the gap property, which is now supported with Flexbox in all modern browsers. Why is gap important? Smart layout primitives like the Cluster, Sidebar, and Switcher are all designed to automatically reconfigure themselves to suit different contexts--and without needing JavaScript or @media queries. When doing this, gutters (margins) between elements can be problematic unless handled carefully. A margin applied to one element to create a gap between it and an adjacent element becomes a misplaced margin when the element wraps: Until now, we have solved this by applying margin to child elements symmetrically (to all sides) and using negative margin to deal with the excess. There's nothing wrong with using negative margins per se; it's more a technique than a hack. But this approach does necessitate what we have come to call an intermediary wrapper...
Child 1
Child 2
What this does is insulate the negative margin from the flow of the document. Then we can apply a sensible margin to the outer component itself. In fact, it's more likely this margin would be applied by a parent Stack element, which injects margin between successive elements (Every Layout components are highly modular and composable). Not only does the negative margin technique represent additional markup, but things start to go awry when it comes to custom properties and nesting. Margins are applied to child elements and child elements become parent elements whe ## Why the Web Platform May Reduce the Need to Write JavaScript Directly DevFeed: [Why the Web Platform May Reduce the Need to Write JavaScript Directly]() Original publisher: [Read original article]() Author: Edward Faulkner Published: 2017-05-04T16:40:13Z Content type: opinion Language: en Sources: [Edward Faulkner]() Topics: [JavaScript](), [Web platform](), [CSS](), [HTML](), [WebAssembly](), [Web Development]() Tags: [abstraction](), [css](), [developer-experience](), [javascript](), [markup](), [webassembly]() ### AI overview The article argues that writing web applications entirely in JavaScript can optimize for current developer workflows while overlooking the web platform's maturation. It predicts that improving runtime, compilation, and debugging capabilities--particularly through WebAssembly and ASM.js--may eventually let many web developers work without directly understanding JavaScript. ### Source excerpt There is a popular trend among some Javascript developers to argue that humans should stop writing CSS and HTML (and HTML-based templates). They argue everything should instead be written as Javascript, to reduce complexity and present a more unified developer experience. And certainly many people who try this approach ## Paddle Out DevFeed: [Paddle Out]() Original publisher: [Read original article]() Published: 2015-01-30T00:00:00Z Content type: opinion Language: en Sources: [Signal Blog]() Topics: [Code](), [CSS]() Tags: [code](), [css](), [markup](), [work]() ### AI overview A reflective developer essay compares working through difficult coding tasks with paddling out through breaking waves. It emphasizes balance, taking breaks, starting with manageable tasks, and continuing despite exhaustion and fear. ### Source excerpt Winter Break Of Code Day Eighteen Late this afternoon I took a break from working to surf. The sun was setting and a cool breeze was picking up as grey clouds billowed behind the mountains along Hanalei Bay. I had spent most of the day wrangling content, markup, and CSS, and the Pacific was calling. There was still plenty of work to be done, but balance is important, and my mind needed to reset. Surfing would be today's lesson. Read more... ## The Fundamentals, Primitives and History of HTML5 DevFeed: [The Fundamentals, Primitives and History of HTML5]() Original publisher: [Read original article]() Author: Paul Irish Published: 2011-11-21T13:39:00Z Content type: article Language: en Sources: [Paul Irish]() Topics: [HTML5](), [Parsing](), [browsers](), [Web platform](), [Front end]() Tags: [browsers](), [examples](), [frontend](), [fundamentals](), [history](), [html](), [html5](), [markup](), [parsing](), [payload](), [platform](), [web-platform]() ### AI overview A talk about the fundamentals, primitives, and history of HTML5, including markup parsing, optional tags, unquoted attributes, and how browsers interpret HTML according to defined rules and specifications. ### Source excerpt Just gave this talk at W3Conf about some of the innerworkings of HTML5. Lots of did-you-know and cool insight into how browsers work. 37 minutes long, The Primitives of the HTML5 Foundation - Slides I do discuss optional start and end tags as well as not quoting your attributes. I concede that these ideas scare the shit out of people. In fact, when I first heard Jens Meiert propose the idea in 2009 my brain rejected it. Still, I think many of the markup parsing curiosities that can be frightening only need to be understood by HTML minifiers. Always leave it up to tools to make your frontend payload smaller; you just want the most comfortable and maintainable authoring environment possible. I shared them in this talk because 1) it can lead to writing more beautiful HTML that is easier to maintain. Leaving off 's is a good example. 2) I just want people to consider browsers less of a black box of uncertainty. There are rules and specs that define behavior, so once understood you can feel confident relying on a consistent behavior. We certainly don't have that consistency across all the web platform, but for these examples you do. In summary, I'm not advocating you write more spartan markup if you don't want to. But if it makes you feel good, by all means, go at it; you know now how the browsers work. ps. the monkey HTML shirt I wore is from a store in tokyo; solo location. but they also sell on this delightfully overwhelming site ## Bootstrapped/Startup Marketing Part 1 DevFeed: [Bootstrapped/Startup Marketing Part 1]() Original publisher: [Read original article]() Author: Map Published: 2011-02-15T03:55:56Z Content type: tutorial Language: en Sources: [Craig Kerstiens]() Topics: [Search engine optimization (SEO)](), [XML](), [HTML](), [Web Development]() Tags: [google](), [html](), [marketing](), [markup](), [search-engine](), [seo](), [startup](), [startups](), [xml]() ### AI overview The first article in a four-part startup marketing series explains how startups can attract free search traffic through SEO. It covers sitemaps, unique meta tags, title tags, semantic HTML headings, appropriate table use, and manual submission to search engines. ### Source excerpt This is the first of a 4 part series on marketing for startups/bootstrapped companies. Much of the learnings from this are a result of experiences with Registry Stop. The key to each of these is going to be measuring and reacting to your efforts. If you need help on this, check out previous post around metrics for startups. So without further adieu, on this initial post of the series we're going to talk a bit about the biggest free way to get traction and traffic for your startup. The best way to aquire free traffic to your site, is to ensure your site is optimized for search engines or more commonly SEO. Sure you can pay $3 for your ad to show up on certain keywords, but why spend the $3 per click if you can simply ensure you're the first search result. There are slightly different methods for this for each search engine, but we'll cover a broad set of items to pay attention to. Sitemap Most sites have a sitemap.xml at their root level. This could perhaps be one of the biggest pieces of getting indexed that you can pay attention to. This xml tells search engines what pages they should index, how frequently they are updated, and the priority of the page. If you have dynamic pages, you should have this sitemap.xml generated so that it captures all pages. If you need a little more reading on creating your sitemap take a look at: http://www.google.com/support/webmasters/bin/answer.py?answer=183668 Meta Tags Many search engines pay little attention to these tags, but that doesn't mean that all don't. You do want these tags to be as unique as possible per page and relate as much as possible to the content. The really key meta tags you want to have would be your description and your keywords. For a little more information you can check out: http://searchenginewatch.com/2167931 Other Tags While meta tags make pretty straight forward sense, other tags are immensly powerful in how a search engine indexes your site. The first is the title tag, you absolutely want it in and wa ## Basic XHP Abstractions DevFeed: [Basic XHP Abstractions]() Original publisher: [Read original article]() Author: Codebeforethehorse Published: 2011-02-14T07:22:00Z Content type: tutorial Language: en Sources: [Stefan Parker]() Topics: [Development](), [HTML](), [modern web development](), [Web Development](), [Code](), [Programming](), [ui]() Tags: [browser](), [class](), [code](), [component](), [components](), [css](), [development](), [examples](), [function](), [html](), [markup](), [programming](), [render](), [ui](), [web](), [web-developers](), [xhp]() ### AI overview This tutorial demonstrates how XHP can abstract HTML rendering logic into reusable components. Examples cover generating form inputs from a data object and conditionally adding markup for rounded corners based on browser requirements. ### Source excerpt On the surface XHP is nothing more than eye candy, but used correctly it can greatly simplify development. Creating good abstractions has always been smart programming, but it's very difficult to do that for your HTML components without mucking up your rendering code. Enter XHP to the rescue. Here I'll show you some basic examples of how XHP can be used to abstract out your rendering logic. These will be pretty basic, but hopefully enough to give you some ideas for your own setups. Let's start off with a simple abstraction to render form inputs of a basic data object. We can create an XHP element that takes the object as a parameter and returns the correct HTML input: class :ui:data-input extends :x:element { attribute DataObject data @required, string property @required; protected function render() { $data = $this->getAttribute('data'); $property = $this->getAttribute('property'); $input = $property} placeholder={$data->getPropertyDesc($property)} />; if ($data->propertyIsRequired($property)) { $input->addClass('dataRequired'); } return $input; } } Now all we have to do is use a element everywhere we want a text input for our DataObject. We can continue this abstraction out, assuming we model our DataObject well enough, to handle multiple form elements. The resulting XHP might look something like this: class :ui:data-form-element extends :x:element { attribute DataObject data @required, string property @required; protected function render() { $data = $this->getAttribute('data'); $property = $this->getAttribute('property'); switch ($data->getPropertyType($property)) { case 'text': $element = $property} placeholder={$data->getPropertyDesc($property)} />; break; case 'select': $element = $property}