css

Alison.com — Diploma in Web Design Achieved!

Posted on Updated on

On October 27th, 2014 I completed the Diploma in Web Design provided by Alison.com

Alison_CoursewareIntro_256

Alison.com — Diploma in Web Design Achieved!

This coursework was completed over several weeks. This course goes beyond knowing how to create a HTML page and add content, title, entities, anchor tags, encompassing inserting images, present tags, links, tables, lists and uploading web pages. Coursework included a strong understanding and demonstration of the meaning of inheritance, cascade, pseudoclasses, pseudoelements and selectors … the concepts that are commonly used in web pages.

This required the demonstrated familiarity with using font, background styles and style sheets. This course help you to use Dreamweaver to create a website with HTML, CSS, JavaScript, and Flash. It requires the understanding of naming conventions, index files, welcome screens, landing pages, GUI and many more settings that are extremely useful when creating a website successfully. This course also required an understanding of advanced features such as CSS structures, embedded style sheets and much more. Final requirements demand a knowledge of how a web page works as well as a deep knowledge of hosting, domain names and nameservers.

This coursework was originally based on Russell Stannard’s teaching and research experience – and the feedback of his many thousands of students.

GDA Lecture: Responsive Web Design, a Hands-on Approach

Posted on Updated on

On Wednesday, February 13th, Tyler Dockery gave an hour-long discussion and hands-on training on responsive web design to the FDA.
Learn about responsive web design with Tyler Dockery

GDA Lecture: Responsive Web Design, a Hands-on Approach

The talk outlined the basics of responsive design, how it differed from adaptive design, and was concluded with a hands-on demonstration in which students could create their own responsive page from a template [ code provided below ].

The Mac Lab was filled and several students remained without computers to discuss the materials and observe the lecture. Q&A after the session covered numerous topics, such as how to use media calls in CSS to reconfigure your responsive pages, and how to organize your content for mobile devices.

He provided two files for the discussion:

First, a word document outlining the basics of responsive design, and giving some great links to websites which students can use to learn more of responsive design basics. The DocX can be downloaded below:

Responsive Discussion Document

Second, a Dreamweaver file with a basic website already coded. Additional CSS has been added BELOW the HTML which will make the page adapt if the screen size becomes 600px or smaller. Cut the commented CSS and add it within the bottom of the <style> tag.

 As this version of wordpress will NOT allow .html files to be uploaded, AND .zip files with .html files insider are also banned, the entire source code will be posted below for those interested.


<html><head><title>Responsive</title>
<style>
body {
background-color:grey;
width: 1024px;
}
.container {
width: 93.75%; /* 960 / 1024 = 93.75% */
height:auto;
margin: 0px auto;
background-color: white;
}
.head {
width: 100%; /* 100% */
height:80px;
background-color: lightgray;
}
.nav {
width: 31.25%; /* 300 / 960 = 31.25% */
height: auto;
float: left;
}
.nav a {
display:block;
}
.content {
width: 66.66666667%; /* 640 / 960 = 66.6666666666667% */
margin-left: 10px;
margin-right:10px;
background-color: lightblue;
height:auto%;
float:right;
}
.footer {
width: 100%; /* 100% */
background-color: pink;
height:80px;
clear: both;
}/* Media Screens Below */</style>
</head><body>
<div class=”container”>
<div class=”head”></div>
<div class=”nav”>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
<a href=”#”>Link</a>
</div>
<div class=”content”>Whole biggity-bunch of content</div>
<div class=”footer”></div>
</div><!–@media (max-width:600px) {
.nav, .content {
float: none;
width: 100%;
Height: auto;
clear:both;
margin: none;
}
.nav a {
float: left;
margin-right: 10px;
display: inline;
}}
–>
</body></html>

If you’re interested in learning more about Responsive Web Design, please feel free to come and visit with me in my office, 321C in the ETB building. If you enjoyed this or any presentations, please let us know and let us know what you’d like us to present on in the future!

CSS3 Certification Acheived!

Posted on Updated on

CSS3 certification is one of three certifications I a working on at this time… and it will be the last time I do this again- its just too much work to study for so many and still pass! I have been using CSS in my web design since the year 2000, and I must say that I see some great potential for typography on the web with this newer version. Shadows, rounded corners, I think this stuff is gonna be great! So now, when will IE step up to the plate and allow it to REALLY WORK?? Testing 3 examinations in one day… whew! BrainBench, what was I thinking?

css3

HTML5 Certification Achieved!

Posted on Updated on

I learned HTML initially in East Carolina University (ECU) and University of North Carolina at Greensboro (UNCG), emerging in 1994 with a minor smattering of understanding. In 2000, I took classes at the University of Georgia (UGA) to get HTML and CSS firmly under my belt. HTML5 is a new and emerging standard for web designer. Since I teach a little of this, my HTML5 learning has all been self-taught. Getting this certification is a reflection of study and understanding of the newest upgrade to HTML. So, I determined to get my certifications with BrainBench

html5