Dear Everyone,
Are there any technie/web designers here? Can you tell me how the following site was created?:
And how do I learn to make a similar version? I particularly am intrigued with the hover feature. When a Unit is selected, and you click on “word help > show example” you can hover the mouse over one of the Arabic words and it gives you the English translation. I have seen this hover feature on other sites and it is very useful from many aspects.
Thanks.
Ayesha 
I think Lappy will be able to help you on Monday.
In this case, Flash…
You can also do more or less the same thing using javascript and/or CSS, and that’s probably what you see on other sites.
KL’s right Ayesha - it’s a flash site (you can tell by right-clicking on the content, and if it tells you something about Adobe Flash, then it’s a flash page.)
And it’s also true that you can use Javascript or Ajax to do (more or less) the same thing. There are many free javascripts there, depending on what you want to do, and all you need is to take the code, plug the script into your script folder, and the page will implement the script for you.
Dear KL & Lappy,
Thank you - although I got lost in Lappy’s explanation. :blink: I will search for a software developer/web designer to help bring my ideas to life. :rolleyes:
I reorganized this content below
I reorganized this content below
Dear Twinergy & JudyMendes,
Thank you for the headaches. :wacko: It is too much for me! :nowink:
I will come back to this when my head stops spinning!
Sorry Ayesha,
I didn’t mean to make your head spin. I just got in too much of a hurry & gave you too many details without giving you the big picture first. Let me zoom out.
Options for getting your website built
Dear Twinergy - Great explanation !
thanks for the links karma to you !
Gloria
Sounds like you know your stuff Twinergy!
Karma coming your way
Since other people interested in this I’m going to reorganize my previous posts
Options for getting your website built
1. Have somebody else build it
a. Pay a professional,
i. Ask to see portfolio, sample websites.
ii. Look for good design: easy to navigate, clean looking, reflect what you want
b. Find a student willing to work for free,
i. Beginners who want to build a portfolio or have a class project but don’t have content.
ii. They often look for non-profit not business content.
iii. You will need to be organized with your content up front,
they don’t want to get involved then have you drop the ball.
iv. They may want some control over the design since it may need to fit class criteria.
v. Could look at local college, or advertise on Craigslist.
2. Build it yourself
a. Type the source text yourself
i. This is easier than it sounds
(the average 3rd grader could do it but I doubt my Mom could)
there is a learning curve that takes time, gives you the most control.
It is a common misconception that you have to program to write a webpage,
but this is only needed for the fancy websites
ii. Overview of tools, learn in this order
1. HTML is used for content:
Using frames and tables are antiquated methods for web page layout,
CSS is the current standard. (Tables still have very specific uses however.)
2. CSS is used for design:
Here is a fun site demonstrating the relationship between HTML & CSS
http://www.csszengarden.com/
If you click the links you will see the exact same HTML with different CSS designs.
It is considered good design to compartmentalize the content & design like this.
3. Advanced tools like JavaScript & AJAX
used to make a page more interactive or dynamic,
this is where programming logic may come into play
iii. If you are looking for a good book to get started I like
http://www.amazon.com/Head-First-HTML-CSS-XHTML/dp/059610197X/ref=sr_1_1?ie=UTF8&s=books&qid=1239816360&sr=8-1
It has great example projects to work on.
It’s like taking a class in web design and may be a little time consuming
(600 pages but lots of pictures very visual),
very thorough and will teach you a lot of good habits from the start.
iv. If you just want to dive into a project there are many free tutorials on line.
It’s good to cross reference a few tutorials.
1. http://www.echoecho.com/
2. http://www.w3schools.com/
3. http://www.htmlgoodies.com/
4. http://www.pageresource.com/
this is good for all levels and includes simple instructions
and sample code so you don’t have to write everything from scratch
v. Notepad++ is a free program to write website code
http://notepad-plus.sourceforge.net/uk/site.htm
b. Use a visual program to “draw†the site, it will write the source for you
(this is WYSIWYG (wizzywig) what you see is what you get).
These are good if you are more visually oriented,
its normally a matter of dragging whatever elements you want to where you want them.
(So easy my Mom could do it.)
i. Here is a good place to start: http://www.smashingmagazine.com/2008/05/06/25-wysiwyg-editors-reviewed/
Dear Twinergy,
There is far more to this than I realized! And I have a new found respect for the technical aspects of it! At this time, I will probably have someone create it for me. Thank you for the crash course and putting it into perspective for me.