David Dias

키보드 조작 시 현재 선택 위치를 보여 주는 포커스 표시를 점검합니다. 윤곽선이 사라지거나 잘리거나 어긋난 부분을 찾아 잘 보이는 CSS로 수정하도록 돕습니다.

• 키보드 조작 중 선택 위치 확인
• 윤곽선을 제거한 CSS 검토
• 포커스 테두리 잘림과 위치 오류 수정

이미지 파일명을 점검하고 내용을 알 수 있는 소문자와 하이픈 이름으로 정리합니다. 관련 참조도 함께 갱신하여 이미지 검색과 소재 관리를 돕습니다.

• 상품 이미지 파일명을 점검할 때
• 이미지 라이브러리의 이름을 통일할 때
• 이미지 일괄 개명과 참조 갱신이 필요할 때

Audit how quickly a page shows its first text or image. Use performance measurements to identify blocking resources, slow server responses, and rendering delays, then recommend changes tied to the confirmed bottlenecks.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Investigating slow initial page display
• Finding CSS and JavaScript that delay rendering
• Reviewing loading performance with measurements

Check and implement site icons for browser tabs, bookmarks, and mobile home screens. Review icon formats, sizes, HTML declarations, and PWA manifest settings to help the site display appropriate icons across browsers and devices.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Prepare icons for browser tabs and bookmarks
• Set up mobile home screen icons
• Review PWA manifest icon settings

렌더링된 HTML에서 ARIA 속성이 참조하는 ID의 중복을 확인합니다. 잘못 읽히는 레이블과 설명의 원인을 찾아 ID와 참조 수정 및 검증 방법을 안내합니다.

• 화면 읽기 프로그램의 레이블 오류를 조사합니다
• 반복 배치한 구성 요소의 ID 중복을 점검합니다
• 디자인 시스템의 ARIA 참조를 확인합니다

Add FAQ sections to landing pages or blog posts and generate FAQPage structured data, a format search engines can read. Check required question and answer fields, valid syntax, and consistency with content visitors can see.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding FAQ sections to landing pages or blog posts
• Generating structured data from existing questions and answers
• Checking FAQ markup against visible page content

Audit and set up favicons, the small site icons used in browser tabs and search results. Check HTML links, image formats and dimensions, HTTPS access, and crawler restrictions, with guidance for ICO, SVG, and iOS icons.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Checking a site's existing favicon configuration
• Setting up favicons for a new project
• Investigating missing icons in search results

Find empty links, unlabeled icon links, and broken destinations. Add descriptive text or labels that screen readers can announce, and fix or remove broken links so users can understand where each link leads.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Finding empty links across a page
• Adding destination labels to icon links
• Reviewing and fixing broken link destinations

Review JavaScript error handling in source code and browser behavior. Find unhandled asynchronous failures, improve logs with useful context, and add React Error Boundaries, components that handle rendering errors, so failures are handled explicitly and are easier to investigate.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Reviewing error handling in asynchronous code
• Adding Error Boundaries to React components
• Improving logs for debugging

Review images and their visible captions, then connect them with figure and figcaption markup. Check caption placement and alternative text so screen readers can present the relationship between an image and its description.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Reviewing HTML for images with captions
• Checking captions and alternative text for duplication
• Improving screen reader access to image descriptions

Audit or draft an editorial policy for a blog, news site, or sensitive-topic publication. Cover author qualifications, research, fact-checking, corrections, and funding disclosures, and check that readers can find the policy from relevant pages.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Drafting an editorial policy page
• Reviewing author and fact-checking standards
• Documenting corrections and funding disclosures

웹 화면을 느리게 만드는 DOM 읽기와 쓰기, 이벤트 처리를 살펴봅니다. 처리 순서와 갱신 빈도를 조정하고 브라우저에서 원인에 맞는 수정인지 검증합니다.

• 애니메이션 끊김 원인 조사
• DOM 읽기와 쓰기 작업 모으기
• 스크롤 및 터치 이벤트 처리 점검

Flexbox의 가로·세로 배치에서 글자 넘침과 항목 너비 불일치를 확인하고 간격 및 늘어남·줄어듦 설정을 수정합니다. 화면 너비와 조작 상태별 표시도 점검합니다.

• 가로 배치의 글자 넘침 수정
• 항목을 같은 너비로 맞추기
• 항목 간격을 gap으로 통일

Review HTML lists of terms and descriptions, finding dt and dd elements used without a containing dl. Help correct the structure so assistive technologies can associate each term with its description, and explain how to verify the fix.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Check HTML structure in a glossary
• Review lists of metadata labels and values
• Fix dt and dd elements missing a containing dl

Audit page descriptions used for search results, identify text reused across URLs, and write descriptions specific to each page. Review CMS settings and shared templates so each route outputs its own description in the final HTML.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Auditing duplicate page descriptions across a site
• Writing descriptions for individual articles
• Reviewing shared SEO component settings

Review and add E2E tests, which check complete user journeys such as signing in or checking out. Identify missing coverage, organize reusable tests, and check that automated delivery workflows run them and handle failures.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Checking test coverage for sign-in and checkout flows
• Adding tests for form submissions
• Reviewing automated test runs and failure handling in CI/CD

Inspect web font loading to identify invisible text, rendering delays, and layout shifts. Use measured evidence to guide fallback text display, preloading of important fonts, and the use of compressed formats such as WOFF2.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Investigating invisible text during font loading
• Reviewing font-related layout shifts
• Adding fallback text display and font preloading

Review styles written directly in HTML or embedded style blocks, and move suitable rules into external stylesheets. Check layouts across screen sizes and interaction states while preserving justified exceptions for critical styles and dynamic values.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Reviewing styles written directly in HTML
• Moving embedded styles into external stylesheets
• Checking exceptions for critical CSS and dynamic values

Find duplicate JavaScript libraries and multiple versions loaded by a website. Confirm their impact with performance measurements, then consolidate dependencies and review third-party scripts to reduce redundant code and potential version conflicts.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Investigating slow page loads
• Finding duplicate dependencies
• Reviewing libraries bundled with third-party scripts

Measure the size and nesting of a page's DOM, the tree of HTML elements. Identify unnecessary wrappers and oversized lists, then simplify the structure or render only visible list items to reduce confirmed rendering costs.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Investigating pages with slow rendering or interactions
• Measuring HTML element counts and nesting depth
• Removing unnecessary wrapper elements

Review CSS text sizes for mobile readability and accessibility. Identify undersized text and fixed pixel settings, suggest relative units that follow browser font preferences, and check that content and controls remain usable at 200% zoom.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Auditing text sizes on mobile pages
• Converting pixel sizes to relative units
• Checking layouts at 200% zoom

Review image dimensions to find risks of layout shift, where content moves as images load. Get file-level findings and before-and-after HTML using correct width, height, and responsive CSS, while accounting for small decorations with stable sizing.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Investigating content jumps while images load
• Finding images missing width or height attributes
• Preserving image proportions in responsive layouts

Find npm packages that help implement or check a frontend rule, verify download counts and publishing dates, and add up to three qualifying package names to the rule file's metadata.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Adding npm package references to checklist rules
• Screening packages by downloads and publishing dates
• Finding tools to detect, fix, or test a rule

Review keyboard focus, the element currently selected for interaction, to check that Tab navigation follows the page’s visual order. Identify HTML ordering issues and verify focus stays within dialogs and returns to their triggers.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Auditing a page’s Tab navigation order
• Checking focus when dialogs open and close
• Reviewing HTML order and tabindex values