http://wiki.mpsdigitalphoto.com/index.php?action=history&feed=atom&title=Class%3ADigital_Portfolio_2016%2FWeek_4 2026-06-19T10:32:27Z Revision history for this page on the wiki MediaWiki 1.32.0 http://wiki.mpsdigitalphoto.com/index.php?title=Class:Digital_Portfolio_2016/Week_4&diff=329&oldid=prev 2016-06-14T06:57:58Z

<p>‎<span dir="auto"><span class="autocomment">Assignment</span></span></p> <table class="diff diff-contentalign-left" data-mw="interface"> <col class="diff-marker" /> <col class="diff-content" /> <col class="diff-marker" /> <col class="diff-content" /> <tr class="diff-title" lang="en"> <td colspan="2" style="background-color: #fff; color: #222; text-align: center;">← Older revision</td> <td colspan="2" style="background-color: #fff; color: #222; text-align: center;">Revision as of 06:57, 14 June 2016</td> </tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l81" >Line 81:</td> <td colspan="2" class="diff-lineno">Line 81:</td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Assignment ==</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Assignment ==</div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">For class on June 20th:</ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">* Review the [[Online:Site Building (CMS) Solutions|website platforms &amp; Content Management options]] page, explore and shop for templates that you like.</ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">* Start experimenting with the CMS solutions that you like.</ins></div></td></tr> </table>

Matthew http://wiki.mpsdigitalphoto.com/index.php?title=Class:Digital_Portfolio_2016/Week_4&diff=328&oldid=prev 2016-06-14T06:52:06Z

<p>‎<span dir="auto"><span class="autocomment">Video Notes</span></span></p> <table class="diff diff-contentalign-left" data-mw="interface"> <col class="diff-marker" /> <col class="diff-content" /> <col class="diff-marker" /> <col class="diff-content" /> <tr class="diff-title" lang="en"> <td colspan="2" style="background-color: #fff; color: #222; text-align: center;">← Older revision</td> <td colspan="2" style="background-color: #fff; color: #222; text-align: center;">Revision as of 06:52, 14 June 2016</td> </tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l60" >Line 60:</td> <td colspan="2" class="diff-lineno">Line 60:</td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Video Notes ==</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Video Notes ==</div></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr> <tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>=== Section A ===</div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20160613_MPS_DP_01_WebFontsForPhotoPortfolios.mp4 Web Fonts 101]</ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20160613_MPS_DP_02_IndexhibitLocalInstall.mp4 Indexhibit local install and CMS overview]</ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20160613_MPS_DP_03_CargoCollectiveForPhotoPortfolios.mp4 Cargo Collective for photo portfolios 101]</ins></div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> </div></td></tr> <tr><td colspan="2"> </td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins class="diffchange diffchange-inline">&lt;!-- </ins>=== Section A ===</div></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_01_SizeOfTheWeb.mp4 The Size of the Web]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_01_SizeOfTheWeb.mp4 The Size of the Web]</div></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_02_ImageCompression.mp4 Image Compression &amp; Save for Web]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_02_ImageCompression.mp4 Image Compression &amp; Save for Web]</div></td></tr> <tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l70" >Line 70:</td> <td colspan="2" class="diff-lineno">Line 74:</td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_02_ImageCompression.mp4 Image Compression &amp; Save for Web]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_02_ImageCompression.mp4 Image Compression &amp; Save for Web]</div></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_03_BridgeAndMetadata.mp4 Using Bridge &amp; Adding Metadata]</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_03_BridgeAndMetadata.mp4 Using Bridge &amp; Adding Metadata]</div></td></tr> <tr><td class='diff-marker'>−</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_04_WebFonts.mp4 Web Fonts 101]</div></td><td class='diff-marker'>+</td><td style="color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div>* [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_04_WebFonts.mp4 Web Fonts 101] <ins class="diffchange diffchange-inline">--&gt;</ins></div></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"></td></tr> <tr><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Files ==</div></td><td class='diff-marker'> </td><td style="background-color: #f8f9fa; color: #222; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>== Files ==</div></td></tr> </table>

