前端

前端的定义

前端是指与用户直接交互的部分，也称为客户端。前端开发涉及创建和维护网页、移动应用程序或其他用户界面的技术和工作流程。

前端工程师是使用web技术栈解决多端图形用户界面交互问题的工程师。

前端基础技术栈

1. HTML（超文本标记语言）：用于定义网页的结构和内容。
2. CSS（层叠样式表）：用于样式化网页的外观和布局。
3. JavaScript：用于实现网页的交互和动态功能。

前端应该关注的问题

1. 产品的功能以及所能解决的问题。
2. 产品界面的美观程度。
3. 产品是否能被所有人无障碍使用（如色盲症人群是否可用）。
4. 产品是否能保证用户数据的安全。
5. 产品的性能是否足够好。
6. 产品的兼容性是否足够好。

HTML

HTML 简介

HTML 的全称为 HyperText Markup Language，是一种用于创建网页结构和内容的标记语言。

HTML 语法

1. 标签和属性不区分大小写，推荐小写。
2. 空标签可以不闭合，比如 input、meta。
3. 属性值推荐用双引号包裹。
4. 某些属性值可以省略，比如 required、readonly。

HTML 语义化

HTML 语义化是指在编写 HTML 代码时，使用恰当的标签和属性来描述页面的结构和内容，以便于开发者和搜索引擎理解和解析页面。通过使用语义化的HTML，可以提高网页的可访问性、可维护性和可扩展性。

HTML 语义化的准则和实践

1. 使用恰当的标签：选择合适的HTML标签来描述页面的结构和内容。例如，使用 <header> 标签表示页面的页眉，<nav> 标签表示导航栏，<article> 标签表示独立的文章内容等。
2. 避免滥用 <div> 标签：<div> 标签是一个通用的容器，但滥用它会导致HTML代码缺乏语义化。尽量使用更具语义的标签来替代 <div>，例如 <section>、<aside>、<main> 等。
3. 使用合适的属性：为标签添加合适的属性来提供更多的语义信息。例如，使用 <img> 标签的alt属性来描述图像的内容，使用 <a> 标签的href属性来指定链接的目标。
4. 嵌套标签正确：确保标签的嵌套关系正确，符合页面的逻辑结构。避免出现不正确的嵌套，这可能导致页面解析错误或样式渲染问题。
5. 使用有意义的文本内容：在标签中使用有意义的文本内容，而不仅仅是为了样式或布局目的。这有助于提高页面的可读性和可访问性。
6. 提供适当的标题：使用 <h1> 到 <h6> 标签来表示标题的层级结构，确保标题的顺序正确，并且每个页面只有一个 <h1> 标签。
7. 考虑可访问性：使用语义化的 HTML 可以提高网页的可访问性，使屏幕阅读器等辅助技术能够正确解读和呈现页面内容。