Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

docs(readme): fixed readme images to link to local assets #6116

Merged
merged 5 commits into from
Sep 27, 2018
Merged

docs(readme): fixed readme images to link to local assets #6116

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
2c95336
Fixed footer logo, made example audit have max width 500px.
exterkamp Sep 26, 2018
e7997b3
Replaced dev tools integration image.
exterkamp Sep 26, 2018
c06ef6c
Changed to absolute paths for NPM.
exterkamp Sep 26, 2018
00d324c
Adjusted links to match possible best practice, e.g. pointing to HEAD…
exterkamp Sep 27, 2018
6cd274b
Added absolute URLs to readme images. Added explanation to CONTRIBUT…
exterkamp Sep 27, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions CONTRIBUTING.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,15 @@ If you have a contribution for our [documentation](https://developers.google.com
1. Ensure that your code adheres to the existing style in the sample to which you are contributing.
1. Submit a pull request.

## Adding Images to a Readme

If you are adding an image to a readme use the absolute path to the image for the specific commit hash where the image was introduced. This requires mutliple commits.
1. Make the commit to introduce the image.
1. Get the [absolute path](https://help.github.com/articles/getting-permanent-links-to-files/) to the image with the commit hash e.g. `https://raw.githubusercontent.com/GoogleChrome/lighthouse/e7997b3db01de3553d8cb208a40f3d4fd350195c/assets/example_dev_tools.png`
1. Add to readme as an absolute reference to that image.

If you are updating an image that already exists: commit it, then update the readme to point the image with that new commits hash absolute url.

## description guidelines

Keep the `description` of an audit as short as possible. When a reference doc for the audit exists on
Expand Down
Binary file added assets/example_dev_tools.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 4 additions & 5 deletions readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Lighthouse is integrated directly into the Chrome Developer Tools, under the "Au

**Run it**: open Chrome DevTools, select the Audits panel, and hit "Run audits".

<img width="500px" alt="Lighthouse integration in Chrome DevTools" src="https://user-images.githubusercontent.com/2301202/40556658-4ef7d128-6002-11e8-903e-5224894a7cca.png">
<img src="https://raw.githubusercontent.com/GoogleChrome/lighthouse/e7997b3db01de3553d8cb208a40f3d4fd350195c/assets/example_dev_tools.png" alt="Lighthouse integration in Chrome DevTools" width="500px">

## Using the Chrome extension

Expand Down Expand Up @@ -165,7 +165,7 @@ Lighthouse can produce a report as JSON or HTML.

HTML report:

![Lighthouse report](/assets/example_audit.png)
<img src="https://raw.githubusercontent.com/GoogleChrome/lighthouse/443ff2c8a297dfd2297dfaca86c4966a87c8574a/assets/example_audit.png" alt="Lighthouse example audit" width="500px">

### Online Viewer

Expand Down Expand Up @@ -332,10 +332,9 @@ We'd love help writing audits, fixing bugs, and making the tool more useful!
See [Contributing](./CONTRIBUTING.md) to get started.

---

<p align="center">
<img src="https://cloud.githubusercontent.com/assets/39191/22478294/23f662f6-e79e-11e6-8de3-ffd7be7bf628.png" alt="Lighthouse logo" height="150">
<img src="https://raw.githubusercontent.com/GoogleChrome/lighthouse/8b3d7f052b2e64dd857e741d7395647f487697e7/assets/lighthouse-logo.png" alt="Lighthouse logo" height="150">
<br>
<b>Lighthouse</b>, ˈlītˌhous (n): a <s>tower or other structure</s> tool containing a beacon light
to warn or guide <s>ships at sea</s> developers.
</p>
</p>