DRKNYT / Methods & design principles

How we design
and build.

A guide to our methods, standards and language.

Data on demand, demonstrated.
Open only what you need.

Working guide. Our practice and targets, not an independent certification.

About this guide

Clear language.
Inclusive experiences.

Readable information for people and the systems they use.

Consent, accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source , performance and discoverability are design decisions. Here are the choices guiding our work, the things we avoid, and what we mean by the standards.

An example of how we organize informationA reading sequence, shown as an example. These labels are not links or controls.

What is this?
What can I choose?
What happens next?

A working guide for new work and scoped improvements. Older surfaces may still need to catch up. It describes our practice and targets, not independently certified status or universal conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source . Formal policies and their current status remain in Trust & policies.

Our principles for designing and building

Say clearly what this is and what it does.
The headline should carry the meaning. Body copy adds context. A person should be able to skim a page and understand the offer, the current stage and the next step.
We avoidMetaphorical headlines that leave the useful explanation in tiny captions.
Explain shortened and specialist language beside the words.
Spell out an acronym or provide a plain-language term note where it appears. Give hard words, technical phrases and unfamiliar standards the same treatment. A short definition should answer the immediate question; a source link can open the fuller explanation without interrupting the main task.
We avoidMaking people leave the page to decode essential instructions, using a glossary that is harder than the original term, or assuming a familiar abbreviation is familiar to everyone.
Make the first screen useful. Bring detail on demand.
The fold is the edge of the first visible screen, and it changes with the device. Use that first view to establish the purpose and main choice. Data on demand means bringing forward the relevant data when it is needed, instead of loading or presenting everything upfront.
We avoidA full screen of atmosphere before the purpose becomes clear, or making everyone load a large dataset to answer a small question. Material conditions still belong before the decision.
Ask for the least effort the task needs.
Minimum friction means fewer unnecessary fields, repeated explanations, detours and interruptions. Judge the whole task, not just the number of clicks. Keep the steps that protect a person’s choice, privacy or work.
We avoidRepeated sign-ins without a reason, asking for the same information twice, or removing a meaningful consent or confirmation just to shorten a flow.
Make the complete task work from the keyboard.
Keep Tab and Shift+Tab in a clear order and make focus easy to see. Enter should continue or submit where a nativeBuilt into the browser, rather than recreated with a separate custom control.Open the source form does; Space should activate nativeBuilt into the browser, rather than recreated with a separate custom control.Open the source buttons and controls. A modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source should keep focus while open, close with Escape and return focus to the control that opened it. Multiline fields keep Enter for a new line. No one should become trapped or need a mouse to finish.
We avoidHiding focus, changing the expected meaning of Enter inside text fields, inventing keyboard behavior for nativeBuilt into the browser, rather than recreated with a separate custom control.Open the source controls, or moving focus without a clear reason.
Reduce sign-in friction without blurring the security model.
Ask people to prove only what the task requires and explain the method in plain language. DRKNYT currently uses email magic links for its public Profile journey. OIDCOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source can provide federated sign-inSigning in to one service through another trusted service that checks who you are.Open the source , and passkeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source can provide passwordlessSigning in without a reusable account password. Email links and passkeys are two methods, with different security and recovery needs. public-keyA security method using a public part a service can store and a private part that stays with the person’s device or their sign-in service.Open the source sign-in, but they are different technologies and are not current DRKNYT features merely because this guide explains them.
We avoidCalling every sign-in method passwordlessSigning in without a reusable account password. Email links and passkeys are two methods, with different security and recovery needs., treating OAuthA framework for granting an application limited access to another service. It controls permitted actions; it does not establish identity by itself.Open the source authorizationDeciding which information or actions a person or application is allowed to access. as identity by itself, claiming a planned provider is live, or removing an access check only to shorten the flow.
Make consent specific to the choice.
Explain what someone is agreeing to, what will be used and who can see it. Permission to send something for private review should not quietly become permission to publish it or use it for a new purpose.
We avoidTreating a public image, an upload or a general sign-up as permission for every later use.
Show the information that changes a decision.
Put material prices, limits, access conditions and image disclosures beside the relevant content or action. Supporting details can unfold on request; the fact that changes the decision belongs in view.
We avoidHiding a consequential condition in fine print, a tooltip or a collapsed panel.
Make links go where they say.
A project card opens the project or its own page. “All work” opens the overview. We do not use buttons or links just to jump to another spot on the same page, except clearly labeled Skip utilities or Back to top controls.
We avoidA button promising an experience and delivering only a scroll. “View,” “request,” “submit” and “buy” mean different things.
Use a modal (a focused window over the page).
We generally prefer a normal page for reading and a modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source for a short task or an important confirmation. A dialog needs a clear title, usable keyboard focus and an obvious way to close it and return.
We avoidInterruptions for their own sake, a stack of dialogs, or required policies and brand credits hidden inside one.
Keep the identity intact.
A lockupA fixed arrangement of a brand symbol and its drawn name. It should be used as one piece of artwork. is a deliberate arrangement of the mark and wordmarkA brand name drawn as identity artwork rather than ordinary typed text.. Use the source artwork, preserve its proportions and clear space, and check that it remains recognizable at the size people actually see.
We avoidTyping out an imitation logo, stretching the artwork or shrinking a brand credit until it disappears.
Show the real thing when the real thing matters.
Use a current website capture to show a website. Use the actual product or permissioned photography when someone needs to inspect it. Concept imagery has a place, with a disclosure when its nature changes the meaning.
We avoidInvented interfaces presented as working products, generated scenes presented as evidence, or crops that remove essential context.
Include the people a default can leave out.
Consider disability, language, identity, age, device, bandwidth and situation. Include people affected by a design in research and review. Keyboard access, screen-readerSoftware that presents screen content through speech, braille or both. structure, captions, useful image descriptions, zoom and reduced-motionA device preference asking interfaces to limit nonessential movement and animation. support belong in the work. Record assumptions until they are tested.
We avoidTreating one imagined “average user” as everyone, representation as proof of accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source , or a checklist as a substitute for listening to people.
Keep the same meaning for people and machines.
Start with clear writing and meaningful HTMLHyperText Markup Language: the elements that give a web page its structure and meaning.: headings, lists, labels and real links. Add structured dataNamed facts and relationships written in a recognized format for software to interpret. or public data formats when useful, using the same facts, sources and limitations a person can read. Machine access is another pathway, not a substitute for human access.
We avoidImportant text available only inside an image, hidden claims written just for bots, or private information exposed through a public feed or share card.
Make public work discoverable and attributable.
Use clear page titles, dedicated URLsUniform Resource Locator: the address of a web page or resource., accurate descriptions, canonical linksPage markers that identify the preferred public web address for the same or very similar content. and a maintained sitemapA file listing public web addresses that a site wants search systems to discover.. Give public claims a source, author and relevant date. Check crawling and indexing deliberately; protect private material with access controls. Search and AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source visibility need continuing observation.
We avoidKeyword stuffing, invented expertise, guaranteed rankings or AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source citations, and treating a robots fileA public file that gives crawlers instructions. It is not access control and cannot keep private material private. as a privacy boundary.
Design for quick, stable and responsive use.
Respect a person’s time, device and data. Budget images, fonts, JavaScript and third-party requests; reserve space so content does not jump. Use LighthouseAn automated tool that runs selected diagnostics on a web page under stated test conditions. and PageSpeed InsightsA Google service that shows automated page diagnostics and, when available, real-visit performance data.Open the source to investigate problems, then compare real-user data where available. Record the device, route, conditions and date of a test.
We avoidAn impressive animation that delays the task, downloading everything upfront, or tuning one score while the real experience gets worse.
Help people recover when something goes wrong.
Design loading, empty, error and permission states alongside the happy path. Preserve entered work where appropriate, explain what happened and offer a useful retry or next step. Confirm consequential actions from the system that actually performed them.
We avoidEndless spinners, silent failures, unexplained data loss, and a success message that only means someone clicked a button.
Check the result before calling it finished.
A preview, a tested function and a released product are different stages. Inspect the renderedTurned into the page or experience a person can actually see and use. experience, follow the promised paths and record what was checked, what remains uncertain and what needs work next.
We avoidCalling a screenshot a working product, a local change a deployment, or a successful click proof that an external action completed.

