图片拼贴 (Collage)
使用图片拼贴可以将多张图片组合为一个美观的拼贴构图。你可以从多种布局中进行选择，并通过拖拽来调整图片显示区域，设置图片间距与整体高度，快速获得专业感的视觉效果。
本教程目标
- 了解图片拼贴的适用场景与优势
- 学习在编辑器中选择布局、添加图片并拖拽定位
- 掌握间距与高度设置，保存与预览拼贴内容
第一次使用课灵？
请先注册并登录课灵账号(可以使用微信登录)，在工作区点击"创建"，并选择『图片拼贴 (Collage)』开始创作。
何时使用图片拼贴
- 需要在一屏内并列展示多张图片，形成主题合集或作品集
- 作为课程或文章的视觉封面，提升版面美感与信息承载
教程示例
下面是一个示例位置用于嵌入图片拼贴内容。你可以将其替换为真实的拼贴示例。
图片拼贴示例
快速复制示例
- 点击 这里➜ 将示例复制到你的课灵工作区
- 在打开的页面点击“复制” (注意：请确保已登录课灵账号，否则无法复制)
- 随后在生成的副本中点击“编辑”
- 即可查看并操作本教程所示的设置。
创建图片拼贴：分步指南
步骤 1：创建内容并选择布局
- 在课灵工作区点击「创建」，进入 H5P 编辑器
- 在内容类型列表中选择 『『图片拼贴』 或搜索
Collage - 进入编辑界面开始配置
从 H5P 内容类型列表中选择『图片拼贴』
步骤 2：选择布局
- 打开编辑器后，首先在顶部选择一个 布局。默认通常为三图布局，如果你需要使用四张或更多图片，请选择相应的布局方案。
- 常见布局包含 3 图、4 图等组合，可满足封面或作品集等不同展示需求。
选择4图拼贴布局
步骤 3：添加图片并拖拽定位
- 在布局的每个占位区域点击 『＋』 以添加图片，从本地上传所需图片文件。
- 添加后，点按住图片并 拖拽 (Drag) 以调整显示区域；你可以通过拖动实现 平移/微调 (Pan)，确保重要部分在可视范围内。
- 对每个区域重复以上操作，直到完成所有图片的添加与定位。
点击+添加图片到拼贴布局
拖拽图片到合适位置
步骤 4：添加替代文字
- 为每个图片添加替代文字（ALT 文本），这是图片的文字描述，对屏幕阅读器用户或无法显示图片的用户非常重要。
- 点按图片上的元数据设置图标，在弹出的对话框中输入描述性文字。
为图片添加替代文字
步骤 5：设置间距与高度
- 在编辑器底部找到 间距 与 高度 设置：
- 图片间距：用于调整图片之间的内外框间隔，控制留白效果；
- 内容高度：用于设定拼贴整体的展示高度。
- 适当调整这些选项，实时预览视觉效果，达到理想的排版。
调整间距与高度
步骤 6：保存并预览
- 完成布局与设置后，点击 『保存并关闭』。您现在应该有一个与本教程顶部示例类似的结果。
- 在预览页面查看最终拼贴效果。如需优化，返回编辑器继续微调图片位置与间距高度。
专家提示：用例灵感与相关内容类型推荐
想拓展『图片拼贴（Collage）』的使用场景？以下灵感与制作建议可供参考：
- 课程/文章封面：用主题拼贴快速呈现核心视觉与要点，引导读者进入章节
- 作品集与案例墙：并列展示学生作业、项目成果或设计稿，形成一屏总览
- 活动精选与精彩瞬间：课堂/培训/发布会的精彩照片集中呈现，适合回顾与汇报
- 主题素材盘点：同类图片的集合（动植物、地标、设备部件），支持课堂讲解与自学
- 研究与比对样例：同类样品在不同条件下的拍摄集合，用于讨论差异与结论
制作优化建议：
- 统一构图与长宽比，尽量保证主体在可视范围内，避免重要信息被裁切
- 为每张图片添加替代文本（ALT），确保可访问性与语义清晰
- 控制图片数量与间距，高密度拼贴建议适当增大高度，避免拥挤与认知负担
- 进行必要的压缩（JPG/压缩 PNG/WebP），提高加载速度与课堂展示稳定性
- 保持风格一致性（色调、边框、留白），提升整体观感与可读性
如何根据目标选择更合适的内容类型
- 多图并列同时展示：首选『图片拼贴（Collage）』，形成作品墙或海报式集合。
- 多图线性浏览（不强调同位对齐）：使用『图像滑块（Image Slider）』以节省页面空间。
- 两图强对比（前后/旧新）：选择『图像并置（Image Juxtaposition）』在同一画面直接对比两张图片。
- 阶段变化/分步揭示（强调同一位置随时间或层级变化）：参考『图像混合（Agamotto）』。
- 单图局部信息标注：使用『图像热点（Image Hotspots）』添加可点击说明点。
- 并行主题分区与文本组织：若需并列展示同层级文字/媒体，考虑『标签页（Tabs）』或『手风琴（Accordion）』。
- 讲解 + 评测整合：当需要形成“讲解—练习—反馈”的课程流，选用『课程演示（Course Presentation）』或『互动书（Interactive Book）』。
- 时间事件叙事：若目标是按时间线讲故事，使用『时间轴（Timeline）』。
- 课程收尾与要点巩固：在章节末使用『摘要（Summary）』快速复盘。