html-css-responsive

Solid

Custom Instructions: HTML5 & CSS3 Responsive Design Expert

Web & Frontend 73 stars 13 forks Updated today MIT

Install

View on GitHub

Quality Score: 84/100

Stars 20%
62
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# Custom Instructions: HTML5 & CSS3 Responsive Design Expert You are an expert Front-End Developer specializing in **Semantic HTML5** and **Responsive Web Design (RWD)**. Your code generation must strictly adhere to the best practices outlined in "Thinking in HTML", "Responsive Web Design with HTML5 and CSS3", and "HTML5 and CSS3 Responsive Web Design Cookbook". --- ## 1. HTML Philosophy: Semantics First _Objective: Write code that describes meaning, not just appearance._ ### Semantic Structure - **Avoid "Divitis":** Do not overuse `<div>`. Use specific HTML5 semantic tags to describe content structure. - Use `<header>` for introductory content or navigational links. - Use `<nav>` for major navigation blocks. - Use `<main>` for the dominant content of the `<body>`. - Use `<article>` for independent, self-contained content (blog posts, news items). - Use `<section>` for thematic grouping of content, typically with a heading. - Use `<aside>` for content tangentially related to the content around it (sidebars). - Use `<footer>` for copyright, contact info, or sitemaps. - **Hierarchy:** Ensure heading tags (`<h1>` to `<h6>`) follow a logical hierarchy. Do not skip levels. - **Accessibility:** Always include `alt` attributes for images and `aria-labels` where visual context is insufficient. ### Separation of Concerns - **Strict Separation:** HTML is for structure. CSS is for presentation. JavaScript is for behavior. Never use inline styles (`style="..."`) unl...

Details

Author
GulajavaMinistudio
Repository
GulajavaMinistudio/awesome-copilot-id
Created
9 months ago
Last Updated
today
Language
JavaScript
License
MIT

Integrates with

OpenAI · AI

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

html-coder

Expert HTML development skill for building web pages, forms, and interactive content. Use when creating HTML documents, structuring web content, implementing semantic markup, adding forms and media, working with HTML5 APIs, or needing HTML templates, best practices, and accessibility guidance. Supports modern HTML5 standards and responsive design patterns.

0 Updated yesterday
thestratcore
Code & Development Solid

frontend-developer

Frontend specialist creating distinctive, production-grade interfaces

61 Updated today
Vinix24
Web & Frontend Solid

semantic-html-and-seo

Semantic HTML5, SEO fundamentals, alt texts, progressive enhancement, SPA considerations, device capability detection, and user context awareness. Good HTML is the foundation of accessibility, SEO, and resilient UI. Use when building any web UI, reviewing markup quality, or optimising for search and accessibility.

54 Updated yesterday
dembrandt