본문으로 건너뛰기
cccskills

스킬 찾기

467건(thedaviddias의 저장소) · 인기순

Review website images for high-density displays, where standard assets can look blurry. Check higher-resolution versions, HTML and CSS image selection, delivery settings, and loading behavior, then identify specific files or components that need changes.

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

  • Investigating blurry images on high-density displays
  • Reviewing srcset for fixed-size and responsive images
  • Checking high-resolution CSS background images
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Audit website redirects after URL migrations, domain changes, or CMS upgrades. Record each redirect path and HTTP status code, identify unnecessary steps or loops, and update redirects to point directly to the final destination.

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

  • Checking redirect paths after a URL migration
  • Finding redirect chains and loops after a domain change
  • Simplifying redirect rules accumulated through CMS upgrades
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Set and review limits for bundled file size and page performance so CI, automated checks on code changes, can catch regressions. Check enforcement on pull requests and review production monitoring for slowdowns after release.

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

  • Reviewing performance limits in CI configuration
  • Checking pull requests that add dependencies or assets
  • Setting limits for file size and page performance
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review picture elements that select images by format or display conditions. Check fallback images, alternative text, dimensions, and source ordering, then provide corrected HTML with JPEG or PNG fallbacks for browsers that cannot use the selected formats.

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

  • Checking fallback images for AVIF or WebP delivery
  • Reviewing picture element order and attributes
  • Fixing image markup with missing descriptions or dimensions
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review HTML object elements and add meaningful fallback content for people who cannot load or view embedded material. Identify missing alternatives, suggest text or appropriate HTML elements, and explain how to verify accessibility.

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

  • Find object elements with missing fallback content
  • Add alternatives for embedded content that fails to load
  • Review whether fallback content conveys equivalent information
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review website animations against users’ reduced motion preferences, a setting that requests less movement. Check flashing content, scrolling effects, alternative transitions, pause controls, and advance warnings, and identify changes needed in rendered pages and interactive states.

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

  • Checking support for reduced motion settings
  • Reviewing flashing content frequency
  • Finding alternatives to scrolling effects
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

product

무료

Add or review Product structured data, machine-readable product details, on shop pages. Check names, images, prices, availability, and ratings against visible content, then validate the markup for eligibility to show enhanced Google search results.

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

  • Add Product JSON-LD to product pages
  • Check structured prices against displayed prices
  • Review availability and rating fields
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

pdf-size

무료