Standards, checks and certification

What the standards mean

A standard defines requirements. An evaluation records findings against them. A certification needs a named issuer, a clear statement of what was assessed, a defined scope and valid dates. This guide does not establish an independent certification or a site-wide conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source claim.

Keyboard behavior should stay predictable.

Tab and Shift+Tab move through controls in a useful order, with visible focus. Enter follows the nativeBuilt into the browser, rather than recreated with a separate custom control.Open the source form behavior for continuation or submission; Space activates nativeBuilt into the browser, rather than recreated with a separate custom control.Open the source buttons and controls. In a multiline field, Enter remains a new line rather than becoming unexpected navigation. A modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source keeps focus while open, closes with Escape and returns focus to the control that opened it. See the W3C keyboard interface guidanceWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. This source provides the original guidance.Open the source and modal dialog patternA dialog that temporarily makes the page behind it unavailable until the dialog closes. This source provides the original guidance.Open the source .

These are design and implementation expectations, not a claim that every current DRKNYT surface has completed keyboard or assistive-technology evaluation.

Sign-in choices have different trust boundaries.

DRKNYT currently uses email magic links for its public Profile journey. They depend on the person’s email account and delivery path. OpenID ConnectOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source supports federated sign-inSigning in to one service through another trusted service that checks who you are.Open the source , but it is not inherently passwordlessSigning in without a reusable account password. Email links and passkeys are two methods, with different security and recovery needs.; OAuthA framework for granting an application limited access to another service. It controls permitted actions; it does not establish identity by itself.Open the source is the related authorizationDeciding which information or actions a person or application is allowed to access. framework, not identity by itself. The OpenID Connect overviewOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password. This source provides the original guidance.Open the source explains the sign-in flow.

PasskeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source use origin-boundRestricted to the real website address, which helps stop a sign-in key from working on a look-alike site.Open the source public-key credentialsA security method using a public part a service can store and a private part that stays with the person’s device or their sign-in service.Open the source designed to resist phishingAn attempt to trick someone into giving sign-in details or sensitive information to an imitation or dishonest destination.Open the source . A device unlock such as a PINPersonal identification number: a short secret used locally to unlock a device or sign-in key. A passkey device unlock number is not sent to the website.Open the source or biometricA body-based device unlock, such as a fingerprint or face check. When signing in with a passkey, the website does not receive the face or fingerprint data.Open the source stays with the device or credential provider and is not shared with the website. See the FIDO Alliance passkey overviewFast Identity Online: open standards for sign-in with a pair of security keys instead of a password shared with the website. A sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in. This source provides the original guidance.Open the source . This guide does not claim that DRKNYT currently offers passkeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source , OIDCOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source or SSOSingle sign-on: using one trusted sign-in session to enter multiple connected services.Open the source .

AccessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source target

WCAGWeb Content Accessibility Guidelines: testable requirements for making web content more accessible.Open the source 2.2 Level AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source

Our public accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source policy names this target. Level AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source includes the applicable Level A and AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source criteria. Evaluation must cover complete pages and processes in its stated scope, using automated and human checks.

A target is not a conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source finding. A selection of passing pages or a 100 automated score does not establish site-wide conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source .

W3C conformance guidanceWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. Meeting the requirements of a named standard, version and level within a clearly stated scope. This source provides the original guidance.Open the source

Diagnostic tools

LighthouseAn automated tool that runs selected diagnostics on a web page under stated test conditions. & PageSpeed InsightsA Google service that shows automated page diagnostics and, when available, real-visit performance data.Open the source

LighthouseAn automated tool that runs selected diagnostics on a web page under stated test conditions. provides lab diagnosticsControlled simulations of a visit. They help find problems but can differ from what happens during real visits.Open the source . PageSpeed InsightsA Google service that shows automated page diagnostics and, when available, real-visit performance data.Open the source also shows real-user data where enough is available. Record the URLUniform Resource Locator: the address of a web page or resource., date, tool version, device mode and conditions; investigate the actual loading and interaction problems.

