Today we will start with an in-class writing activity. Use this link to compose as I guide you. Your brainstorm text will be in this list.
I will then show you a second way to locate your comments on our web site.
Finally, we will go over aspects related to design of our portfolios. I will guide us as we experiment with these possibilities:
One thing to consider is how to signal your structure and guide navigation of users. You can use the <hr> tag to draw a break across the screen. You can also use visual dividers like this:
And you can use headers and other text styles to help signal the sections of the document.
You may also find it helpful to learn some more manipulation tricks for images. Once you add an image to the portfolio, if you look over its source code, you can adjust the size, alignment, and the space around the image, etc. Add codes like these:
style="float:left; width:128px; height:128px; padding:15px"
to an image tag so something like this donut can be made smaller and have text woven around it. This text is now wrapping on the side of the donut. You don't want to get too fancy because different screens will shift things some, but you can work with the flow of the materials in the document. When you want to stop text wrapping you can add codes like this: <div style="clear: both;"></div>
We end up with this code for the image: <img alt="donut" data-align="left" data-entity-type="file" data-entity-uuid="76b5020a-e3dc-40ae-985f-a06513e5d1e4" src="/makelit/sites/default/files/inline-images/domut.jpg" style="width:128px;height:128px;padding:15px />
Use your eye
There are many ways to draw attention to the points you want to make. Most of the adjustments will be conceptual, thinking through the flow of the materials and how to guide readers through your main points.
Here are the codes for the heading above:
<h3>Use your <span style="color: blue">e</span>y<span style="color: blue">e</span></h3>
Use your judgment, and you can create an aesthetically appealing portfolio that complements the points you want to make and showcases your projects.
For the rest of class and for homework, continue revising your materials and drafting your portfolio.