views:

383

answers:

5

I'm a little out of date, before HTML4 and javascript got AJAXy. Does anyone have opinions about the best tools for web site design? I'd rather avoid ASP and .NET, since I've got a limited budget. This seems like a good time to start fresh.

Please keep the replies on the coding recommendations, as I already know how to register a domain name, redirect it, set up Apache. (I could use some opinions on the various Apache flavors)

+3  A: 

The site should be designed in HTML. That's the language of web design. How you create that HTML, and how you make the site more user-friendly/interactive, is really dependent on the site itself. If you just want a static homepage, use straight HTML, maybe with some javascript mixed in to make it "flashier" for users. If you need the site to be more dynamic, but not a database-driven web application per se, use php. A full-blown app needs some type of framework behind the scenes - RoR, ASP.NET, Java, a php framework, etc (there are dozens).

If you can make your question more specific to the site you want to build, the folks over on Stackoverflow can provide great feedback. However, a general question like you've asked may just get closed.

Good luck.

Jess
My biggest concerns are about appearance. I've already played with HTML with some javascript and did not feel that it was as stylish as some sites I see online. I understand that may elements of style are in the eye of the beholder, but I'd like to have reactive / dynamic elements and easier writing of non-square and partially-transparent images.
Jereme Hall
Actually, almost all sites online are HTML. They might have flash components, nice images, fancy javascript, etc., but the basic language of the web is HTML. Find a site that you think is REALLY cool and click on view source in your favorite browser. 99% of the time it will be HTML with a mix of javascript and possibly flash.
Jess
So, my question becomes more like... How and where can you learn to STYLE a high-quality web page. (Without peeking at the source of every good looking site).Does such a resource exist? Or is it far too fluid and subjective?
Jereme Hall
Your best bet is to create the design you want in Photoshop first, then create the site from there (this is what most designers do). Styling your site is then more of a paint-by-numbers type activity.
Jess
+1  A: 

Sounds like you are asking about tools/languages for building dynamic websites. I would recommend PHP, not because it's the best, but because it has the lowest barrier to entry. Just enable the Apache module and you are pretty much good to go. Ruby on Rails, Grails, Python are arguably "better" than PHP, and probably better to learn to teach good programming. PHP is very fairly forgiving and is easy to write bad code in.

As for tools, Django or Joomla are very popular, both written in PHP. For Blog style sites I would recommend WordPress (PHP) or Movable Type (Perl/PHP). All of those tools allow you to view/modify the source code and have ways of extending them (i.e. plugins). You could even just stick with creating templates (html, css, javascript).

The best tool for web site design is a free/open source one. There are some really good ones out there.

Brent Baisley
Correction: Django is written in Python.
las3rjock
I figured that I should home in on Python or RoR. I even got RubyOnRails installed and then faltered at the command line. Can I work with RoR using Eclipse? Which would be best or quickest to invest time in (RoR, Python, Grails, other)?
Jereme Hall
Jereme - RoR/PHP/etc will help you generate your HTML pages (or respond to Javascript requests). They will not, by themselves, create nicer looking sites
Jess
Thanks. I had not delved deeper into HTML generating software and, frankly, did not realize that was what RoR and other packages did. I assumed that they helped to generate server side scripts (like php). I confess to ignorance.
Jereme Hall
A: 

Your question is not specific enough.

For the web design itself you just need to code some html (whichever version) and CSS. For javascript/ajax functionality you want to check out the jquery library which is so popular nowadays and has some many advontages.

For a more involved database-driven site there is much choice out there. Since you seem now to programming two choices seem to jump out:

  • PHP programming language with one of its many frameworks such as CakePHP
  • Ruby programming language with its
    star framework Ruby on Rails.

I'd opt for the second based on my personal experience. Being in a similar situation as yours I first started out with PHP and made a big mess out of things. Then I switch to Rails and my skills and abilities took off from there.

Good luck in your quest.

allesklar
A: 

