Advantech Web Design Resources


Design Resources is an selections of guidelines, components, and templates that support the best practices of Advantech's website design. Backed by open-source code, and helps teams quickly build beautiful products.

Web Page Basic Design Guide

Webpage Design Checklist

Learn how to make your webpages look normal and standard

Get Start
Webpage Banner Templates

UI Kit

Use components by copying and pasting to build consistent user interfaces effortlessly.

Read More
eDM Template + mailChimp

Midjourney

Midjourney is a fast and convenient online AI image tool for colleagues to create work materials efficiently.

Read More
 

Design Resources

Standard- Corp. Site Webpage

Standard- Corp. Site Webpage

For webpage that include standard header and footer, please click to download the template, and guidline are also including.

Download
Basic - Corp. Site Webpage

Basic - Corp. Site Webpage

For webpage that ONLY include Advantech logo in the header, please click to download the template

Download
Solution Page Templates

Solution Design Guideline

The general guidelines for Solution page, please clcik to read more and download the templates to start

Read More
Webpage Banner Templates

PD Minisite Design Guideline

The general guidelines for PD Minisite, please clcik to read more and download the templates to start.

Read More
 

Design Guidelines

Corporate Colors & Typefaces

Corporate Colors & Typefaces

Check out the latest corporate colors and typefaces for on-screen and digital use.

Download
Product Image Guidelines

Product Image Guidelines

Provide specifications and guidelines for creating product images, as well as a PSD template for use.

Read More
CMS FAQ

CMS edit suggestion and FAQs

When you are building content area in the CMS generator platform. There have something you need to know.

Read More
Homepage Key Visual Guidelines

Homepage Key Visual Guidelines

Find out what are the design principles that define the brands identity images.

Read More
Solution Portal Key Visual Guidelines

Key Visual Guidelines

Help you to create image key visual or video key visual that presents our brands identity in consistency

Read More
Design Guideline for DUDA

Design Guideline for DUDA

Resources to help you start building the webpage

Read More
Heebo

Heeob, The New Typography

Learn how to use font-weight to improve text readability

Read More
Icons

Icons. Easy. Done.

Take the hassle out of icons in your website.

Read More
Colors

Colors

Color speaks volumes about a brand

Read More
Content Layouts

Content Layouts

Good Website Layout Ideas, the layout of your website can define its success

Read More
Pagination Guideline

Pagination Guideline

Documentation and examples for showing pagination.

Read More
Web Accessibility Standards

Web Accessibility Standards

Is your content's easily accessible and usable by all individuals?

Read More
Marketplace Design Guide

IoT Mart ATW

Learn how to create new web content on IoT Mart ATW.

Read More
 

Usability References

Web Accessibility

Web Accessibility

To better understand how to make Web Accessible

Read More
AB Testing

Video Key Visual Replace Picture Key Visual

Find out which KV would be more suitable for your webpage.

Read More
Image Optimization

Image Optimization

Use the information below to find the optimal settings for your images.

Read More