Scores vary by conditions and coverage. LighthouseAn automated tool that runs selected diagnostics on a web page under stated test conditions.’s accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source score excludes manual audits; it is not a certificate or a complete accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source evaluation.

About PageSpeed InsightsA Google service that shows automated page diagnostics and, when available, real-visit performance data. This source provides the original guidance.Open the source

Real-user performance benchmarks

Core Web VitalsGoogle’s three main real-visit measures for loading speed, response to input and unexpected movement on the page.Open the source

Assess loading, responsiveness and visual stability using LCPLargest Contentful Paint: a measure of when the largest visible image or text block appears.Open the source , INPInteraction to Next Paint: a measure of how quickly a page visibly responds to a person’s actions.Open the source and CLSCumulative Layout Shift: a measure of unexpected movement in the page layout.Open the source . The good thresholds below apply at the 75th percentileA value that at least three quarters of the measured visits meet or improve upon.Open the source of visits, with mobile and desktop assessed separately.

These are reference benchmarks, not measured results for this page. An absence of field dataMeasurements collected from real visits, kept separate from a simulated test run.Open the source is an unknown, not a pass.

Google’s Web Vitals guidanceRead the original guidance supporting this explanation.Open the source

Dated evidence

Evaluation reports and ACRsAccessibility Conformance Report: a dated report describing how a specific product or version meets named accessibility requirements.Open the source

A useful audit identifies the evaluated product, version, pages and journeys, methods, assessor, date, findings and limitations. A VPATVoluntary Product Accessibility Template: a standard template used to write an Accessibility Conformance Report. The blank template is not a certification.Open the source is a template; a completed product-specific report is an AccessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source ConformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source Report (ACRAccessibility Conformance Report: a dated report describing how a specific product or version meets named accessibility requirements.Open the source ).

ITIInformation Technology Industry Council: the organization that publishes the Voluntary Product Accessibility Templates.Open the source does not certify VPATsVoluntary Product Accessibility Template: a standard template used to write an Accessibility Conformance Report. The blank template is not a certification.Open the source . A report describes evaluated conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source ; its presence alone is not a blanket certificate or legal assurance.

ITI on VPATs and ACRsAccessibility Conformance Report: a dated report describing how a specific product or version meets named accessibility requirements. Voluntary Product Accessibility Template: a standard template used to write an Accessibility Conformance Report. The blank template is not a certification. Information Technology Industry Council: the organization that publishes the Voluntary Product Accessibility Templates. This source provides the original guidance.Open the source

ContrastThe measurable brightness difference between foreground information and its background. is measurable.

Check actual foregrounds, backgrounds, hover, focus and error states. Use labels, shapes or underlines alongside color. These WCAGWeb Content Accessibility Guidelines: testable requirements for making web content more accessible.Open the source AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source thresholds have defined exceptions and are only part of an accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source evaluation.

Web Content Accessibility Guidelines: Level Double-A contrast reference
What is being read	Minimum	Scope
Normal text	4.5:1	WCAGWeb Content Accessibility Guidelines: testable requirements for making web content more accessible.Open the source AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source minimum contrastThe measurable brightness difference between foreground information and its background. against its background.
Qualifying large text	3:1	At least 18pt regular or 14pt bold; use the actual delivered size.
Essential interface cues and graphics	3:1	Against adjacent colors, where the non-text contrastThe measurable brightness difference between foreground information and its background. criterion applies.

A useful link is recognizable without color alone.
Read the accessibility policy draft

Performance is a real experience.

These are Google’s good Core Web VitalsGoogle’s three main real-visit measures for loading speed, response to input and unexpected movement on the page.Open the source thresholds at the 75th percentileA value that at least three quarters of the measured visits meet or improve upon.Open the source of visits, assessed separately for mobile and desktop. They are reference values, not scores measured for this site.