Matthew http://wiki.mpsdigitalphoto.com/index.php?title=Class:Digital_Portfolio_2016/Week_4&diff=327&oldid=prev 2016-06-13T03:37:23Z

<p>Created page with &quot;== Last Week == * Review Last Week * Talk about the responsive web stuff that we did not look at last week * The &quot;size&quot; of the internet * Tools: Text Editors * HTML / CSS Rev...&quot;</p> <p><b>New page</b></p><div>== Last Week ==<br /> <br /> * Review Last Week<br /> * Talk about the responsive web stuff that we did not look at last week<br /> * The &quot;size&quot; of the internet<br /> * Tools: Text Editors<br /> * HTML / CSS Review<br /> <br /> == This Week ==<br /> <br /> * Prepping Images for the Web<br /> <br /> == Open Questions ==<br /> <br /> == Notes ==<br /> <br /> === The &quot;size&quot; of the web ===<br /> <br /> ==== Image Sizes Today ====<br /> ; Small - 800px wide<br /> ; Medium - 1200px - 1600px wide<br /> ; Large - 1800px wide and up<br /> <br /> * [http://sebastien-gabriel.com/designers-guide-to-dpi/ Screen Designers Guide to DPI]<br /> * [http://alistapart.com/article/responsive-images-in-practice A List Apart: Responsive Images in Practice]<br /> <br /> === Optimizing Images for The Web ===<br /> <br /> We covered many aspects/techniques related to optimizing your images for the web.<br /> * [http://en.wikipedia.org/wiki/Image_file_formats Image Format Reference]<br /> * I also showed the excellent tool [http://imageoptim.com Imageoptim] for further compressing your images<br /> <br /> === CSS3 Web Fonts ===<br /> <br /> We discussed pretty much everything you need to know about CSS web fonts.<br /> <br /> '''Reading/refresher materials'''<br /> * [http://alistapart.com/article/fonts-at-the-crossing Web Fonts at the Crossing]<br /> * [http://www.html5rocks.com/en/tutorials/webfonts/quick/ Quick guide to webfonts via @font-face]<br /> <br /> ==== Web Font Purchase (download options) ====<br /> <br /> * [http://www.google.com/fonts/ Google Fonts]<br /> * [http://www.fontsquirrel.com fontsquirrel.com]<br /> <br /> ==== Web Font Services (subscription-based) ====<br /> <br /> * [http://typekit.com typekit]<br /> * [http://www.fonts.com fonts.com]<br /> <br /> TypeKit is now owned by adobe and the $50 membership is a free part of your [https://creative.adobe.com Creative Cloud Membership].<br /> <br /> ==== Some Design/Type Inspiration ====<br /> <br /> * [http://www.typography.com Hoefler &amp; Frere-Jones]<br /> * [http://www.houseind.com/fonts/ House Industries]<br /> * [http://losttype.com/browse/ Lost Type] Super awesome, super cheap, might be able to convert to web fonts.<br /> * [http://hellohappy.org/beautiful-web-type/ Beautiful (Google) Web Type]<br /> <br /> == Video Notes ==<br /> <br /> === Section A ===<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_01_SizeOfTheWeb.mp4 The Size of the Web]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_02_ImageCompression.mp4 Image Compression &amp; Save for Web]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_03_ImageOptimum.mp4 Quick ImageOptimum Overview]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150527_MPS_DPB_04_WebFonts.mp4 Web Fonts 101]<br /> <br /> === Section B ===<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_01_SizeOfTheWe.mp4 The Size of the Web]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_02_ImageCompression.mp4 Image Compression &amp; Save for Web]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_03_BridgeAndMetadata.mp4 Using Bridge &amp; Adding Metadata]<br /> * [http://assets.choppingblock.com.s3.amazonaws.com/video/screencast/20150601_MPS_DPA_04_WebFonts.mp4 Web Fonts 101]<br /> <br /> == Files ==<br /> <br /> <br /> <br /> == Assignment ==</div>

Matthew