添加图片

Images are an important part of your website. Using images effectively on your site can drive engagement and improve the user experience.

接受的图像格式

  • JPG
  • JPEG
  • PNG
  • GIF

推荐的图像大小(像素)

  • Wide with featured image: 2200 x 500
  • Standard featured image: 850 x 350
  • Three column featured image: 550 x 350

Adding an Image in Your Editable Region插入/编辑图像的截图.

  1. Select the insert/edit image icon or right click and select insert/edit image.
    插入/编辑图像图标
  2. Click the browse out icon to the right of the Source field.
  3. Choose the image or upload a new image. The image will be assigned a dependency tag. Make sure you have the rights to use the image. Do not grab something from the internet 这可能是有版权的.
  4. 添加可选描述. The alternative description is for a screen reader to read to our visually impaired audience. It also shows when an image doesn't load 在一页上.
  5. You can click on the Advanced section to align the image left, right, or centered to position it alongside the content on the page.
  6. Click the ok button, and the image will appear where you placed your cursor.

How to Video - Adding an Image in Your Editable Region

添加特色图片

  1. Make sure the page is checked out or the lightbulb is turned on.
  2. Click the properties button at the top of the page.
  3. Go to the featured image field and make sure to check the box next to Show Featured Image.
  4. Click the choose file icon at the end of the featured image field.
  5. In the top right next to the upload button, toggle from production to staging.
  6. Click the blue upload button, and upload your image. Make sure you have the rights to use the image. Do not grab something from the internet 这可能是有版权的.
  7. Once uploaded, toggle back to production and upload the exact same image to production. Choose the file, and you will see the dependency tag assigned.
  8. 添加可选描述. The alternative description is for a screen reader to read to our visually impaired audience. It also shows when an image doesn't load 在一页上. 请确保 
  9. Click the save button at the top of the page.

Screenshot of adding a featured image.

How to Video - 添加特色图片

Tips for Writing Alternative Descriptions

  • When adding the alternative description (alt text), think of it like you are describing the image to someone over the phone. They can't see it so what would you say about it?
  • Any text over the image must be in the alt text because a person using a screen reader has no other way to get this information. 避免在图片上使用文字.
  • Don't include "image of" or "photo of" in your alt text.
  • Good alt text can give search engines more information to rank your website with. 使用关键词.
  • You do not need text in the title field.
  • 避免使用图片作为链接. If you do need to link an image, the alt text should 而不是描述图像. The alt text should convey the location and purpose of the link. 

Example:

USA students filming an interview in communication class on campus.

Okay 所有文字:学生拍摄

Better alt text: USA journalism students filming an interview on campus.