LCPLargest Contentful Paint: a measure of when the largest visible image or text block appears.Open the source Main content loads: ≤ 2.5 seconds
INPInteraction to Next Paint: a measure of how quickly a page visibly responds to a person’s actions.Open the source The page responds: ≤ 200 milliseconds
CLSCumulative Layout Shift: a measure of unexpected movement in the page layout.Open the source The layout stays stable: ≤ 0.1

Lab testsControlled simulations of a visit. They help find problems but can differ from what happens during real visits.Open the source help diagnose. Real-user field dataMeasurements collected from real visits, kept separate from a simulated test run.Open the source describes observed visits where enough data exists. Review the complete task, including loading, input response, layout changes and recovery.

Publish evidence with its scope.

IAAPInternational Association of Accessibility Professionals: an organization that provides credentials to qualifying individuals.Open the source credentials belong to named individuals. ISOInternational Organization for Standardization: an organization that publishes standards agreed by participating national standards bodies.Open the source 9241-210 describes human-centred design activities; citing a process standard does not certify a website. Any credential or certification we publish must be current, verifiable and tied to its actual scope.

Any claim should identify what was assessed, by whom, against which version, on what date and with what limitations. A W3CWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web.Open the source conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source logo is a content provider’s claim; W3CWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web.Open the source does not verify it.

For Google’s AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source search features, existing SEOSearch engine optimization: improving public content and its technical setup so search engines can find and understand it.Open the source fundamentals remain relevant; Google specifies no special AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source file or schemaA defined set of fields and relationships used to organize and validate information. requirement. Our JSONJavaScript Object Notation: a text format for exchanging named values, lists and records between systems. guide supports reuse and inspection. It does not guarantee discovery, ranking or an AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source citation.

W3C keyboard interface guidanceWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. This source provides the original guidance.Open the source W3C modal dialog patternWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. A dialog that temporarily makes the page behind it unavailable until the dialog closes. This source provides the original guidance.Open the source OpenID Connect overviewOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password. This source provides the original guidance.Open the source FIDO Alliance on passkeysFast Identity Online: open standards for sign-in with a pair of security keys instead of a password shared with the website. A sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in. This source provides the original guidance.Open the source W3C text contrastWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. The measurable brightness difference between foreground information and its background. This source provides the original guidance.Open the source W3C non-text contrastWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. The measurable brightness difference between foreground information and its background. This source provides the original guidance.Open the source Lighthouse accessibility scoringMaking information and controls usable by people with different abilities and ways of interacting. An automated tool that runs selected diagnostics on a web page under stated test conditions. This source provides the original guidance.Open the source Microsoft Inclusive DesignRead the original guidance supporting this explanation.Open the source Google’s AI search guidanceArtificial intelligence: software that produces or interprets material from patterns in data. This source provides the original guidance.Open the source W3C on conformance-logo claimsWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. Meeting the requirements of a named standard, version and level within a clearly stated scope. This source provides the original guidance.Open the source IAAP professional certificationsInternational Association of Accessibility Professionals: an organization that provides credentials to qualifying individuals. This source provides the original guidance.Open the source ISO 9241-210International Organization for Standardization: an organization that publishes standards agreed by participating national standards bodies. This source provides the original guidance.Open the source

How we keep our brand intact

Our identity in practice

One kit keeps every use recognizable.

Our brand includes lockups, marks, icons, a paletteA defined set of colors, with a role for each one. A brand palette still needs contrast checks in the actual layout., taglines, typefaces and a specific Sign in with DRKNYT composition. Research and Strategy and the quieter Applied Sciences Division sit within DRKNYT; division names, product names and the parent identity have distinct roles. The policy keeps their relationship consistent across our own products and gives external teams a clear source to use.

Vector artworkArtwork described by shapes and paths rather than a fixed grid of pixels. Its edges stay clean when resized, but a placement can still be too small to read.Open the source describes shapes instead of a fixed grid of pixels, so its edges stay clean as it changes size. Our logo lettering is saved as shapes too: a missing font cannot change the name. Keep that master for future exports, and still check that the actual placement is large enough to read.

A supplied light-surface variant is a deliberate choice for contrastThe measurable brightness difference between foreground information and its background.. It is not permission to recolor or rebuild the identity.

