Communication is extremely important for any business process, and this goes double for the creation of websites. We appreciate that this goes both ways, both in the form of you be able to convey your needs to us, and in what we tell you making actual sense as well. We’re quite aware of the stereotype of computer professionals spewing unintelligible jargon with disregard to whether or not the average person knows what the heck they’re talking about.
In most cases, this is actually the result of two things: professionals don’t want to seem like they’re being insultingly pedantic while explaining things in simpler terms, and sometimes it just takes too long to avoid certain terminology. We feel that the best solution to this is to simply prepare people ahead of time by demystifying some of this jargon before even getting started. In the spirit of this, were going to look at some of the common terminology used when pertaining to the conversion of PSD to HTML below. This doesn’t cover every possible term that can come up, and in many cases, there’s quite a bit more intricacy to a given term than we’re providing. For anyone curious about more in-depth information regarding any of these terms or concepts, we’re more than happy to take the time to discuss them at length per request.
- PSD to HTML: This is the process of converting a Photoshop image design file into functional, responsive HTML web design. PSD’s are created by hand, usually by expert designers, well-versed in visual layout, color coordination, and UX. This has the advantage of allowing a visual, code free approach to creating the basic look and layout of the page.
- PSD: PSD files are complex project files created by Adobe Photoshop and other standard high-end graphic design tools. Unlike a standard image file, they contain complex information such as layers, color information, vector data, and much more. They also contain structures such as folders, and other organizational features which allow for a nice, labeled, organized approach to design layout.
- HTML: HTML stands for hypertext markup language. This is the structured, nested language used to define a website. Alongside instructional logic languages such as JavaScript, PHP, etc., HTML is interpreted by the browser into the visual elements seen when you go to a website.
- Design to code: This is a very generalized term, referring to the process of converting a visual design, usually in this case a PSD created in Photoshop, into the responsive HTML, JavaScript, etc. that comprises a functional, responsive webpage.
- Bootstrap: Bootstrap is a framework developed by twitter, and we’re quite fond of it. This is a powerful framework that utilizes an adaptive grid to enforce standards across development both visually and in code, allowing for websites to be implemented that adapt well to different screen sizes, such as smart TVs, computers, and various sized mobile devices. In other words, it’s an out-of-the-box infrastructure that ensures that the website loads perfectly on every device.
- Email template: Similar to the templates offered by the likes of Microsoft Word, these are general layouts that can be reused to format emails serving a similar repetitive purpose. Have you ever received a corporate email from a company with whom you’re a customer? If they have a unique, crisp layout to them, they’re using a template wherein the body of the actual email is inserted before sending. This is very useful, and should never be overlooked.
- WordPress: WordPress is a content management system, a ready-made framework that allows for an easy to maintain, and easy to update website. Through such a system, you can easily upload new information such as blog posts, artwork, etc. without having to use a complex submission form, or having to completely edit the website to do so. Anyone intending to run a website where new information is posted on a regular basis should look into the use of a similar CMS.
- Pixel perfect: Pixel perfect refers to the highest precision that we can possibly facilitate when converting a PSD into HTML. We take every aspect of the image literally, from spacing, alignment, etc. all the way up to borders, graphical aspects and so on. In other words, aside from scalability, it matches the design in the PSD on a pixel basis.
- White-label: This is a general term referring to branding. If we create white-label code for you, it means that none of the code or design is branded by our company, but rather your own. We design it, we’re compensated for it, but we don’t put our name on it.
- jQuery: This is one of the more widely used JavaScript libraries. Where HTML defines the skeleton of your website, this is where the responsive aspect comes in, such as animation, menus, and other aspects that make your website behave like a program.
- Slice: This is the process where the PSD is cut into individual entities that become various HTML elements.
- Responsive: This refers to designs that adapt to screen sizes, respond to cursors hovering over elements, etc. A website that is not responsive will be static, looking more like a very visually enhanced document and a living, intuitive website.
- NDA: This is a nondisclosure agreement, a legally binding contract wherein a company or companies agreed to not divulge information regarding a project, or the other entities involved. We strictly abide by these per customer request.
- Long page: This is the modern practice of attempting to put as much information into a single vertical page as possible. In the old days, this was done over a series of pages, but with modern resolutions and bandwidth, more information per pages possible. This is generally regarded as two pages of design.
- Markup: This refers to static languages such as HTML and CSS which defined the body, appearance, and layout of a page, but do not contain any logic to produce program like behavior.
- W3C: This stands for the World Wide Web Consortium, an international community which defines, develops, and enforces standards for web design and programming. They’re the ones that decide how things like JavaScript, HTML, etc. work, and are the ones whom determine the standards for how browsers should interpret them.
As said before, many of these terms have much more to them than meets the eye, but this should provide a decent attic glance understanding of what these various terms mean. If you’d like to learn more about any one of these, or other terms related to them, fill out the contact form below. We’re happy to share our knowledge with you.
