Web design is an art, its canvas varied among the myriad devices your audience may use. Your masterpiece expresses who you are, what drives you, what inspires passion in your heart—your spirit.
Conventional layouts are sometimes called for, but a little twist on the norm can be a sight for sore eyes.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam sed magna nec elit fermentum bibendum. Etiam volutpat tempor nunc, non scelerisque nisi blandit nec. Pellentesque ac mollis lectus. Suspendisse a sem quis ante laoreet rutrum vitae quis nisi. Ut posuere, elit non lacinia congue, massa diam scelerisque dui, vel hendrerit eros mi sed sapien.
Praesent sollicitudin auctor erat, in elementum augue ultricies non. Nam iaculis, sapien sit amet consequat interdum, tellus erat bibendum mauris, eget hendrerit felis velit vel ante. Morbi laoreet vitae ipsum ut semper. Vivamus ipsum ex, volutpat nec ultrices vitae, tincidunt a tellus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer dapibus felis sed augue facilisis, quis tincidunt eros blandit. Nulla maximus pretium lorem, in bibendum lacus condimentum sit amet. Maecenas nec enim imperdiet, mollis felis vitae, tincidunt lorem. Ut rhoncus sed elit id rutrum. Nam dictum ut elit ac pretium. Proin interdum erat velit, et congue nisl placerat a.
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus nisl odio, blandit quis lobortis a, venenatis vitae urna. Suspendisse interdum ligula eu tortor tempor, placerat pretium mauris lobortis. Donec pulvinar congue ante, ac sodales velit aliquet at. Nunc commodo sed libero sed aliquet. Maecenas sit amet diam dapibus, auctor dolor id, fringilla sapien. Suspendisse potenti. Aliquam vestibulum dui sit amet neque posuere, eu consectetur diam pulvinar. Fusce varius velit a eros lobortis fringilla.
Donec non ante a justo tincidunt efficitur sit amet quis mauris. Duis turpis ipsum, finibus at nibh nec, rutrum dignissim diam. Fusce arcu sapien, ultricies sed elit nec, sollicitudin auctor tortor. Aliquam in erat venenatis, facilisis arcu vitae, blandit libero. Cras laoreet nec elit sit amet blandit. Nulla laoreet commodo mauris eleifend rhoncus. Etiam felis sem, eleifend in libero quis, consectetur molestie diam. Suspendisse sed euismod dui.
Nulla facilisi. In interdum urna vel justo bibendum, eleifend semper risus tempus. Phasellus faucibus ut dolor vel scelerisque. Pellentesque pulvinar enim id tortor aliquam, a laoreet magna scelerisque. Phasellus sapien eros, porta a bibendum in, gravida sit amet eros. Nullam ex augue, sollicitudin ac tincidunt a, dignissim vel dolor. Duis sit amet risus quis ligula tempus iaculis vel at nisl. Proin justo leo, iaculis at varius eget, auctor vitae augue. Donec vehicula erat quis malesuada aliquam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec vehicula nulla erat, ac fermentum velit interdum ut. Aliquam at elit nec erat suscipit finibus. Mauris aliquam leo eu leo tristique semper. Nunc metus est, pellentesque in nisi eget, suscipit consectetur lorem. Nam nec rhoncus ante. Donec tristique imperdiet ullamcorper.
We used two interesting techniques in this particular column. The first involves setting a fixed background image. Since background-attachment fixed sets the background image as a child of the body, only binding it to the the vertical boundaries of its parent element, we crafted a special image that is 1920 pixels wide and 1080 pixels tall, with the parts we want to display pinned to the right edge of the image. Then we set a color mask by using multiple background-image syntax: a linear gradient followed by a JPG. The linear gradient is set in RGBA colors. The result is a semi-transparent mask. Here is the syntax:
background: linear-gradient(rgba(120,120,120,0.98), rgba(120,120,120,0.30)), url(p7Zeitgeist/img/face.jpg);
The second technique we used is applied to the hmy-content DIV, which is set to position: sticky with a top position of 80 pixels so that it clears the fixed header. As you scroll the page, this column's text remains inside the viewport for as long as possible.
Contemplation
The ultimate value of life depends upon awareness and the power of contemplation rather than upon mere survival - Aristotle
Whimsy
We shouldn't be afraid to embrace whimsy, that nagging idea that life could be magical; it could be special if we were only willing to take a few risks - Donald Miller
Vision
Vision without action is merely a dream. Action without vision just passes the time. Vision with action can change the world - Joel A. Barker
Noun. Lack of equality or equivalence between parts or aspects of something; lack of symmetry.
"There was an asymmetry between the last column and the ones before it. But it looks right."
May the spirit be with you
1313 Mockingbird Lane · Muensterville, OH
V 440 555-1212
V 440 555-1111
© 2019 Zeitgeist Concepts, LLC
All Rights Reserved