Open the brand kit and usage policy

Light lettering and cyan signal · source vector artworkArtwork described by shapes and paths rather than a fixed grid of pixels. Its edges stay clean when resized, but a placement can still be too small to read.Open the source , kept in its original proportions.

Dark lettering and infraredThe name of DRKNYT’s warm signal treatment in its light-surface identity artwork. It describes the supplied color treatment, not infrared sensing technology. signal · the supplied light-surface counterpart.

Research and Strategy · supplied outlinedLettering saved as drawn shapes instead of editable font characters. This keeps the logo consistent even when the font is not installed. division composition, copied intact. Its lettering is stored as shapes, so no installed font is needed to renderTurned into the page or experience a person can actually see and use. it.

Image details

Deterministic vectorArtwork described by shapes and paths rather than a fixed grid of pixels. Its edges stay clean when resized, but a placement can still be too small to read.Open the source composition from existing DRKNYT artwork; no image model. Historical parent-artwork tooling and the directing model were not recovered.

Three approved sign-in treatments. Artwork specimens only; these images do not sign you in.

DRKNYT Display / Primary tagline

Create what comes next.

Our display face supports short headings. The wordmarkA brand name drawn as identity artwork rather than ordinary typed text. remains its own artwork.

Words in plain language

A shared vocabulary

You do not need to speak design to work with us. Here is what we mean when these terms come up.