Audit PDFs linked from a website by checking file sizes and response headers, the information returned by the server. Flag large downloads for compression review and suggest HTML versions when the content needs a searchable web page.

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

  • Auditing report and white paper download links
  • Reviewing large PDFs for compression
  • Considering HTML versions of PDF content
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review form fields for code that blocks pasting, then remove those restrictions. The skill helps check password manager use, keyboard interactions, and accessibility so people can paste passwords and other long values into inputs.

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

  • Checking why passwords cannot be pasted
  • Reviewing credit card fields for paste restrictions
  • Improving form accessibility
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review image loading settings based on where images appear on a page. Identify offscreen images that should load later, keep important visible images loading promptly, and add image dimensions to reduce layout shifts.

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

  • Reviewing lazy loading for images below the first screen
  • Checking loading priority for hero images
  • Adding dimensions to lazy-loaded images
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Measure the total size of a web page and its resources, identify what slows loading, and reduce unnecessary weight. Use a 1500KB limit to guide image optimization, code compression, and removal of unused resources.

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

  • Investigating slow page loads on mobile networks
  • Checking total page size against a size budget
  • Reducing heavy images and JavaScript files
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review Referrer-Policy settings to limit sensitive URL details shared when visitors follow external links. Check response headers and pages containing private parameters, suggest suitable policy values, and explain how to verify the resulting browser behavior.

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

  • Checking privacy settings on password reset pages
  • Reviewing server and CDN response headers
  • Comparing policies for pages with sensitive URLs
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Audit web images that are larger than their displayed size and help serve suitable versions for different screens. Review image dimensions, responsive image settings, and Lighthouse findings, then provide updated HTML and steps to verify the changes.

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

  • Finding oversized images on mobile pages
  • Reviewing srcset and sizes against the actual layout
  • Adding image variants for different screen widths
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Audit account settings, privacy pages, and API routes for a complete data deletion flow. Check browser storage cleanup, server deletion requests, and user confirmation, then identify missing pieces and guide implementation.

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

  • Audit account deletion flows
  • Check browser storage cleanup
  • Review server deletion requests
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review fixed pixel values in fonts, widths, and spacing, then suggest relative units that adapt to available space and browser font preferences. Check rendered layouts at different screen widths and during interactions before proposing changes.

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

  • Adapting text to browser font size preferences
  • Replacing fixed widths with flexible layouts
  • Reviewing spacing units within components
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Audit a page’s social sharing URL against its canonical URL, the preferred page address. Identify differences in domains, paths, or tracking parameters, and align the tags to address split share counts.

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

  • Investigating unexpectedly low social share counts
  • Checking Open Graph tags before publication
  • Reviewing tracking parameters and URL variations
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review HTTP response headers and restrict browser features an application does not need, such as camera, microphone, and location access. Guide Permissions-Policy settings that limit what attackers could use if the site is compromised.

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

  • Review security headers before a release
  • Disable unused camera and microphone features
  • Check feature restrictions for third-party iframes
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

reset-css

무료

Review stylesheets for a CSS reset or normalization layer that reduces differences in browser defaults. Check import order, framework provisions, and rendered layouts across screen sizes and interaction states, then suggest changes for a consistent styling foundation.

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

  • Investigating layout differences between browsers
  • Choosing a reset for a new site's styles
  • Checking reset coverage in a CSS framework
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Find important pages that receive no links from elsewhere on the site. Compare crawl results with sitemaps and indexed pages, then suggest relevant existing pages where descriptive internal links could help connect the content.

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

  • Audit internal links across a site
  • Investigate pages with low organic search traffic
  • Find relevant pages to link to isolated content
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Audit XML sitemaps for URLs marked noindex, an instruction to exclude pages from search results, and for unsuccessful responses. Identify conflicting entries and recommend removing either the sitemap entry or the noindex instruction according to the page’s intended visibility.

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

  • Auditing noindex URLs in an XML sitemap
  • Investigating why pages are excluded from search results
  • Removing pages intended to stay out of search from sitemaps
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review mobile and tablet pages in portrait and landscape. Identify orientation locks, blocking rotation messages, and hidden controls, then suggest responsive layout changes so essential content and actions remain usable in both orientations.

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

  • Checking mobile and tablet orientation support
  • Reviewing forms after device rotation
  • Inspecting dashboard and media layouts
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review website JPEGs for progressive encoding, which displays a blurry preview before sharpening. Identify images that could use this format, consider file size and loading behavior together, and explain how to confirm the change in browser developer tools.

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

  • Reviewing how JPEGs appear during loading
  • Checking JPEG fallbacks for WebP or AVIF
  • Reviewing image delivery through a CDN or build process
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Review images displayed at different screen sizes and help browsers select appropriately sized files. Check srcset image options, sizes display-width hints, and CSS layout together to identify oversized mobile downloads or mismatched image variants.

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

  • Reviewing responsive images in articles
  • Reducing oversized image downloads on phones
  • Checking image sizes in cards and galleries
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트

Check images used in social link previews through Open Graph metadata. Verify dimensions, aspect ratio, file size, and HTTPS URLs, then resize assets and update tags to reduce missing images and unwanted cropping.

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

  • Auditing social link preview images
  • Preparing 1200×630-pixel sharing images
  • Investigating missing or cropped preview images
thedaviddias/Front-End-Checklist7.5만2026년 10월 6일 업데이트