将您的设计稿做成 HTML 和 CSS：根据截图或效果图制作页面，含手机版

成果示例

标准版套餐示例展开全文

按设计稿制作的牙科诊所首页

处理前：客户发来的设计稿

处理后：可以正常使用的页面

文件： 一个 ZIP 压缩包，内含 index.html、样式文件和 2 张页面图片，可直接上传到客户的服务器。此处展示的是页面截图。

客户： Bright Smile Dental 牙科诊所。 任务： 将首页设计稿做成可以正常使用的 HTML 页面，保持相同的布局、配色和文字，并加入点击即可致电诊所的预约按钮。

客户及所有信息均为虚构。

服务介绍

您已有设计稿，需要把它变成能用的页面。上传您在 Figma、Photoshop、Canva 或其他工具中制作的效果图的截图或 PNG 导出图，我们用 HTML 和 CSS 将其实现：同样的板块、同样的顺序，同样的布局、配色和外观，文字是真实文本而不是文字图片。页面为响应式：如果您的设计稿只有电脑版，我们会据此制作带手机菜单的手机版。效果图中的照片和插图会按同样的感觉重新绘制，如果您单独上传了自己的图片，则使用您的图片。您将收到一个包含页面、样式文件和图片的压缩包，可直接用于您的主机，另有订单页面上每个页面的预览。我们无法直接打开 Figma、PSD、Sketch 或 XD 文件：请将界面导出为图片。动画、后端、网店或 CMS 不在本服务范围内。

服务内容

• 您将收到一个 ZIP 压缩包，内含页面、样式文件和图片，可直接上传到您的主机，另有订单页面上每个页面的预览。
• 贴近您的设计板块、布局、配色和字体与效果图一致
• 手机版没有手机版设计时，根据电脑版设计制作
• 真实文本标题和段落为搜索引擎可读取的 HTML
• 图片各就其位按效果图的感觉重新绘制，或使用您的图片
• 代码简洁纯 HTML 和 CSS，不用框架，不从其他网站加载任何内容

服务流程

1. 1
   上传您上传设计稿的界面，并说明各处放什么
2. 2
   制作我们制作页面并绘制图片
3. 3
   预览您在电脑和手机上与设计稿对比
4. 4
   压缩包您下载压缩包，并在套餐范围内提出修改

需要您提供的信息

最多 5 张 PNG、JPEG 或 WebP 图片：您设计稿的界面，每张一个页面或一个长界面，清晰到能看清文字；如有需要，也可附上原样使用的标志和照片。请说明哪个文件对应哪个页面，如文案与效果图不同请提供文案，并附上联系方式和链接。不接受 Figma、PSD、Sketch 或 XD 文件：请将界面导出为图片。

我们会询问您：

• 哪个文件对应哪个页面？
• 文案是否与设计稿完全一致？
• 链接、联系方式和按钮
• 设计稿是您自己的吗？

套餐对比

问题与解答

没有找到答案？ 向我们提问