Accessibility: Making content and actions understandable and usable across different abilities, devices and ways of interacting. It includes access to meaning, as well as controls.
Artificial intelligence (AI) discoverability: Making appropriate public content understandable and retrievable by AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source -powered search and other systems. Useful, attributable content and sound technical foundations help; inclusion or citation is never guaranteed.
Button: A control that performs an action, such as saving, submitting or opening a dialog. Its label should describe the result.
Clear space: The breathing room around a brand asset that keeps other elements from crowding it. It is part of using the identity correctly.
Conformance: Meeting the requirements of a named standard, version and level within a defined scope. A claim needs dated evaluation evidence; a target or automated score alone does not establish it.
Contrast: The difference in relative brightness between foreground and background. Measure text and essential interface cues in their actual states, rather than judging a color paletteA defined set of colors, with a role for each one. A brand palette still needs contrast checks in the actual layout. by eye.
Consent: An informed choice to permit a specific use or action. Explain the purpose and audience before the choice; ask again when the intended use changes.
Data on demand (DoD): Bringing relevant information forward when someone needs or asks for it, rather than loading or showing everything at once. Keep the initial view useful and the next request clear.
Disclosure: Information someone needs to interpret a claim, image, limitation or choice fairly. For example: a scene is AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source -generated, or a tool is still a prototype.
Core Web Vitals: Real-user measures of loading, responsiveness and visual stability: LCPLargest Contentful Paint: a measure of when the largest visible image or text block appears.Open the source , INPInteraction to Next Paint: a measure of how quickly a page visibly responds to a person’s actions.Open the source and CLSCumulative Layout Shift: a measure of unexpected movement in the page layout.Open the source . Keep field evidenceMeasurements collected from real visits, kept separate from a simulated test run.Open the source separate from a simulated lab runControlled simulations of a visit. They help find problems but can differ from what happens during real visits.Open the source .
Fold: The boundary of the first visible screen before scrolling. It moves with screen size and orientation; design the opening hierarchy for that variation, not one fixed height.
Hero: The opening composition of a page: usually its main headline, explanation and image or visual treatment. It should make the page’s purpose clear.
Inclusive design: A practice of identifying exclusion, learning from people with different experiences and designing more ways to participate. AccessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source standards are one important part of that work.
Keyboard focus: The current place where keyboard input will act. Focus should follow a useful order, remain visible, stay inside an open modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source and return to a useful control when that modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source closes.
Lighthouse: An automated diagnostic tool for a page under specified conditions. Its performance, accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source , best-practices and SEOSearch engine optimization: improving public content and its technical setup so search engines can find and understand it.Open the source scores cover particular checks; they are not certificates.
Link: A route to a named destination. At DRKNYT, ordinary navigation opens a page, resource or experience; same-page jumps are reserved for labeled Skip and Back to top utilities.
Lockup: The fixed arrangement of a brand’s mark and wordmarkA brand name drawn as identity artwork rather than ordinary typed text., sometimes including a divider or other approved element. Use the artwork as a whole.
Machine-readable: Content whose structure and meaning software can interpret, such as semantic HTMLHyperText Markup Language elements chosen for what content means, such as headings, lists, links, buttons and labels., structured dataNamed facts and relationships written in a recognized format for software to interpret. or a documented JSONJavaScript Object Notation: a text format for exchanging named values, lists and records between systems. record. Preserve the same facts and access boundaries as the human view.
Mark: The visual symbol of an identity. It can stand alone where the brand guide permits it; it is different from the written brand name.
Minimum friction: The least unnecessary effort between a person and their goal. Reduce repetition and detours while preserving useful choices, consent, access checks and important confirmations.
Modal: A dialog over the current page that temporarily makes the content behind it unavailable. Keyboard focus stays in the dialog until it closes, then returns to a useful place.
Native disclosure: An in-page control that opens supporting information, such as the expandable example below. It reveals content without pretending to navigate.
OpenID Connect (OIDC): An identity layer used for federated sign-inSigning in to one service through another trusted service that checks who you are.Open the source . It lets a service verify a person through an identity providerA service that verifies a person’s identity for another service when signing in through that service.Open the source . OIDCOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source can reduce repeated account setup, but it is not inherently passwordlessSigning in without a reusable account password. Email links and passkeys are two methods, with different security and recovery needs..
OAuth 2.0: A framework for delegated authorizationDeciding which information or actions a person or application is allowed to access.: granting an application limited access to a service. OIDCOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source adds an identity layer for sign-in; OAuthA framework for granting an application limited access to another service. It controls permitted actions; it does not establish identity by itself.Open the source alone should not be described as authenticationChecking who is signing in..
Passkey: A phishingAn attempt to trick someone into giving sign-in details or sensitive information to an imitation or dishonest destination.Open the source -resistant sign-in credential based on public-keyA security method using a public part a service can store and a private part that stays with the person’s device or their sign-in service.Open the source cryptography. The private key stays with the person’s device or credential provider, and a device unlock such as a PINPersonal identification number: a short secret used locally to unlock a device or sign-in key. A passkey device unlock number is not sent to the website.Open the source or biometricA body-based device unlock, such as a fingerprint or face check. When signing in with a passkey, the website does not receive the face or fingerprint data.Open the source is not shared with the website.
Web Authentication (WebAuthn): The web standard applications use to request and verify public-key credentialsA security method using a public part a service can store and a private part that stays with the person’s device or their sign-in service.Open the source , including passkeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source . It is one part of the broader FIDOFast Identity Online: open standards for sign-in with a pair of security keys instead of a password shared with the website.Open the source approach to authenticationChecking who is signing in..
Fast Identity Online (FIDO): A family of open authenticationChecking who is signing in. standards built around public-key credentialsA security method using a public part a service can store and a private part that stays with the person’s device or their sign-in service.Open the source . FIDOFast Identity Online: open standards for sign-in with a pair of security keys instead of a password shared with the website.Open the source -based passkeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source are designed to resist phishingAn attempt to trick someone into giving sign-in details or sensitive information to an imitation or dishonest destination.Open the source and remove shared passwords from the website sign-in exchange.
Passwordless: Sign-in without a reusable account password. PasskeysA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source and email magic links can both be passwordlessSigning in without a reusable account password. Email links and passkeys are two methods, with different security and recovery needs. experiences, but their trust, recovery and phishingAn attempt to trick someone into giving sign-in details or sensitive information to an imitation or dishonest destination.Open the source properties are different.
Email magic link: A time-limited sign-in link sent to an email address. It depends on access to that email account and the security of the delivery path; it is not equivalent to an origin-boundRestricted to the real website address, which helps stop a sign-in key from working on a look-alike site.Open the source passkeyA sign-in key tied to the real website, designed to resist imitation sites. DRKNYT does not currently claim passkey sign-in.Open the source .
Multi-factor authentication (MFA): Sign-in that requires more than one independent factor, such as a credential plus a device or possession check. Two steps are not necessarily two independent factors.
Single sign-on (SSO): Using one identity-provider session to enter multiple connected services. SSOSingle sign-on: using one trusted sign-in session to enter multiple connected services.Open the source describes the shared sign-in experience; OIDCOpenID Connect: a way for a service to check who is signing in through another trusted service. It does not necessarily remove the need for a password.Open the source is one protocol that can support it.
PageSpeed Insights: A Google service showing LighthouseAn automated tool that runs selected diagnostics on a web page under stated test conditions. lab diagnosticsControlled simulations of a visit. They help find problems but can differ from what happens during real visits.Open the source and, where available, real-user Chrome UXUser experience: what a person encounters while trying to understand and complete a task. Report data. Lab and field results answer different questions and may differ.
Preview: A version for inspection. Our review previews stay passive: they do not send messages, record live analytics, take payment or change production state.
Progressive disclosure: Showing the information needed now, with more detail available when it helps. It should reduce clutter without concealing a material condition.
Provenance: The record of where something came from, who or what made it and how it changed. Keep known sources and transformations; identify gaps rather than inventing a history.
Prototype: A model for exploring an idea or interaction. Its appearance alone does not establish that its features, accounts, payments or integrations work.
Search engine optimization (SEO): Search engine optimization: helping search engines discover, understand and present useful public pages. It includes content quality and technical foundations, not a promise of placement.
Structured data: An explicit description of content and its relationships in a recognized format. It should agree with the visible page and does not guarantee a search feature or AIArtificial intelligence: software that produces or interprets material from patterns in data.Open the source citation.
Web Content Accessibility Guidelines (WCAG): Web Content AccessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source Guidelines. Our public accessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source policy names WCAGWeb Content Accessibility Guidelines: testable requirements for making web content more accessible.Open the source 2.2 Level AALevel Double-A: the middle level of the Web Content Accessibility Guidelines. It includes the applicable basic and intermediate requirements.Open the source as a target; this guide does not establish current site-wide conformanceMeeting the requirements of a named standard, version and level within a clearly stated scope.Open the source .
Wordmark: The name of a brand drawn as identity artwork. A heading in a similar typeface is not a replacement for the source wordmarkA brand name drawn as identity artwork rather than ordinary typed text..
Vector artwork: Artwork described by shapes and paths instead of a fixed grid of pixels. It can be resized without making its edges blocky. The logo still needs enough space to be recognizable at the actual size.

