jekyll webp 다운로드 - jekyll webp 소스코드 다운로드

jekyll webp

기타 카테고리

1.0.0

다운로드

Jekyll용 WebP 생성기

Jekyll 사이트용 WebP 이미지 생성기는 정적 사이트의 모든 이미지에 대한 WebP 이미지를 자동으로 생성하고 가능할 때 이를 제공할 수 있습니다. rubygems.org에서 확인하세요.

내 블로그(blog.sverrirs.com)에서 이 도구에 대해 자세히 알아보세요.

설치

 gem install jekyll-webp

릴리스에는 WebP 재배포 가능 실행 파일을 포함하여 실행하는 데 필요한 모든 파일이 포함되어 있습니다.

현재 릴리스에는 Windows, Linux 및 Mac OS X 10.9(Mountain Lion)용 WebP 유틸리티 v0.6.1 버전이 포함되어 있습니다. 다른 버전과 릴리스는 Google 페이지에서 직접 다운로드할 수 있습니다.

Gemfile 과 Jekyll의 _config.yml 에 gem을 추가한 후 jekyll serve 다시 실행하면 사이트 생성 중에 생성기가 실행되는 것을 볼 수 있습니다.

구성

webp 구성 요소를 포함하여 사이트의 _config.yml 파일에서 플러그인을 구성할 수 있습니다.

 # ###########################################################
# Site configuration for the WebP Generator Plugin
# The values here represent the defaults if nothing is set
webp :
  enabled : true
  
  # The quality of the webp conversion 0 to 100 (where 100 is least lossy)
  quality : 75

  # List of directories containing images to optimize, nested directories will only be checked if `nested` is true
  # By default the generator will search for a folder called `/img` under the site root and process all jpg, png and tiff image files found there.
  img_dir : ["/img"]

  # Whether to search in nested directories or not
  nested : false

  # add ".gif" to the format list to generate webp for animated gifs as well
  formats : [".jpeg", ".jpg", ".png", ".tiff"]

  # File extensions for animated gif files 
  gifs : [".gif"]

  # Set to true to always regenerate existing webp files
  regenerate : false

  # Local path to the WebP utilities to use (relative or absolute)
  # Omit or leave as nil to use the utilities shipped with the gem, override only to use your local install
  # Eg : "/usr/local/bin/cwebp"
  webp_path : nil

  # List of files or directories to exclude
  # e.g. custom or hand generated webp conversion files
  exclude : []

  # append '.webp' to filename after original extension rather than replacing it.
  # Default transforms `image.png` to `image.webp`, while changing to true transforms `image.png` to `image.png.webp`
  append_ext : false
# ###########################################################

가장 간단한 사용법: HTML

웹서버를 제어할 수 없는 경우 <picture> 요소를 사용하고 사용 가능한 모든 이미지 형식을 지정하는 것이 최선의 선택입니다. 이런 방식으로 브라우저는 자체 기능에 따라 사용할 형식을 결정합니다.

 < picture >
  < source srcset =" /path/to/image.webp " type =" image/webp " >
  < img src =" /path/to/image.jpg " alt ="" >
</ picture >

고급 사용: 웹서버 구성

가능하다면 새 .webp 파일을 해당 형식을 지원하는 클라이언트에 제공하도록 웹 서버를 구성하는 것이 아마도 문제가 가장 적은 접근 방식일 것입니다. 이렇게 하면 클라이언트가 WebP 이미지를 지원할 때 웹 서버가 자동으로 WebP 이미지를 제공하므로 HTML 파일을 변경할 필요가 없습니다.

다음은 Apache 웹 서버의 .htaccess 구성 섹션에 대한 예입니다. 가능할 때마다 사용자를 webp 이미지로 리디렉션합니다.

 ####################
# Attempt to redirect images to WebP if one exists 
# and the client supports the file format
####################
# check if browser accepts webp
RewriteCond %{HTTP_ACCEPT} image/webp 

# check if file is jpg or png
RewriteCond %{REQUEST_FILENAME} (.*).(jpe?g|png)$

# check if corresponding webp file exists image.png -> image.webp
RewriteCond %1.webp -f

# serve up webp instead
RewriteRule (.+).(jpe?g|png)$ $1.webp [T=image/webp,E=accept:1]

AddType image/webp .webp