Upload
sofiagmontreal
View
96
Download
0
Tags:
Embed Size (px)
DESCRIPTION
The 6th and last slideshow from the Web Design Basics course.
Citation preview
WEB DESIGN BASICS
01:36 AM 4
Jump to Top
Write your post;
Switch to the Text Editor;
Add <a id="top"></a> at the beginning of the post;
Add <a href="#top">top</a> at the end of the post.
01:36 AM 5
Variations
Variation in <a href="#top">top</a> will change the name under which your
page jump link will be displayed.
<a href="#top”>Top of the Page</a><a href="#top">Jump to Top</a><a href="#top”>Go Up</a>
01:36 AM 6
Now lets complicate things a bit…
Take a typical Wikipedia page:
Montreal
01:36 AM 7
So how do we do that?
01:36 AM 8
Let’s start by creating a sample page or postContents: Introduction Arguments Conclusion
IntroductionLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
ArgumentsLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
ConclusionLorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
01:36 AM 9
Make sure to chose an element for your headings/titles!
01:36 AM 10
This is what your post/page text should look like in the Text Editor:
Contents:<ol>
<li>Introduction</li><li>Arguments</li><li>Conclusion</li>
</ol><h2>Introduction</h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean
commodo ligula eget dolor. Aenean massa.<h2>Arguments</h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean
commodo ligula eget dolor. Aenean massa.<h2>Conclusion</h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean
commodo ligula eget dolor. Aenean massa.
01:36 AM 11
Let’s now modify the elements IDs:
<h2>Introduction</h2> becomes <h2 id="introduction">Introduction</h2>
<h2>Arguments</h2> <h2 id="arguments">Arguments</h2>
<h2>Conclusion</h2> <h2 id="conclusion">Conclusion</h2>
01:36 AM 12
Lastly, link the element IDs to the Content list
01:36 AM 13
Jumping to another page<a
href="http://startingmyownwebpage.wordpress.com/">Go to Home</a>
Broken down:
<a href="address of your page">Display Name of Your Link</a>
01:36 AM 14
The More Tag Command
<!--more-->
01:36 AM 15
Read More
<!--more-->
<!--more But wait, there's more!--><!--more Read More-->
<!--more See Full Post-->
01:36 AM 16
A few Examples
http://startingmyownwebpage.wordpress.com
01:36 AM 18
Themes that support Excerpts
Blix Fauna Flower Power Hemingway Steira Supposedly Clean Sweet Blossoms
01:36 AM 19
Next Page
<!--nextpage-->
Example
01:36 AM 21
Directories
See also: 20 Free Places to Promote Your Website Online
01:36 AM 22
Search Engine Optimization
Include any keywords that people might use to the search for your site in the content you post, especially first paragraphs and headers.
Use the Alternate Text space to describe relevant content using keywords.
Keep the site updated.
01:36 AM 23
Publicize Your Site
E-Signatures, business cards, letterheads
Take advantage of social bookmarking sites, such as Del.icio.us, StumbleUpon, Digg, Reddit, and Pinterest
Take advantage of social media sites, such as Facebook, Twitter, Flickr, LinkedIn, YouTube, Google+
01:36 AM 24
More…
5 Ways to Promote Your Website