An example of showing detail on demand

This is supporting information, revealed in place. The page has not moved and no new destination has opened. A link would take you somewhere; this control simply opens and closes this explanation.

For the technical behavior behind modalA dialog that temporarily makes the page behind it unavailable until the dialog closes.Open the source dialogs, see the W3C dialog patternWorld Wide Web Consortium: the organization that develops open standards and accessibility guidance for the web. This source provides the original guidance.Open the source . AccessibilityMaking information and controls usable by people with different abilities and ways of interacting.Open the source goals and current limitations are described in our accessibility policy draft.

Put the guide to work

Keep the standard visible

The practice should show up in the work.

If an experience misses the mark, the next step is to understand and improve it. A published principle is a standard to work against, not proof of perfect implementation.

About this guide

Clear language.Inclusive experiences.

Our principles for designing and building

Say clearly what this is and what it does.

Explain shortened and specialist language beside the words.

Make the first screen useful. Bring detail on demand.

Ask for the least effort the task needs.

Make the complete task work from the keyboard.

Reduce sign-in friction without blurring the security model.

Make consent specific to the choice.

Show the information that changes a decision.

Make links go where they say.

Use a modal (a focused window over the page).

Keep the identity intact.

Show the real thing when the real thing matters.

Include the people a default can leave out.

Keep the same meaning for people and machines.

Make public work discoverable and attributable.

Design for quick, stable and responsive use.

Help people recover when something goes wrong.

Check the result before calling it finished.