Here are a run down of the languages and concepts of the current web.

Meta Languages: A meta-language is a language created for writing other languages. The meta-languages of the web are both tag based markup languages.

  • SGML - This is the traditional meta-language of the web. SGML is extremely complex that is hardly used aside from its doctype language. Doctype is language written in SGML to provide grammars to describing text types and markup languages grammars to write markup languages without having to learn the complexity of SGML.

  • XML - XML is a meta-language written using SGML. XML was created to provide limited and more specifically defined syntax requirements so that documents could be written for application parsing without interoperability conflicts. Most languages written in XML are written using Schema, which is a specified grammar for describing data structures using the XML syntax requirements.


Markup languages: A markup language is a tag based language for containing data structures. Markup languages are a structure description device and not a data storage device or a presentation device. In other words HTML does not care what your content looks like, because beauty is absolutely irrelevant to its function.

  • HTML 2/3/4/5 - The purely SGML form of HTML. This is what is commonly accepted by user-agents. These languages do not require validation and will tolerate a very high degree of incompetence depending on the supporting browser.

  • XHTML 1.0 - This is also an SGML form of HTML, but it requires syntax differences to conform to the requirements of the XML flavors of the language. That aside it is basically the same as HTML 4.01 but has a couple presentation only elements deprecated and many presentation only attributes deprecated. Since this is still an SGML form of the language validation is still not required even though the syntax requirements are more strict.

  • XHTML 1.1/5 - These are the XML flavors of the language. XHTML 5 is not written at this time, however. Like all the other forms of HTML XHTML 1.1 is written in SGML/doctype language but is required to be served as XML using the XML mime-type for HTML: application/xml+html. This means the page will be treated as an application media instead of a text document. This is important because validation is required, so if there is a syntax error in the code the page will fail and throw an error to the screen. If XHTML5 is written in schema, instead of doctype, then it will also be self-aware of its own structure and supply recommendations for accessibility, semantics, and assisting technologies.


Stylesheets: Stylesheet languages only care about presentation. If you are interested in presentation first then this is where you need to spend most of your time.

  • CSS - This is the stylesheet language of the SGML based web, although it can work with XML just the same. This little more than a list of defined properties where each property has a defined set of values. Usage of CSS can be complicated and takes practice, because the language derives its power from property inheritance in accordance with the structure of the document it is supporting. CSS is created to support various types of output media as well.

  • XSL-FO/XSL-T - These are more advanced and more powerful stylesheet languages, but they are only compatible with XML based languages. XSL-FO is a language designed for presentation and can integrate with the functionality of XPATH for more specific granular control than is allowed by CSS. XSL-T is a language for transforming the grammars of a XML based document structure to a different XML grammar so that data can be exchanged or processed in various forms, such as converting an XHTML page to an SVG graphic.


DOM: The Document Object Model is an abstracted tree graph representation of a data structure into bits called nodes. The DOM can be accessed using various technologies.

  • DOM Expressions - There is actually a defined grammar associated with the DOM and is perfectly compatible with SGML and XML forms of data. Unfortunately, DOM Expressions are incredibly inefficient and should be avoided from use in programming as a result.

  • XPath Expressions - This is an XML compatible technology for accessing the DOM with more specificity than is allowed by DOM Expressions. This technology is very efficient and easier to read and is faster to write. Use XPath for integrating interactivity to data structures where browsers allow.

  • innerHTML method - This is a de facto standard only. This method is only a representation of the innards of a container. Use this and programming techniques in place of DOM Expressions. Bulding a complex set of HTML programmaticaly using JavaScript arrays and join methods and then thrown into the document using a single innerHTML method is 3.5 times faster than using DOM Expressions on average.


