Video 1. Start By Writing H1 Tags We want to wrap our link in an h1 tag to let search engines know that the text in our link (which will be replaced by an image) is very important text. Drop an opening and closing h1 tag where you want the logo to appear. 2....
Video 1. Place The HTML And Text We must first place a few lines of text. I’m going to jump over to http://html-ipsum.com and grab three of the long paragraphs and just change the first word of each paragraph so there is a little variety. 2. Write The CSS3 There is a pseudo element...
Video 1. Download fancyBox The very first thing we must do is download fancyBox. If you are using this for a personal, non-commercial website it’s completely free, if not, a license is inexpensive, just $19 USD. 2. Unzip + Organize Once you download the file, unzip it and find a place on your hard...
1. Choosing The Background Image This may go without saying, but just to be thorough you want to make sure that your background image is probably at least 2000px wide or so. Bigger is better when dealing with web background images, just take care to optimize that image as much as you can. 2. CSS...
1. Get The Theme While Dreamweaver allows us to customize every little aspect of the code we write, creating the whole look can be quite time consuming and there is a whole bunch of trial-and-error. I’ve found an amazing Dreamweaver color theme which you can download for free right here: http://www.thatwebguyblog.com/post/a_dark_code_view_theme_for_dreamweaver/ You’re looking for the...
Written Tutorial Starts: 1. The Simple Hyperlink: It All Begins Here The most basic link is a link from one page of your website to another. This can be done in Dreawmeaver CS6 by highlighting the item you want to turn into a link (we’re going to use a word in our navigation bar)...
Written Tutorial Starts: 1. Site? Local Root? What? Dreamweaver provides you with a quick and easy way to organize your files within Dreamweaver and allow you to take advantage of Dreamweaver’s powerful website organizational tools, upload your website to a web server, auto maintain links when pages are moved around, as well as...
Create a Vertical Navigation Bar With CSS/HTML – Dreamweaver Tutorial Using Dreamweaver CS5 and CSS we will create and style a vertical navigation bar with images and rollover states!
Styling a Simple Form with CSS – Dreamweaver Tutorial We will go ahead and create a form and then style it using CSS. Learn how to hand code a simple form and then hand code all of the CSS code you need to create a nice little form. The beauty of this tutorial is that...
How To Style Tags With CSS – Dreamweaver Tutorial Learn all about styling tags and how to write CSS code in Dreamweaver. By the end of this tutorial you will have a good understanding of how to write CSS, how CSS works, and how you can write your CSS code in Dreamweaver.
Create a Spry Collapsible Panel – Dreamweaver CS4 Tutorial In this tutorial we will learn about a very cool widget in Dreamweaver CS4 that will allow you to create a very cool and easy to edit Collapsible Panel which basically allows a user to click and tab and a content box drops down below it...
Create CSS Rounded Corners – Dreamweaver Tutorial Hey guys! In this tutorial we will take a look at creating a fixed width, rounded corners text box using two simple images we create in Photoshop. You will learn a little about writing CSS code and working with images and CSS as well as some other cool...