Client-side Scripting: These language allow a complete stranger to write code that executes on a user's computers. This code can, in some cases, access the user's file system. It can also open transmission paths to send data from the user's computer without the user's acceptance and even request files for download onto the user's computer that can be executed by the user's operating system. 95% of all reported security vulnerabilities are associated with the following client-side programming methods. No solution to the security problems has been proposed as any such solutions are in conflict with the popular features offered by these technologies.

  • JavaScript (ECMA Script) - This is the standard client-side programming language of the web. It uses a C++ language syntax, PERL regex, data scope from Scheme, and is very powerful. This language was made a standard before it was finished by its original author, as a result there is a wide variance of syntax sloppiness in the language that produces unexpected problems and namespace collisions from lazy authors who do not adhere to current best practices.

  • ActiveX - ActiveX is a Microsoft proprietary technology. This is potentially much more powerful language than JavaScript with regard to efficient and data access, but it is significantly less powerful from a programming perspective due to JavaScript's method for scoping variables. ActiveX has all the same vulnerabilities as JavaScript plus it can allow scripted access to a user's file system and provide a point of code execution outside the executing user-agent. ActiveX is a powerful language with good potential, but it is a security disease. This language must be disabled if you use Microsoft based products for security hardening of the equipment under your responsibility.

  • xmlHttpRequest method - This is a technique invented by Microsoft and is available as a de facto standard. This method is being rewritten by the W3C in order to become a formal standard. This programmatic method allows an executing program to open a transmission path to the originating server or a different unrelated server. This technology is the very heart of the AJAX concept and can be used by malicious logic to download files without prompting the user. The combination of this method and JavaScript can be blamed for numerous security vulnerabilities associated with malicious logic execution that can even occur outside the executing user-agent. This method can also be used with ActiveX to produce the same security vulnerabilities, but can also be used to provide malicous logic a point for memory corruption of the executing user-agent, which provides a security hole to allow malicious logic access to the operating system's memory kernel.


Server side programming languages: These languages execute on the server typically to build dynamically created pages uniquely for a sessioned user with specifically requested data and application output.

  • ASP - This is a Microsoft product that is powerful and widely used. ASP uses a unique syntax.

  • PHP - This is an open source product that is platform independent. It is based on C++ syntax with some modifications to resolve some of the sloppiness associated with C styled syntax. This is a popular and widely supported technology.

  • Java/C# - These are actually fully compiled languages prior to interpretation from the web server. Both of these languages strongly based upon C++. These are commercially managed languages, which means they are continually being cared for and maintained by a commercial entity, and as a result they are incredibly more powerful and efficient to execute compared to comparable unmanaged languages. Java has a large open-source community that creates derivative technologies, such as: Grails, Groovy, Maven, and so forth.

  • Ruby - This is an open-source language with a unique syntax. It is considered a very high end language, which means it sacrifices some amount of execution efficiency for clarity, usability, ease of maintenance, and readability. This language is written for simplicity to allow the language to be learned more quickly than other languages and to be written much faster than other languages with lesser testing requirements.


Databases: All modern databases reliant upon the SQL language, but often feature proprietary extensions of that language.

  • Oracle - An enterprise class commercial database owned by Oracle.

  • SQL Server - An enterprise class commercial database owned by Microsoft.

  • MySQL - An open source and lesser powerful database owned by Oracle.

  • PostgreSQL - An open source database that claims to be more powerful than MySQL.


Transferable Data Storage Devices: These technologies provide a means for storing data in a document for transfer apart form a database.

  • XML - This is not the intent of XML, but this is how XML is most often abused. In this regard XML is easy to read, but it is very large and slow.

  • JSON - This is a data storage format using JavaScript syntax. It is lightweight and efficient.

  • YAML - I dont know anything about this.

That should be enough to get you started.

A: 

For web only site, don't bother with server-side scripting/programming. Stick to HTML and javascript. For interactivity utilize AJAX to the fullest extend. If you want develop full blown web application, consider PHP first, because PHP has the lowest entry cost, compared to other solutions. Its easy to learn, free, open source and is supported by thousands of hosting companies. However exploring RoR, Python and Java (Servlet,JSF) is also good, considered you already have prior knowledge and experience on these languages.

faizal